Wandering Thoughts archives


An advantage of CSS layouts for accessibility

One of the charms of blogging is that you get to make mistakes in public. So, I'll start off by saying that I have to retract some of what I said in CSSvsTables, because a CSS column-based layout can be more accessible than a table-based one in some situations.

This is because one important part of accessibility is putting the important or changing content first in your raw HTML, and your navigation and other boring stuff second (so that screen readers and other things that more or less just go through your text in order can read out the interesting stuff first).

Table cells are laid out in order in the raw HTML, left to right and top to bottom, so the top left table cell is first in the HTML and the bottom right one the last. Thus, if you want a sidebar on the left of your design it has to come before your main content in the raw HTML.

CSS lets you reorder content, so that the linear order in the raw HTML is not necessarily the order on the screen. This means that your left sidebar can be towards the end of the page and shuffled into its physical position later, and you can generally make it so that your interesting content is very early in the raw HTML, no matter where it is on the page.

(And all of this is ignoring the tricks that are possible once you start injecting things into the page with JavaScript.)

This is probably more relevant to three-column layouts than two-column ones, because if you have a two-column layout your content should be on the left anyways for reasons covered previously.

web/CSSAccessibilityAdvantage written at 20:56:30; Add Comment

Page tools: See As Normal.
Login: Password:
Atom Syndication: Recent Pages, Recent Comments.

This dinky wiki is brought to you by the Insane Hackers Guild, Python sub-branch.