SitePoint.com

ucahg · Jul 16, 2003, 21:48

I am currently starting a template with a clean slate and I want it to be as accessible, usable, and standards-compliant as I can make it. That said, I'm not sure what I should do at the fork in the road I am facing.

Should the content be before the navigation or after (in the source code, the layout can go either way via CSS-P)?

I've heard after because (in the case of a screen-reader) no one wants to hear the navigation every page.
But what if they need to use those links? Wouldn't they want to hear them first and have the option to skip them? Or do screenreaders have a skip-to-link functionality built-in, so halfway through the content they can find their way over to the navigation?

I'm not really too experienced in these areas, so if you can help me out, many thanks go to you!

Paul_C · Jul 16, 2003, 23:11

From what I can tell, accessibility nuts want both first. It's recommended that if you have your navigation first that you provide a link before it to skip directly to the content ('cause that's where the user wants to be) and if your content is first provide a link to skip directly to the navigation ('cause that's where the user wants to be.)

My recommendation - if you are able to put your content first, excellent. If not then try to keep your list of navigation links small so it's not too painful to hear them each time you turn the page.

// e · Jul 17, 2003, 11:30

i've seen some examples (like http://www.meyerweb.com/) that have a "skip to site navigation" link at the top and then dive right into the content. content first, i think, is best. better for SEO and probably better for folks that use screen readers (so then don't have to listen to a bunch of links and stuff right off the bat).
check out eric's site (the link above) with NN4 if you have it... "degrades" very gracefully and is still totally accessible/useable.

// e

redux · Jul 18, 2003, 05:42

as has already been pointed out, there's two schools of thought really: navigation first, with a skip nav link to go straight to the content, or content first, and then using CSS to move it visually before it. both are valid methods, imho. the CSS one may give you more flexibility, as you can then offer alternate styles (nav left, nav right, nav top or something)...but then again, you can use method one (nav first) and still use CSS on top of that to position it further.

ucahg · Jul 18, 2003, 06:50

Thanks for all the advice , I think I'll stick with the navigation after the content.

xhtmlcoder · Jul 22, 2003, 08:17

As long as the headings follow a logical order, and you have a good tabbing index order then that is half the battle completed.

Webnauts · Jul 26, 2003, 17:24

Quote:

Originally Posted by ucahg

Thanks for all the advice , I think I'll stick with the navigation after the content.

I hope you are still open for one more suggestion.

Please be so kind and have a look at this article, before you take any further actions:

http://infocentre.frontend.com/servl...article&id=150

Thanks and good luck!!!!

Webnauts · Oct 8, 2003, 16:13

If you place the "Skip Navigation or to Content" link before the logo, the users of Screen readers would not need to hear everytime the logo alt tag (your company name) when they browse to other pages of my site. On the other hand the users could not be sure if they are still on your web site.

Jul 16, 2003, 21:48	#1
ucahg SitePoint Evangelist Join Date: Apr 2001 Location: Sarnia, Ontario, Canada Posts: 434	Navigation before or after main content? I am currently starting a template with a clean slate and I want it to be as accessible, usable, and standards-compliant as I can make it. That said, I'm not sure what I should do at the fork in the road I am facing. Should the content be before the navigation or after (in the source code, the layout can go either way via CSS-P)? I've heard after because (in the case of a screen-reader) no one wants to hear the navigation every page. But what if they need to use those links? Wouldn't they want to hear them first and have the option to skip them? Or do screenreaders have a skip-to-link functionality built-in, so halfway through the content they can find their way over to the navigation? I'm not really too experienced in these areas, so if you can help me out, many thanks go to you!

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Jul 16, 2003, 23:11	#2
Paul_C Rabble Rouser Join Date: Jan 2003 Location: Mountain View, CA Posts: 431	From what I can tell, accessibility nuts want both first. It's recommended that if you have your navigation first that you provide a link before it to skip directly to the content ('cause that's where the user wants to be) and if your content is first provide a link to skip directly to the navigation ('cause that's where the user wants to be.) My recommendation - if you are able to put your content first, excellent. If not then try to keep your list of navigation links small so it's not too painful to hear them each time you turn the page.

Jul 17, 2003, 11:30	#3
// e SitePoint Enthusiast Join Date: Jun 2003 Location: los angeles Posts: 72	i've seen some examples (like http://www.meyerweb.com/) that have a "skip to site navigation" link at the top and then dive right into the content. content first, i think, is best. better for SEO and probably better for folks that use screen readers (so then don't have to listen to a bunch of links and stuff right off the bat). check out eric's site (the link above) with NN4 if you have it... "degrades" very gracefully and is still totally accessible/useable. // e

Jul 18, 2003, 05:42	#4
redux gingham dress, army boots... Join Date: Apr 2002 Location: Salford / Manchester / UK Posts: 4,856	as has already been pointed out, there's two schools of thought really: navigation first, with a skip nav link to go straight to the content, or content first, and then using CSS to move it visually before it. both are valid methods, imho. the CSS one may give you more flexibility, as you can then offer alternate styles (nav left, nav right, nav top or something)...but then again, you can use method one (nav first) and still use CSS on top of that to position it further.

Jul 18, 2003, 06:50	#5
ucahg SitePoint Evangelist Join Date: Apr 2001 Location: Sarnia, Ontario, Canada Posts: 434	Thanks for all the advice , I think I'll stick with the navigation after the content.

Jul 22, 2003, 08:17	#6
xhtmlcoder Robert Wellock Join Date: Apr 2002 Location: A Maze of Twisty Little Passages Posts: 1,862	As long as the headings follow a logical order, and you have a good tabbing index order then that is half the battle completed.

Oct 8, 2003, 16:13	#8
Webnauts Organic SEO Expert Join Date: Jun 2003 Location: European Union Posts: 1,577	If you place the "Skip Navigation or to Content" link before the logo, the users of Screen readers would not need to hear everytime the logo alt tag (your company name) when they browse to other pages of my site. On the other hand the users could not be sure if they are still on your web site.