Skip to Navigation

Skip Past Content, Not To It

The separation of a web site into structural, presentational and behavioural layers is the key to making a usable, accessible and future proof web site, and the fact that CSS and unobtrusive Javascript allow us as developers to do this has been a major factor in the uptake of web standards. The reason this separation is so important lies in how it allows so many devices to access your data in so many ways. Mobile phones see a different version of your site to Safari, which sees a different version to JAWS yet all access the same mark-up and the same URL. Maintaining this separation intelligently is the key to allowing as many users as possible to access to your data using any means they want.

Many web developers are still falling quite short of this separation, not because they are using tables for layout, inline styling or obtrusive javascript but because they are ordering their mark-up not by how it is used but how they want it to appear. The structure layer of a web site should focus on enriching your content semantically to provide a user with the content they need in the most accessible way possible. This doesn't just mean using suitable heading hierarchies, lists and labels but also ordering your content properly to provide suitable focus to the most important parts of the page.

Users who visit sites with devices that support limited or no CSS, or with devices that do not display your content visually do not see your content in the organised columns and colours that most do--they will be browsing your site in a single column ordered as your mark-up is and this often means they first receive a long list of navigation items, logos and introductory paragraphs when what they really want is the latest article, train time or number of goals Thierry has scored today.

There seems to be a growing trend for developers to include 'skip to content' links as a solution to this problem. These links bypass the navigation and header elements and move the user straight to the content, but users still have to move around a page instead of being served what they want straight away. This technique also fails to account for other ways in which your data is accessed; search engines indexing your pages may rank prevalent content more highly for example, and they won't use skip links to pursue the content you deem most important on the page. Although I am not an SEO expert I can't believe that important, relevant elements at the top of a page won't have more influence on a search engine in how it interprets the meaning of your site.

There are plenty of CSS techniques that can be used to separate your page structure from appearance, not least the excellent techniques devised at Position Is Everything for creating columns of mark-up positioned in any order on the canvas. Just remember that the most important column is the one containing what the users came for.

Leave A Comment

Some HTML is allowed, (general text-formatting and linking). Images and complex HTML is not. Abide by the rule ‘I shall think before I speak’ and you’ll be fine.


More About This Entry

The entry ‘Skip Past Content, Not To It’ was posted in the ‘long’ category on the 29th April, 2006.

There are no comments on this entry.

You Might Like This

A randomly selected something that you might enjoy. I may have been involved with some of them.

Flickrshow


Stay Up To Date

There are a number of RSS feeds that you can subscribe to if you want to stay up to date with this site.