Often we think of navigation as a set of links or "a" tags, but often in our haste to create a layout we ignore accessibility. Browsers are not the only thing reading our site and we must make our site easily navigable for everyone or everything. Search engines and screen readers read the site without the design, they read it simply as data, thus it becomes important to set something up as important as nav with a logical hierarchal structure. Lists are the ideal format for this.
lets, for example assume the following list is our navigation:
Obviously there is a small problem with a list though, There are bullets and it doesn"t display like a nav. Luckily there is a very simple solution achievable through CSS. By giving our ul tag a simple property list-style:none; we can essentialy tell the browser that our nav is a list in data organisation only. With this property, the above navigation would look like this:
With a set of simple styling to the a tags, this nav could quickly become just like a nav system we are commonly familiar with but with the added benefit of properly formatted data that will make it much more accessible when viewed by machines.
Print Entry
