Making your web site more accessible to disabled and visually impaired users isn’t hard, but it’s often an area where web designers and site owners let themselves down. These are a few simple steps that will definitely make your site a little friendlier for all users.
Use correct h1, h2 and p tags
Many visually impaired users don’t browse a web page in the traditional sense with a web browser like Firefox, Internet Explorer or Chrome. They may use screen reading software or other bespoke interpretive programs to enable them to access web content. Therefore, your HTML and CSS mark-up has got to be spot on. You need text to flow correctly on the page and be split-up into paragraphs with appropriate h1, h2 and h3 headings. This means that when software interprets a page for the disabled user it can understand and follow the structure of the content.
Use appropriate title tags on pages
The title tag of a page is not just an opportunity to tell search engines what’s on the page, but also users. Try and make sure the title is a clear and accurate description of the page content.
Use descriptive alt text on images
Make sure you use the alt text tag on any images you insert on your site. Many WYSIWYG editors like Dreamweaver may automatically insert an alt text based on the image name. This can result is an alt text of something like Image12b, which is pretty much useless to everybody.
Think of this as opportunity to provide a short description off the image to someone who might not be able to see it. A visually impaired user may not be able to see the image, but they will be able to understand the context of the image within the page content.
This is an image of the Birmingham skyline at dusk.
It’s also a good opportunity to get some good keywords associated with the image so your site will appear in Google image search results.
Try not to use text in images
Screen readers can’t read text when it’s embedded into an image and will not be able to interpret the text for a visually impaired user. An alternative is to Use HTML and CSS to float the text over the image. It may take a bit longer to code, but it means the text can be read by a screen reader.
Use appropriate title tags on links
When you add a link to another page on your site or to an external web site make sure you include an appropriate title for the link.
Click here to go to the BBC news site
This should be a brief description of the site and content of where you’re sending the user.
Use easy to read and appropriate colour schemes
It’s nice to have a colourful and distinctive web site, but be careful of the colour combinations your using. They may make it really hard for a colour blind or visually impaired user to read the text or navigate around your site.. Stick to simple and proven colour schemes and if possible give the users the ability to change the colour scheme.
Provide users with the ability to switch colour schemes