Web Content Accessibility Guidelines for UI Developers

Web Content Accessibility Guidelines for UI Developers

Web is like a stock exchange of information. Looking into this day to day popularity of internet growing rapidly. Including normal viewers physically disabled personalities are accessing the web. Web Accessibility is the term which was derived for physically disabled users. I mean while a physically disabled person accessing the web what are the technique we can provide in UI that can make his/her browsing easier. Web Content Accessibility Guidelines not only helps disabled persons but also this technique is very helpful for Senior Citizens.

I am having more than 10 plus years experience as a UI developer. But in the day one when I heard about the term “Web Accessibility” I did started Goggled. Finally, got to know this is a technique using which we make the web easy accessible for physical disabled personalities. In web this technique gives freedom to equal access & equal opportunity for physically disabled viewers. Then the next Question come to mind is “As a UI Developer what are the Changes I required to make my web pages Accessibility friendly?”.

To answer the above query many Countries are with many set of defined rules. Among them 2 rules are popular Section 508 & WCAG. Section 508 is by US government. WCAG is an international Accessibility Guidelines. It has two revisions WCAG1.0 & WCAG2.0.

Web Content Accessibility Guidelines

Use Valid HTML – While Creating a HTML page make sure that your page is W3C Compatible. To check whether your HTML page is W3C optimized or not you can use this free tool Valid HTML.


In this tool under more options choose “Show Outline” option. Then valid the URL to check whether page headings & sub-headings are in right sequence.

Large Fonts – Generally Large Fonts helps them those are with week vision. After Creating a HTML page successfully change the browser font size to largest. If you HTML page is responding properly then your page is Optimized.

Check Color Combination & High Contrast mode – For viewers those are disabled with vision for them Color Combination & High Contrast helps to view the page. To Change your web page theme to High Contrast always provide short-cut key. After update the theme to High Contrast check properly that your page is not disappearing any important Contents.

Alt & Title attribute in Image – It is a good SEO practice to use alt & title tag in images. Including SEO this UI Changes helps visually disabled persons to listen the text using Screen reader. Also using this feature on mouse over of an image a disabled person can watch the text like a tooltip.

Allow Keyboard Operations – While designing a HTML page to enrich the page with Web Accessibility allow keyboard short-cuts. For an example if you have a Dropdown list in your page make sure user can update its value using up or down arrow key.

While sharing PDF Documents – In many website it was noticed to share bulk information we provide a PDF File. According to Accessibility testing before uploading the PDF save the same PDF file in text file format. Then check whether all the contents appearing in that file or not. If every thing goes fine upload the PDF.

Use Captions and Transcripts – This features in Web helps them those are hearing disability or can’t access Audios and Videos. While recording a Video or Audio check with the Audio Company whether your track is with Captions and Transcripts.

Use Audio & Video when Required – After Multimedia web is more Live. To make your web Accessibility Optimize use Audio and Video when required. For an example if a Blind person is accessing your web portal Audio can help him/her to hear the Contents. Similarly use Video when required. Video saves user time and works better then documents.