Web accessibility for designers [useful infographic]

WebAIM is a site that I have recommended to many designers, template users and site builders. But I don’t think that I have written about it on andreasviklund.com before. What caught my attention today was a simple but very useful infographic on points worth keeping in mind to improve the accessibility of the site you build. You will be able to see it at the end of this post.

First a few words about accessibility and design philosophies

Accessibility is not only good because it makes your content browseable by more people, it also goes hand in hand with several of the improvement points that I refer to as “CoSeOp”, or Common-Sense Optimization. With that I do not only mean search engine optimization, where the target is to make the website improve its positions in the search results. No, I mean creating an overall philosophy that explains the overall purposes with the site from the viewpoint of the web designer, along with creating a suitable visual style, a solid and user-friendly code structure and a coding process that makes the end result a good one.

My way of doing it: ILEVA

Personally, I follow the ILEVA philosophy, where I have shortened down five separate targets (“Independent”, “Lightweight”, “Elementary”, “Valid” and “Accessible”) which I want all my designs to match once they are released. A template built with the ILEVA mindset will be a template which will work great for anyone who wants to use it – at least in terms of its structure. It will be SEO-friendly from the start, it will work in any major web browser and with the most popular accessibility tools, it will be easy to work with thanks to the fact that simplicity is a feature in itself. And the code you start working with will follow established web standards such as XHTML 1.0 Strict, html5, CSS2 or CSS3. Just to give a quick rundown of the ILEVA idea. I will be writing a lot more about ILEVA, as it has started growing into something bigger than just a checklist for my own personal use.

Infographic: Web accessibility for designers

But for now, let’s focus on Web accessibility, specifically for designers. Here is the infographic from WebAIM. Click on the image to go to the corresponding resource page on WebAIM.org. Now, keep in mind that these are short recommendations only. I may possibly write another blog post where I dive deeper into each point on the check list. But still, these are great advices:

accessibility, CoSeOp, ileva, SEO, templates, web standards