Web Accessibility : Project Proposal

On almost all websites, text is a major component of their makeup. However, it is not always safe to assume that the information is being easily extracted. There are many individuals that have disabilities that cause them to have trouble reading and interpreting what they are reading. An example of this would be those with dyslexia. Similarly, it is not always the case that the native tongue of those reading is the same as the language on the page. Those new to a language may understand most of the content, but get stuck on a particular term.


When was the last time you saw a term that stopped you in your tracks like the one above?

I propose a tool to help individuals read and understand sections of text on websites. By simply selecting a word or compound term on the page, the tool will bring up an assistant window. The window will be composed of separate tabs representing 3 main things:

1. A formal definition of the word or term:


2. A pronunciation tool:


3. An image (if applicable):


The benefit of this format would be its ability to reach out to auditory and visual learners through the text-to-speech and image fetching abilities respectively. As well, to emphasize a sense of learning and progress, there will be a “history” option to view the recently searched words.

Web Accessibility Tools : FireGestures

FireGestures is an add-on to Mozilla Firefox that allows commands to be run with combinations of mouse, keyboard and scroll wheel gestures made on the display area of the browser. By holding the activating mouse button (default = right), a user can make a simple mouse stroke and execute a command. A stroke to the left will represent moving to the previous page visited in recent history and similarly, a right stroke represents moving forward. Conveniently, the path of the stroke is displayed with a customizable colour on the page.


Strokes are registered as up (U), down (D), left (L), or right (R). As a result, any combination of these can represent a unique command. For example LRLRD may be mapped as a command to close the current tab. Careful thought was also put into how a new mouse gesture is registered. When registering, there is an input box where the user can draw out their gesture and the stroke combination will be displayed underneath.

Although I only mentioned mouse stroke combinations, there are also combinations that can be made with the scroll wheel and keystrokes while the activation key is held. These work the same way with the mapping.

This may be a very interesting tool, but the concept isn’t without its flaws. There being only 4 directional mouse strokes always leads to ambiguity when dealing with the “in-between” cases. If an individual were to make a north-easterly stroke, it may be read as either an up or a right stroke.

Another issue with the concept would be that compound script gestures that have similar mappings to other gestures could lead to disastrous results. The problem is that the more gestures that you add, the more similar the gesture compositions will be and the easier it will be to apply the wrong one. An extra left stroke could be the difference between reloading a page and deleting browsing history.

Also, there is a factor to consider that limits the commands you can or should use. After a while, basic combinations of left, right, up and down strokes will be exhausted, which will force the user to add more movements. Eventually, stroke sets will become so complex that it may be faster to simply click the original button associated with that action.

Tools such as FireGestures can find its uses for individuals who suffer from Repetitive Strain Injuries (RSI). Movements will be simpler and made in a smaller space to reduce the number of traditional “big movements” required for most tasks. The concept of the FireGestures add-on is very interesting; however, there are many flaws in its design that may outweigh the value.

Web Accessibility Tools : Readability

Readability is an extension that is available for Mozilla Firefox, Safari, and Google Chrome browsers. I will be reviewing the Firefox add-on. The main purpose of Readability is to make the web page text more readable by removing all the clutter such as advertisements, fancy fonts, and backgrounds.



Additional ease of use can be set with keyboard shortcuts. A user is able to customize their tool by adjusting text size, display style and margin width. Different display styles include rendering the page font like a newspaper, e-book or novel. In many cases of browsing, hyperlinks can have the ability to distract the user while they read an article. By enabling a simple option, hyperlinks can be converted to footnotes. An added bonus would be that every new page is generated with buttons to refresh the original page, print the new page or email the new page to someone else.

Although the tool seems like a very good idea, it is not without its flaws. Font choice is restricted to only 5 types. Similarly, rendered pages are displayed as either black on a light background or white font on a single dark background. Although this is standard, it would be nice to have some choice in the display colours. Not everyone has the same opinions on comfortable “reading” colours.

Even though in many cases, text is one of the most important parts of a web page, images can play an important role in adding context. Readability includes some, but not all images. However, for those that it does keep, the orientation of the images is lost. For example, if images are arranged side by side on the original page, the rendered version will place them one under the other. This is an important issue because any text that was below the initial side-by-side images will be wrapped beside the resulting column of images. As expected, the Readability tool works best with regular text based websites. Once they get fancy with flash-based sites, Readability no longer helps.

The Readability add-on is a very useful tool for those that wish to just get the meat of the website without being overwhelmed with clutter. Furthermore, it would be very helpful to individuals with conditions such as ADHD and are easily distracted.

Web Accessibility Tools : Virtual Magnifying Glass

Virtual Magnifying Glass is an application that is supported on Microsoft Windows 2000+, Mac OS X, and Linux distributions. This product literally is a magnifying glass for a user’s desktop. When functioning in regular magnifying mode, it locks a magnified frame to the user’s cursor. Wherever the cursor is moved, the area under it is magnified based on the user specified options. Unfortunately, icons and other things under the area cannot be interacted with while in this mode. For that functionality, a user would have to put the tool into “Dynamic Mode”.

This tool has multiple bugs that I noticed while using it. For example, when clicking off of the magnifier onto Windows Live Messenger, it would temporarily change my status to “busy” and then back to “normal”. Also, when trying to install onto Fedora Linux, I was unable to even start the application.

As a tool to help those with poor eyesight see small icons, it succeeds. However, for a tool with good usability, it fails.

Web Accessibility Tools : Page Zoom Buttons

Page Zoom Buttons is an add-on to Mozilla Firefox that creates buttons that can be placed on a toolbar to execute different zoom functionality. Unfortunately, this tool is not really ready to be used once installed to Firefox. The problem is that you have to physically add the buttons to your tool bar by using: View > Toolbars > Customize and drag the new icons onto a toolbar.


