A Better Way To Do A Menu...

[tomyknoker]

Hi All,

Newbie here I am working on a menu system, and just trying to do it the best way from the beginning... I'd rather get it right from the start... A couple of points:

1. I thought it wasn't good to use tables but without them the last menu button goes to the nest line
2. Dreamweaver's preload function seems very clunky, anyone have a better one
3. I created the images in Fireworks, is this correct... Should I be using CSS?

http://www.tomsynnott.com/test/test.htm

Any help would be greatly appreciated!

[jscheuer1]

It's a blank page.

[tomyknoker]

It's a blank page.Hi there sorry... Have fixed the link!

[blm126]

1. I thought it wasn't good to use tables but without them the last menu button goes to the nest line

This is do to the fact you have incorrect CSS(or lack thereof) not that you aren't using tables.

2. Dreamweaver's preload function seems very clunky, anyone have a better one
It's fine, but unnecessary here. This menu does not require javascript.

3. I created the images in Fireworks, is this correct... Should I be using CSS?
Yes CSS is the best option. Images are not really needed.
I made a quick demo here (http://www.bradyontheweb.com/demo/overline/index.html). If you have any questions on how it works or how to change something feel free to ask.

[tomyknoker]

Is there anyway to make the horizontal keyline be centered and only be as long as the text? Also I love the overline option using CSS... but can I still do this if I keep my text as images? I really like the font I have used...

[blm126]

Is there anyway to make the horizontal keyline be centered and only be as long as the text? Also I love the overline option using CSS... but can I still do this if I keep my text as images? I really like the font I have used...
Not sure what you mean by horizontal keyline. Yes images could still be used with css, but I don't recommend it. If you could give me the font name CSS can make a suggestion to the client to use that font.

[tomyknoker]

Not sure what you mean by horizontal keyline. Yes images could still be used with css, but I don't recommend it. If you could give me the font name CSS can make a suggestion to the client to use that font.Oh the I meant the line underneath the text that spans along the entire browser window... I just want that to be under the text only...

The font is called Lubalin, but it has to be that font that't the only thing...

[blm126]

Oh the I meant the line underneath the text that spans along the entire browser window... I just want that to be under the text only...

The font is called Lubalin, but it has to be that font that't the only thing...
I''l have a look at an image based solution later on tonight.Can I ask why it has to be that font. The downfall of images is the fact that their size does not change when the user increases the font size, and are not viewable to text-only browsers.

[tomyknoker]

I''l have a look at an image based solution later on tonight.Can I ask why it has to be that font. The downfall of images is the fact that their size does not change when the user increases the font size, and are not viewable to text-only browsers.Hi There... It's part of the guidelines to use that font, any luck with the image based solution?

[blm126]

Sorry, completely forgot about this thead. I will need the images if ou really want to go down that road,but I think it is a bad idea. Such a small style issue like using a certain font is not worth the accesibility problems it would cause.

[tomyknoker]

Sorry, completely forgot about this thead. I will need the images if ou really want to go down that road,but I think it is a bad idea. Such a small style issue like using a certain font is not worth the accesibility problems it would cause.
Hi there... I uploaded the images... http://www.tomsynnott.com/images.zip, also why are images a problem... aren't images in all webpages?

[blm126]

http://www.w3.org/TR/WAI-WEBCONTENT/
That will tell you quite a bit about the issue. However, I will also summarise for you.
Some reasons NOT to use images for navigation or important content

CSS and text based navigation is smaller than images. Therefore, the page will load faster. This is important for Dail-up users.
A text solution can be resized by users that may have poor eyesight.
Search engines may have trouble following image links.
Easier to maintain
Allows an online translator to modify the text
Works in text-only browsers(an image solution should also provide alt tags)

Then the reason to use images

Beter control of style

[tomyknoker]

http://www.w3.org/TR/WAI-WEBCONTENT/
That will tell you quite a bit about the issue. However, I will also summarise for you.
Some reasons NOT to use images for navigation or important content

CSS and text based navigation is smaller than images. Therefore, the page will load faster. This is important for Dail-up users.
A text solution can be resized by users that may have poor eyesight.
Search engines may have trouble following image links.
Easier to maintain
Allows an online translator to modify the text
Works in text-only browsers(an image solution should also provide alt tags)

Then the reason to use images

Beter control of style
Well I want that control of style... But I guess will comprimise by making the bar across the top a css style... If you can give it a try with the images that would be fantastic... Did you get the images I posted?

[blm126]

My image-editing skills aren't the best so you'll need to do this. Remove the underline from the images, and make sure there is no padding on the outside of the end images. I only need this for the regular images not the hover ones(I'm using CSS for the overline effect)