Making your site accessible

The word ‘accessibility’ is something we hear a lot of on the Internet these days, but what does it actually mean? Why is it important to make your site ‘accessible’? Why should you care?

Making your site accessible means to make sure that as many as people as possible can use your website. Each of your visitors is unique. Not all of them are running Firefox on a PC running WindowsXP at 1024*768. As a webmaster, it should be your job to accommodate as many people as you can. As a person who puts lots of TLC into their site, you should want to accommodate as many people as you can.

Making your site accessible is not as hard as you may think. In fact, most of it is just common sense. I find it helps to make a list of every type of visitor you need to accommodate for. Here are some common types of visitor:

Let’s tackle these one at a time.

People who aren’t using a mouse

Not everyone uses a mouse to surf the web. Some people physically can’t, and some people just choose not to. Most, if not all, computer programs have keyboard shortcuts (like ctrl+c for copy), so why not include keyboard shortcuts in your webpages?

<a href="index.php">home</a>

That’s a simple link on your website, and we can ’soup it up’ using accesskeys.

<a href="index.php" accesskey="h">home</a>

accesskey="h" assigns the letter ‘h’ to this link. So, visitors using keyboard shortcuts can jump straight to this homepage link rather than having to ‘tab’ through all the other links in the page first. Rather useful, don’t you think? And it’s very easy to implement, so there’s no excuse! Go and put accesskeys in your main navigational links right now. Don’t forget to make a list of the accesskeys somewhere on your site so people know which key is for which link though.

People who are using a browser which doesn’t support CSS

So, you’ve designed the most beautiful site in the world. You’ve got your background images to align perfectly, you’ve got a beautiful font, you’ve got pretty borders on your tables and your link hovers are to die for. What happens if you turn off CSS?

It happens. This is where ’semantic’ coding comes into play. You need to make sure your site is structured properly so that everything makes sense. Are you using <h1> tags for your headers? Are you laying out your site using <div> tags rather than tables? Are your navigational links inside a list of some sort? If you’ve answered ‘no’ to any of these questions, you have work to do.

To test what your site looks like for browsers which don’t support CSS, simply delete/rename your stylesheet. Then load the page again, and it’ll load without applying any styling. If you’re using FF, you can simply click ‘view > page styling > no page styling’ and that will turn off CSS.

If your site still makes sense, you’re doing well. Keep up the good work. However, if your site looks all over the place and you’re seeing your footer before your content and your navigation looks like someone vomited on the screen, then you need to work on your coding.

People who have Javascript / Flash disabled

Are you using Javascript for your navigation? Do you have a lovely Flash header with fun hovers on your links? This is great for people whose browsers support Javascript and Flash, but what happens to the visitors whose browsers don’t have support for Javascript / Flash?

‘But everyone has Javascript!’ you may argue. And you may be right. Many, many browsers these days support Javascript. However, it’s Javascript that causes all those pop-up and pop-under adverts. It’s Javascript that can start blaring music people when they enter a site. Because of this, some people decide to turn-off Javascript, thus eliminating the annoying adverts and music. However, this also means these people won’t be able to use your Javascript navigation.

If you absolutely have to use Javascript for your navigation, at least employ use of the <noscript> tag to provide navigation for people who aren’t supporting Javascript. Trust me, they’ll appreciate it. Of course, they’ll appreciate it more if you don’t use Javascript at all.

As for Flash, more people don’t have this browser add-on installed. There’s reasons for and against Flash. Flash slows down loading times and if used badly, can just end up coming across as tacky and making the webmaster look amateur. You should use Flash because you have a valid reason for it, not just because you can.

People using a text only browser

Some people use a text only browser. This means no images! So don’t use the <img> tag for your navigation, don’t use images for your headers, don’t use images for your copyright notice, and don’t use images for your content! If you have to use images (and believe me, I know pretty much all of us do) for one reason or another, you must try to put in worthwhile alt attributes.

“headerpicture” is not a worthwhile alt attribute. For images that are purely decorational, a blank alt attribute will suffice. If you use images for your navigation, why not use the text on the image as the alt attribute? It will make much more sense to your visitors who are using a text only browser.

People with less than perfect eyesight

Hands up who wears glasses. *raises hands* Me and millions of others. You may be able to read your 7pt font, but we cannot. Remember how you were in school (or if you still are) and your teachers would insist you use at least 10pt Times New Roman for your essays? Well, the same principle applies to the web. Small fonts are not good for anyone. Big text is awesome. Why? Because it’s readable! And surely that’s one of the most important things to you as someone who makes a website? Your thrilling blog entries and articles are pointless if no one can read them.

Now that we’ve covered the aspects accessibility fiends rant about, let’s move onto another aspect you might want to take into account when designing your website: the browsing habits of teenagers.

In general, teenagers browse the internet late at night whilst doing a million other things. They’re listening to music and downloading the latest podcasts from iTunes. They’re having IM conversations with sixteen different people at once. They’re researching for the English essay that was due in yesterday. They’re looking up dirty words on Wikipedia (or is that just me?) They’re checking their three different emails, their MySpace, their Facebook, that t-shirt they want from eBay, and their favourite forum. And then they come across your site.

Is a 300 pixel wide site with teeny tiny dark grey text on a black background with pink splats, broken hearts, and skulls really going to want to entice them into staying on your site? Or are they going to move on, and miss out on all your awesome content?

Don’t bombard your visitors with music - that’s iTunes’ job. An internet browser is quicker to shut down than iTunes, and that’s what your visitors will do to make that awful sound go away. The pink splats and the broken hearts and the skulls might help your visitors relate to you, but it takes more than that to help them truly understand the point of your website. Dark grey text on a black background may look beautiful to you, but it won’t look beautiful to tired eyes at 2am when they’re sleep deprived and half asleep. Increase your text contrast please! If you’re using #000000 as your background colour, don’t ever use a grey darker than #999999. Your visitors will appreciate it, trust me.

Where possible, try to keep your site’s loading time as short as possible. The ‘internet generation’ expects high speed, so don’t let them down. Of course, this is another reason to do away with Flash and large images, which both add precious seconds to your loading time. If you have two similar sites, and one takes 1 second to load whilst the other takes 15 seconds, which one are you going to look at? The only reason you’d go for the 15 second site is that you love the webmaster, but then you’d curse at them for having such a slow site.

Final notes

Remember that not everyone viewing your website is not like you. Each of your visitors is unique, and you should respect that. As a webmaster you need to make your site accessible to as many people as possible. As a human being who looks after their website, you should want to make your site accessible to as many people as possible. Don’t discriminate. Don’t take the “oh well, it’s their loss” attitude. If you can do something about the problems with your website, do it!