To be honest, the Page Zoom Buttons add-on doesn’t really add new functionality to Firefox as the zooming that it does is identical to the “ctrl +/- “ key combinations. This of course already has its issues. If you zoom in very close and then go to a new page, then you will remain at that magnification. This results in you having to zoom out a bit to gain your bearings on where you currently are in the page.

This tool, like many others, would benefit individuals with poor or degrading eyesight. Although the concept of zooming is sound, no real functionality is added to Firefox. There are better add-ons to Firefox that can do similar jobs and should be considered over this one.

Web Accessibility Tools : Image Zoom

Image Zoom is a Mozilla Firefox add-on that lets the user do quick basic viewing alterations on images. For example, it allows images to be scaled accordingly and rotated with the mouse.






I find this quite convenient as it alters the orientation of images without seriously affecting the rest of the text on the page. Of course, if a person zooms into the image 800%, there will be some crowding with the text. But for the majority of users who use this tool for minor magnification (ie: 200%), it does an excellent job.



In addition to magnification, the tool also allows for quick rotation. Unfortunately, rotation is only done in 90 degree intervals. One thing to note however is that the plug-in functions do not work with background images or HTML inputs appearing as images.

This tool is ideally geared towards people with difficulty seeing. These may include the elderly or individuals with eye conditions, but it is not limited to them. Also, for very high resolution images, Image Zoom can scale the image to fit your screen. This tool would have to be used in unison with another tool such as a text-to-speech application or one that can increase the size of text.

Web Accessibility Tools : Reasy

Reasy is deemed one of those Rapid Sequential Visual Presentation (RSVP) extensions for Firefox. When text is highlighted, it is displayed sequentially in a separate text box to the user. By customizing the display, the user can control how fast and how many words from the block are shown.

Configuration is minimal with this tool. Users are able to change font type, size and colour for the text box with the display settings, while the reading options allows for defining shortcuts and text movement types.


Reasy has major usability issues that should be addressed in the future. For example, the +/- buttons blend right into the background and have no bordering to indicate they are clickable. Similarly, the background for the text display area is opaque. As a result, it just blocks up a huge part of the screen. Making the background somewhat transparent would make using the tool much easier by having some context of where you are in the highlighted section. The ability to speed up the text being displayed is nice, but if the reader misses something, then there is no way of rewinding.

This tool would be useful for those who may not have as strong a reading level as others. As well, it is a way of removing much of the clutter on web pages and a way to display only that which the user may find useful. Although the Reasy extension does have uses, the major usability problems inhibit its potential. There are many other text parsing tools out there that are more refined and should be used instead.

Web Accessibility Tools : ClipTalk

ClipTalk is an application that runs on all versions of Windows past Windows 98. Its general purpose is to translate text to speech from what is copied to the clipboard.
To use the tool, simply highlight a piece of text to the clipboard and a voice will speak the contents back to you. For the most part, the pronunciation is correct, but some that aren’t are words that are not in the tool’s limited vocabulary. For these words, ClipTalk attempts to pronounce them using common phonetics for each syllable.

In many cases, text contains markup. By running ClipTalk using the “–m” option, markup can be ignored. However, ClipTalk is not without its issues. If opened multiple times, the text will be read by multiple ClipTalk instances. The result is a very unappealing echo.

Although ClipTalk would be useful in aiding the blind or illiterate, there are many other text to speech tools out there that have a larger vocabulary and are more refined.

Web Accessibility Tools : Noise

Noise is an add-on for Mozilla Firefox that associates some user actions with sound effects. It can be set to react to browser events such as opening a tab or even window events such as closing. For convenience, there are default events that are ready to use once they are enabled and have a sound associated with them. For the advanced user, new events can be created and registered with the help of the API.

One problem I found with the tool was that it lacked direct documentation to the window event constants that could have been used to create an event. Similarly, sounds are restricted to .wav format. Although this is standard, it would be nice to have different options such as .mid, .mp3, etc...

The users that would benefit most from this tool would be those with poor or degrading eyesight. Noise is just another way that an individual can receive feedback from an action they make while browsing the web.

Web Accessibility Tools : Colorful Tabs

Colorful Tabs is an add-on to Mozilla Firefox that helps a user to better organize their browsing sessions. As the name suggests, it allows the user to customize the colours of tabs. The Colorful Tabs add-on lets an individual automatically tag or manually tag a tab with a colour when one is open. As an additional treat, colours are not constrained to preset colours. The tool enables customization of the RGB values as well as colour saturation and luminance. With this, it can easily be used to tag tabs with vivid colours to help individuals with degrading eyesight distinguish such tabs. One of the most powerful features that I noticed on the tool would have to be its ability to automatically colour each tab based on its server or domain. This could be very beneficial to individuals that have difficulty processing the title text on the website’s tab. By having colour association, they have another avenue to recognize a website.

The Colorful Tabs add-on continues to impress me with its ability to fade out the colours of the tabs, but accentuate the colour when moused over. Such functionality would really serve those with a medical condition that involves having shaky hands as a symptom. With it, they would be able to easily identify whether or not they have moved too far into a different tab’s area. Of course, to truly cope with shaky hands, another tool would need to be used in unison. A tool that reduces sensitivity of a mouse cursor for small movements could be one choice. Colorful Tabs would just be a complement to it.

I can see this tool helpful for individuals that may have memory issues varying from acute Attention-Deficit Hyperactivity Disorder (ADHD) to perhaps even Alzheimer’s patients. The only issue I had with the add-on is that I was unable to get the tab background images to show up for Colorful Tabs v4.6.3 on Firefox v3.6.10 when combined with the Tree Style Tab add-on. Other than that, it is a very well made tool. I truly recommend trying it out.