Using technologies wisely to build more accessible websites

Feb 4
11:08

2007

Diego Ponce de León

Diego Ponce de León

  • Share this article on Facebook
  • Share this article on Twitter
  • Share this article on Linkedin

Once you're ready to build your web site or web page you begin wondering how you are going to build it. Will it have tons of animations and interactivity? Will I fill it with graphics? How will all that affect the navigation, comprehension, accessibility and download time of the page? What are the things you need to consider when deciding which and how technologies will be used in your website?

mediaimage

Each website has an optimal design that fits perfectly to its thematic,Using technologies wisely to build more accessible websites Articles requirements and visitors' type. For example, a web site offering e-cards will certainly need to catch the visitors' eyes, using images, animations and interactivity, while a site dedicated to science, teaching or investigation may not need any of those to show up their information and contents.

The amount of animation or interactivity will certainly affect the accessibility of the web page given that the technologies used to provide this type of content are usually not supported by user agents or many times not designed for people with disabilities. To consider how many people you could be letting behind I will base my study on the statistics of this site (HTMLQuick.com) which is completely accessible and provides a lot of textual information.

To look at some round numbers I will say that if the content of the site would be completely based on Flash or JavaScript we would be loosing from 1.77% to 4.55% of the visits due only to the lack of technologies, which could be a very large number of visitors if the site is successful. But lets take some considerations based on the most popular and problematic technologies available.

Flash

Flash is a great way to build animations and interactivity but could also be a big accessibility problem. Creating a website completely in Flash could let out a 2.78% of the visitors and make the site completely empty for search engines, which may be your primary inconvenience.

Many sites will look at Flash as a primary necessity while others may only use it for animation or won't use it at all.

- If your site doesn't need it, then try to use it only for animation or providing rich alternative texts. - Avoid building menus in Flash, as user agents not supporting it will not be able to follow their links. - Export the swf files using the lowest version possible. Only a 69.2% of the visitors use the latest version. The rest 29.03% will have to download before playing the movie. - Try to make the movie size as little as possible so people don't get bored waiting for the page to load. There are still an 11.83% of visitors using dial-up connections.

JavaScript

JavaScript has similar issues to Flash. Many user agents won't support it, including search engines robots. A 1.77% of the visitors won't be able to see the information written in JavaScript nor follow the links.

- If possible use it only for not necessary interactivity and functionality. - Otherwise, provide alternative static content in the "noscript" tag. - Don't make it necessary to follow a link. Use the "location.href" command as the "onclick" event in a static link ("a" tag).

Frames

Frames are nice, but should be definitively avoided. While most of the user agents support frames, search engines, as well as blind people, could be seriously confused when trying to relate the information contained in the different pages of a frameset.

Images

Images, even when not accessible, are a more benevolent alternative to Flash animations.

- Always prefer the use of images instead of Flash animations. - Keep them small in size to reduce the page load time. - Always provide the most appropriate alternative texts that better describes the purpose of the image.

Some ways to generally avoid the use of conflictive technologies is to opt for more common or more supported types of information. One of the best alternatives to set the look of a website is CSS. CSS is specially designed to set presentational attributes. Use it instead of tables to set layouts.

Anyway, some sites will necessary use some or all of these technologies to display their primary content. For example, an e-cards site may need Flash to display the animated and/or interactive cards (primary content). But when the use of these technologies is not a necessity, avoiding their use to provide primary content will be good for your visitors as it will be for you.