Archive for January, 2008
published by Dan in Accessibility
When talking about accessibility although it is often used to refer to ensuring that web sites are accessible to people with disabilities it actually has a larger scope and actually addresses accessibility of web sites to EVERYBODY. Sure enough when designing web sites the accessibility to the majority of users are always considered, which is why the topic is not really fall under accessibility but usually focuses on usability when it comes to the majority of users. When it comes to the minority of users who might encounter difficulty in being able to view a website, this is when the issue of accessibility takes center stage.
So when is accessibility an issue? It is an issue when the user:
- has any disability - Whether this be visual impairments, motor dysfunctions, auditory impairments, cognitive/intellectual disabilities. This is true for any medical condition (like seizures) that result in special consideration of the user’s needs in order to be able to make the accessing the website possible and safe.
- uses a non-standard platform/device - This pertains to both software and hardware. For software alternative operating systems and web browsers might be used. For hardware mobile devices (i.e. newer mobile phone models) might be used.
- uses a computer with lower specs - There are dinosaurs still in existence or simply people who prefer lower resolutions. Make sure the websites is still viewable even then.
- has a slow internet connection - Always consider the needs of those with dial-up connections by giving an alternative version to graphic-heavy sites and offering lower resolution/smaller sized downloads.
published by Dan in Accessibility | Usability | Website Design
Perhaps the tip that beats all accessibility tips is the simplest one - to test your website using a screen reader. Even if you do follow accessibility guidelines chances are something will get overlooked. Testing the site with a screen reader is plain common sense. However, when testing with a screen reader it is best if you do this:
- as you build your site - Test the site as you go along. Just like in anything waiting till the very end to find if there are any bugs is a huge mistake. By testing the site with a screen reader periodically you can catch small mistakes before it becomes more difficult or at least more tedious to address.
- with your eyes closed - Let the screen reader do the reading for you. Listen to the output with your eyes closed to see if it makes sense. Although the screen reader might report things accurately you will realise that many times what seems to be easy to understand with the context of the layout right before your eyes might be a bit more difficult if your don’t see it. This way you can adjust certain elements to not only help accessibility but also usability. Note too that listening to the screen reader with your eyes open might bias you in what you hear.
- with your eyes open - Not to contradict myself, but you should also listen with your eyes open aside from with your eyes closed to check for errors.
- on test users - Make sure you include visually impaired people to help you with usability testing.
published by Dan in Accessibility | Usability | Website Design
- Keep empty form fields empty - Although I have observed the trend of inserting sample text into empty form fields as placeholders there are still websites that do this. This shouldn’t be done since most screen readers (except the very old models) are able to recognize form fields and so prompt users to enter the required information. The problem with putting placeholders inside the form fields is that screen readers usually do not even read out/mention the existence of these placeholders so that users end up not deleting them and thus end up submitting incorrect information when they simply add the right information at the beginning or the end of the placeholder. Note that this is true only for supposedly EMPTY form fields (i.e. name, address, username).
- Acronyms and Abbreviation tags - There is nothing really wrong with using the <acronym> and <abbr> tags but it doesn’t really do much in terms of accessibility. The reason for this is that screen readers ignore these tags and do not announce its contents. So if you want the visually impaired to know the meaning of an acronym then simply use the entire name/title and place it beside the acronym during the first time it is mentioned. Do continue using these tags though for usability’s sake since it can be very useful for the sighted but forgetful users.
published by Dan in Accessibility | Usability | Website Design
Last time we talked about the importance of accessibility. This time I’ll be giving some tips that should help you avoid making mistakes when implementing accessibility.
- Be concise - I have mentioned this in my last post but this time remember to be concise not just in the written content but also with the ALT text. You do not have to describe just exactly what an image looks like but you should simply state what the image contains. For example if the image contains a child eating a lollipop then put “Child Eating a Lollipop” in the ALT text. You do not have to write “Pretty child with blond hair eating a big half-eaten red and white lollipop.” Furthermore if you use images as borders or for other decorative purposes only you do not need to put ALT text so that the screen readers can just skip those images. Emphasis is given to accessibility but only to relevant content. Lessen the noise to make surfing your site more easy.
- Do not use access keys - Some webmasters think that access keys are cool. However, if you pause and think about it how many of your users actually spend time learning the access keys in your site? Changes are, that unless your site contains games or a useful application used by people on a daily basis, then almost no one even bothers to really learn the access keys you so painstakingly put up for their use. In terms of accessibility, access keys can also actually be a deterrent since they sometimes override keyboard shortcuts used by screen readers. This means that instead of helping your users you might be unintentionally sabotaging your visually-impaired users ability to surf your site.
published by Dan in Accessibility
If you are a web designer and has heard of the lawsuit that Bruce Sexton along with Baltimore-based National Federation of the Blind (NFB) filed against Target.com last December 2006, then you understand how important it is to address accessibility issues. Too many web designers nowadays make the mistake of taking accessibility for granted or dealing with the issues only for commercial purposes, but for the visually-impaired it is indeed as serious barrier that should be addressed. Some very basic changes only need to be implemented to make websites more accessible to the visually-challenged including:
- using plain/simple language when writing your site’s content
- breaking down the content into manageable chunks
- using sub-headings
- using lists/bullet points whenever possible to make the content more concise
- using ALT-text
In the end addressing accessibility issues will improve not just accessibility itself but your site’s overall format. It will also result in a more readable content not just for screen readers but also the sighted.
published by Dan in Website Design
When designing help files for your website you should consider several things. As mentioned in my previous post the feel of the help pages should be considered. Help and error messages should appear as non-threatening as possible to avoid negative experiences associated with your website. The actual content of the help file should also be considered to make it easily understandable. When writing the contents of the help file you should remember to:
- be concise as possible - Avoid using lengthy paragraphs and use bullet points for easier reading.
- use simple words - Avoid using technical words as much as possible and if you have to make sure that there is an explanation to accompany the technical term. Provide a glossary if you have to.
- not take anything for granted - What might be obvious to you might not be to your user. Because of this provide help/information even for the most obvious of things.
- be organized - Make sure the Help file is helpful and won’t further confuse your users by making it hard to look for the information they need. Give an outline to make it easier for users to find topics.
Accessibility to the Help’s contents should also be considered. To make information easily accessible add a search box in your site so that users can simply search for answers to their queries.
published by Dan in Tools & Resources | Usability | Website Design
Aside from pages with downloads other web pages where help is appropriate include:
- gaming sites - A help page where game information including the goal, rules, and instructions is needed for any website with games. Shortcut keys should be explained and a legend for icons given.
- online shops - A help page where people can find everything they need to know is important. However, due to the nature of the site the help pages for online stores are often subdivided into different topics including FAQ, product details, security issues, etc.
In truth any website wherein users need to do anything more complicated than just read and comment usually should have some sort of help page. This doesn’t mean that all users will actually need to read that help page (especially if the website design is very professional and is very usable) but what’s important is that help be available to anyone who might need it.
Note too that the complexity or depth of the help files/pages depends on the complexity of the tasks that a user needs to perform in the website. A simple download will just need a brief description (although you can give information on troubleshooting in case the download doesn’t work) while purchasing a product will require not only product details but in depth information on shipping, online security, etc.
published by Dan in Usability | Website Design
In the previous post I discussed the importance of helping users get back on track after making mistakes through the use of carefully designed error messages. Aside from error messages though a good website design will take into consideration the importance (or non-importance) of a help page or help files. In certain instances, like blogs, a help page is not really necessary. After all navigation is really straightforward and there isn’t anything that really needs to be explained step-by-step. In other instances though a help page or a help file is very important so as to make it easy for users to know how to perform certain tasks. Some examples of websites that might need a help page or at least explanations on the same page include:
- those with files/document to be downloaded - If the files/document to be downloaded needs special software to be viewed or opened (PDF files, compressed files, Flash, etc.) make sure that it is included as part of the download information. Include the link pointing to the page where they can download needed application to view the file/document.
- those with applications to be downloaded and installed - Make sure you have a link pointing to step-by-step instructions on how to install the application you have made available for download. The help page can be written by you or can be a standard help page. If the application can be installed using different operating systems make sure you have instructions for each OS.
to be continued…
published by Dan in Usability | Website Design
To minimise the occurrence of user mistakes the best thing to do, as I have asserted repeatedly, is to perform user testing. User testing will reveal which areas your users have the most difficulty and which elements of your website’s design mislead them most. By conducting user testing you can make the necessary changes to your website’s design.
Note that when I talk about addressing the issue that errors/mistakes pose I always use the word MINIMISE. This is because despite much effort on a web designer’s part users will still make mistakes and a few errors will still be overlooked. To counteract the confusion that mistakes can bring about it is very important that error messages be designed to be as friendly (non-threatening) and easily understandable as possible. The sight of error messages can be a cause of panic to those not too used to using the computer and going on the internet and can be very irritating to those who know what they are doing. Because of this it is very important that instructions always be very clear to help those who make mistakes recover and go back to finishing their task. It is also very important to give the user the option of not seeing the error message appear again (if the error is not critical/fatal) since advance users can correct their mistake without help or prompting and so make sure that user satisfaction is not affected by irritating pop-outs.
published by Dan in Usability | Website Design
Two very important factors that should be considered and go hand in hand are the errors and amount and type of help that will be made available to users.
Errors (or the lack of it) is one of the major components of usability, which obviously makes it a big consideration. However, this time when considering errors I am not pertaining to correcting bugs and making sure that there are as few code errors as possible. Of course that should be done but any experienced web designer knows that there are errors bound to slip one’s notice and only pop out for the users’ (dis)pleasure.
In website design to make the site more usable you should consider what the usual errors are that your users make. This will come out during user testing. For example, users might keep on mistaking a certain kind of text font or a cute logo as a link and keep clicking on it, or they might not realise that certain links are links and so have a hard time finishing their task. Another example would be users that enter wrong or no information in required fields to finish a task. By learning which aspects of your website users are having most difficulty with you can address these usability concerns by either making some basic changes in your web design, such as making links more prominent or giving clearer instructions to help fill out forms, or designing friendly and non-threatening error messages to make users aware that they are not on the right track.
to be continued…
0845 838 7448 
