posted
Eliminating the frameset should probably be your first step, since it'll speed up the page a LOT and you don't seem to actually use frames for much, anyway.
What you want to do is research the use of either tables or CSS to duplicate the navigation you're using frames to create. If you go the table route, I recommend looking into SHTML; it'll make it easier for you to display the same header and footer on every page. If you go the CSS route, SHTML won't be as necessary.
Since you don't know much about tables at this point, I'd actually recommend that you devote time to learning CSS; it's easier to learn positioning with CSS than it is to unlearn using tables for positioning and move to CSS, and everyone's pretty sure that CSS is the way things are going to be positioned from now on.
And for a site as basic as the one you've laid out, I'd really go with hand code rather than muck around with Dreamweaver or GoLive; both are perfectly capable tools, but it's a lot more interesting to figure out what's going on under the hood by doing it by hand.
That said, here's how I'd go about making the changes:
1) Identify your primary navigation elements. You have a left-hand link bar and a top navigation/logo bar. That's pretty standard, which means that a lot of existing CSS templates out there would work for you (if you didn't want to do this from scratch).
2) Decide whether you really need a splash screen to redirect people to two different pages, or whether you could combine both of those into a single page.
3) Research how to use the DIV tag in CSS to create your navigation elements. To reproduce your site would only require a few DIVs. You can Google these keywords for step-by-step instructions from a number of sites.
4) Rewrite your content to include only the text you want, organized into the appropriate DIVs.
5) Write your CSS file to define the position, color, and size of your DIV elements (and other things like your BODY colors, text, links, etc.)
Posts: 37449 | Registered: May 1999
| IP: Logged |
posted
The syntax is easier than it sounds. Basically, it's just a matter of remembering the names of the various properties each element can possess (like font-size, background-color, etc.)
Looking at examples really helps, and should give you the idea faster than any explanation would.
Posts: 37449 | Registered: May 1999
| IP: Logged |
posted
Keep in mind that while CSS is the wave of the future, it's still the wave of the future. Tables are still standard.
Posts: 26077 | Registered: Mar 2000
| IP: Logged |
quote:Keep in mind that while CSS is the wave of the future, it's still the wave of the future. Tables are still standard.
That's not really true.
Tables are still used for layout on many sites, but I doubt more new sites (ones not tied in some way to an existing template) are created with tables.
It's kind of like saying plaster and lathe is standard wall covering because it still exists in millions of homes (although of course the time frame is very different).
CSS certainly isn't just the wave of the future. It's used now, on many sites, and has measurable benefits for those sites.
Posts: 26071 | Registered: Oct 2003
| IP: Logged |
posted
AJ-- I'm convinced that you're smarter than me, and I didn't have a terrible time doing basic CSS. The biggest help was this help site, by the Web Design Group. Fugu's recommendation of csszengarden.com was also a big help.
posted
Were you seriously developing a kennel markup, Russell? I was joking, but I could see that kind of thing being very useful to dog breeders and enthusiasts -- especially if they usually lay out pedigree tables the way we see on Lead's site.
Posts: 37449 | Registered: May 1999
| IP: Logged |
posted
Yep, I am (again). I'm somewhat frustrated because I must do the XML version, so's common dog software will be able to export/import it if they so choose, because the programmers are not going to be familiar with RDF in almost certainty.
The RDF version is much prettier.
It'll make things like generating pedigrees in many formats very, very easy.
Posts: 15770 | Registered: Dec 2001
| IP: Logged |
posted
The nice thing about this is, that I can chalk it up to learning at work, because they want all of us to become proficient at least putting words on a web page. I've got a lull in work projects at the moment. Here it's either chaos craziness with projects or very little, and I'm now on the thin end of the cycle.
fugu gave me this website last night on IM. I think I need to do the HTML tutorial at least partially first, because my HTML skills are weak. I've never done direct coding, always let Dreamweaver do it for me. I understand and respect the value of it though.
I definitely have some sort of mental hangup on this stuff. I'm not sure why. Yes it isn't a "programming language" persay, but I've never really liked coding. Did Dr. Logo way back when as a kid and then beginning fortran in the required class in college. (Would have rather taken Basic but I couldn't fit it in my class schedule)
I know this is something I *need* to care about for both my personal and professional life. I think it's because it doesn't come as instinctively for me as straight math or chemistry does. I'm sure I'm perpetuating it in myself because I feel inferior. Even though my dad has had computers in the family since the 8088 PC, we never had internet access. Other than brief library research, I didn't use the internet or have e-mail until I went to college at 18 (1997). A large majority of my friends were on the world wide web at much younger ages, and know far more hard-core coding and programming because they had to know it to be on back then.
I had another, less technical friend reccommend this site to me for reference http://www.htmlgoodies.com/primers/html/article.php/3478141 however I know some of their information is outdated or faulty. I think the difference between the two tutorial programs though exactly demonstrates the difference in "sex appeal" in site and content. In this case the goodies site has a lot more sex appeal in how the tutorials are presented (in a more "for dummies" mode without making you feel dumb) while the w3 school site, is much more boring and technical albeit more comprehensive and correct.
Either way I'm going to start plowing through them and see where I get.
Blog is working, though I need to change the design-- it's not consistent with the rest of the site. Ditto the Contact link. (MUCH thanks to EJS, who helped get these two functional)
Fixed the headers' background.
Added a placeholder for the Writers' Resources section.
Posts: 14554 | Registered: Dec 1999
| IP: Logged |
posted
I updated the site (www.lordofallfools.com) with some Free Foolishness, and now the nav bar on the left gets all whacked down.
But only in IE.
Why is that?
Also, I removed the link to the blog, which I couldn't figure out how to get to match the rest of the site; I'm considering using word press to make the rest of the site match the blog, if I can ever find a template that works and doesn't make me want to scratch my eyes out.
Posts: 14554 | Registered: Dec 1999
| IP: Logged |
posted
I love that you added content, but I'd put it in the middle. As it is, I hae to scroll down to see it, and there's lot of empty space in the middle and on the left. Since it is a list of links, maybe you could put it in the box on the left?
Posts: 26077 | Registered: Mar 2000
| IP: Logged |
posted
I'd follow Kat's initial advice and put the freebie stuff in the middle (below the intro) with a teaser from each piece.
Also: I don't know how you are doing this, but you should be able to set up the site so that each section can be fed by a blog (or at least the middle section). This can make for much easier updating and archiving of material.
Also: The blog link doesn't appear on the main page -- only on the individual pages.
Keep at it, Scott. The building is hard work, but you have a major advantage over many, many Web sites out there: good content and the ability to create more good content.
Posts: 3423 | Registered: Aug 2001
| IP: Logged |
I'm using wordpress as blog software-- I'd love to be able to just link the content of a blog to my design.
Posts: 14554 | Registered: Dec 1999
| IP: Logged |
posted
I'm not a big fan of white text, but I have to say that I like the look of the site.
RE adding the blog to the main page:
I don't know. I haven't played around with Wordpress -- you should be able to point the xml feed of the blog to the main page so that it published the results of the feed. You then should be able to edit the feed so that it publishes the headlines and the first few sentences of each blog post (or just the headline, or a headline and a summary, or the headline and the full post).
Posts: 3423 | Registered: Aug 2001
| IP: Logged |
posted
I like the new "Lord of all Fools" logo. I'm not sure about the little crayon dude, though.
Edit: and I dislike "entry" pages in general, although at least yours has a tiny bit of content on it.
Posts: 9866 | Registered: Apr 2002
| IP: Logged |
posted
Human: I like the black and white look for right now.
dkw: The entry page was supposed to be a little more complex than that-- I was going to have the LOAF Face centered on the page, and when you scroll over it, it becomes the poem. Clicking on the poem would take you to the main page.
But that seemed a tad complex, and anyway, I can't program in Java.
More than anything else, I wanted to get the LOAF poem out in front of the website, as I feel it sets the tone rather well-- a little creepy, a little light.
Posts: 14554 | Registered: Dec 1999
| IP: Logged |
posted
Can you do a mouseover of text? Or does he have to make his poem an image? I believe if he uses div tags and css he can probably do a mouseover of text. Isn't that suppose to be called dhtml?
Posts: 1209 | Registered: Dec 2003
| IP: Logged |
posted
Here's what you do: make your a tag display: block, and wrap all the text in it in some tag (a span, perhaps). By default, have the background image on the a tag be the LOAF face (you'll need to set the size appropriately so this is entirely visible) and the span (or whatever) inside the a tag be invisible. Then define two rules, a:hover span and a:hover. The former makes the span visible, the latter removes the background image.
Posts: 15770 | Registered: Dec 2001
| IP: Logged |
posted
I'd like to make a selectable menu of poems, similar to what OSC has in his online library.
How do I go about this? I've got it appearing right, but clicking the 'Go' button doesn't take me anywhere. I'm assuming I need a script of some type; how/where do I set this up?
EDIT: While I'm wishing for help, what I'd REALLY like to do is have the poems display on the same page as the drop down box. That way, the viewer can select, read, select another, read. . .
[ November 16, 2005, 03:45 PM: Message edited by: Scott R ]
Posts: 14554 | Registered: Dec 1999
| IP: Logged |
quote:I've got it appearing right, but clicking the 'Go' button doesn't take me anywhere.
*giggle* You did that exactly backwards, Scott. Here's a tutorial on setting up the kind of drop-box you want, although it describes how to redirect (and not display content inline): http://www.pageresource.com/jscript/jdrop2.htm
It's relatively easy to set up what you want using DHTML. Basically, write or find a Javascript that enables you to select items from a drop-down list. Then, instead of triggering a page load or redirect, change the content of a CSS object (probably a scroll-enabled layer). You'll probably want to create each poem as a separate HTML file so that you can simply include the file rather than having to write Java to display it (which can be onerous).
Posts: 37449 | Registered: May 1999
| IP: Logged |
posted
An even better way of doing this, since the poems are all text, is to actually load all the poems right off in divs, set not to render ( display: none). Whenever someone selects a poem from the dropdown list, use javascript to set all of the poems to display: none (getting rid of whatever's currently being displayed) and then set the desired poem to display: block.
The best way to do this is by having classes with the appropriate styles in them, then setting the appropriate class.
The values of the dropdown options should be the ids of the poems.
<div name="poem" id="poem1" class="visible"><!-- this will be the poem visible when the person goes to the page; this should be the first poem in the dropdown, as the dropdown only activates onchange, meaning if the person tries to select the first poem right off it won't work --> <p>The first poem!</p> </div> <div name="poem" id="poem2" class="invisible"> <p>The second poem!</p> </div>
The code works fine in Firefox/Mozilla, but in IE, it adds new selections to the end of the old selections-- so the page keeps growing, and growing. . .
EDIT: Historian, that code seems to make ALL the text on the page invisible when a poem is selected. . .
Posts: 14554 | Registered: Dec 1999
| IP: Logged |
posted
Kat, dkw, all IE users-- I included some instructions to make viewing the Frivel and Schleck a little easier:
Select the first poem you want to read. After reading, click refresh-- this will return you to the default, grumpy writer warning. Then select another poem.
posted
It would be really cool if the poem came up right under the drop down box and relegated the grumpy writer stuff to the bottom.
I'm looking in a little screen, and at first I didn't realize the poem was there, since I had to scroll down to find it.
Posts: 9866 | Registered: Apr 2002
| IP: Logged |
posted
Yeah there was an error in the code and it doesn't like it when the Div elements don't have names. If we switch the Poem Div elements to Span elements then we won't have to worry about it as they will all have a name attribute of "poem" and it will still display the same way.
code:
<script type="text/javascript"> function showPoem(poemId){ poems = document.getElementsByTagName('span'); for(var ii = 0; ii < poems.length; ii++){ var AttrSpan = poems[ii].attributes; var Attr = AttrSpan.getNamedItem('name'); var Val = Attr.value; if(Val = 'poem'){ poems[ii].className = 'invisible'; } }; newPoem = document.getElementById(poemId); newPoem.className = 'visible'; } </script>
-OR-
You can make sure all of the Div elements have a name attribute.
Posts: 80 | Registered: Nov 2005
| IP: Logged |
1. I think your graphics and logo are too big. I have to scroll for all the content, and it means that all the pages sort of look alike because the part that changes is under the fold. I think if you either make the jester and logo smaller or put them all on one side and skinnier, it would be easier to see the content.
2. Include the title of the Frivel and Shreck poems at the top of the text of the poem, unless these are of the kind of poems that don't really have titles and the titles in the list are for convenience's sake.
Posts: 26077 | Registered: Mar 2000
| IP: Logged |