Creating accessible websites and online content is not just a great idea - it's the law for all official Georgia Tech unit websites and courses. Accessibility means making the content of your site or course equally available to all people, including (but not limited to) ones with recognized visual, aural (hearing), cognitive, and mobility disabilities. Some accessibility requirements allow people to better utilize assistive technology, such as screen readers (which read page content aloud), screen magnifiers, and keyboards and joysticks (for navigation when a mouse or touch device cannot be used). Other requirements simply make your content easier for anyone to navigate and utilize, and we all win when websites and course content are easy to use.
This short primer will help you to identify some of the most common accessibility problems seen in electronic documents and show you how to easily correct them. It is not a substitute for doing a full accessibility evaluation of your content, but will help you to address many of the problems that are most often noticed by website visitors and students. The guidelines presented below can be applied in most modern word processors, but for even better accessibility, consider converting documents into Portable Document Format (PDF) whenever possible, as this allows the document to be viewed on the widest range of devices and browsers. For more detailed information about accessibility requirements, including links to the full specifications, please see our main accessibility page.
If you are building a website, we have a separate version of this primer for website development.
Common Image Problems
- Embedding text inside of images:
-
Why? Text that is embedded within an image cannot be automatically read aloud to a visitor with vision or reading disabilities who has to use a screen reader.
-
Proper Technique: Design your layout so that images do not contain any text that is important to understanding the page. If you wish to have certain pieces of text specially stylized, do so by using your application's built-in formatting tools, etc.
-
-
PDF files generated as images:
-
What? Many older PDF files and even some recently generated PDFs are created as one large graphic image file instead of being generated as real text. You can tell the difference by trying to select / highlight a passage of text in a PDF document: if you can highlight a single word, sentence, etc., then the document contains real text; if trying to highlight a single word ends up highlighting the entire page, then the PDF is one giant graphic image.
-
Why? Screen readers cannot parse text that is inside of an image. If each page of your PDF file is a single image, then it is not usable for people with vision disabilities who have to use a screen reader.
-
Proper Technique: You need to provide real text for anyone who will be using your PDF file. If you have a PDF file that is one giant graphic image per page:
-
And you have the source file from which the PDF was generated: Try to recreate the PDF file using a modern day office application. Most modern office applications will create a PDF with real text inside it.
-
And you don't have the source file: You'll need to have someone read through the PDF and type up all of the text into a regular text document and provide that along with the original PDF file.
-
Don't forget that if the PDF file has real images in it that are important to understanding the document, they need to have textual descriptions as well. See the next section for more details.
-
-
-
Using images without providing alternative text descriptions:
-
Why? Visitors with vision disabilities need to be able to get a textual description of any notable image (photograph, drawing, graph, etc.) that you provide in your document. If you consider the image important enough to put in the document, then you should consider it important enough to provide a textual version of the image.
-
Proper Technique: Every image that conveys information or has a function (e.g. acts as a link) must have an alternative text description. The basic rules of thumb are:
-
For an image that conveys important information not found in nearby text, provide a short, one sentence description in the image's Alternative Text property by following the guideline of "What would I write if I could not use an image here?" For universal usability, consider providing a suitable caption (visible to all users) below or beside any image that conveys important information, and then you can leave the Alternative Text property blank.
-
For an image that is purely decorative or otherwise does not convey any useful content, leave the Alternative Text property blank. There is no need to describe an image that doesn't convey any useful information.
-
For a more detailed explanation, please see WebAIM's Guide to Alternative Text.
-
-
Common Heading and List Problems
-
Using bold text in place of a real heading:
-
Why? Bold text cannot be systematically identified by screen readers (used by site visitors with vision or reading disabilities), so these visitors cannot easily tell that bolded text is meant to be a heading. When headings are not clearly marked, these visitors cannot get a sense of how a page is laid out without having to hear the entire page read aloud. With proper headings, these visitors can first have the headings read aloud, and then can jump ahead to any one of those sections.
-
Proper Technique: Headings that identify sections of your page should be marked as headings in your application (often done via a 'style' selector in word processors) so that screen readers and other accessibility tools can identify your headings and then allow the user to easily skip ahead to a specific heading.
-
-
Using asterisks (*) or manual numbering for items in a list, or not placing grouped items into a list structure at all:
-
Why? Manually entering numbers or bullet symbols for a list of items, or not placing grouped items into a list structure at all (e.g. entering each item as its own paragraph) does not allow a screen reader (used by site visitors with vision or reading disabilities) to recognize that the group of items go together. A screen reader can alert the visitor to an upcoming list that has been identified with the proper list and list item tags, and can then allow the visitor to navigate quickly through those grouped items.
-
Proper Technique: Lists should be created using the ordered [numbered] list or unordered [bulleted] list functions of your word processor, so that list items are properly grouped together and easily identifiable. Look for a button control that will put you into numbered or bulleted list mode before entering your list items. In many cases, you can also enter your list of items, one per line, then highlight the entire list and select the numbered or bulleted list button to group and format them properly all at once.
-
Common Page Layout Problems
-
Overly long, wordy, and otherwise poorly crafted content text:
-
Why? Listening to a page via a screen reader (used by people with vision or cognitive disabilities) can become tedious even on a short, well-written page. When the content is extremely long and/or poorly written, listening to the page becomes incredibly difficult.
-
Proper Technique:
-
Consider breaking up page content more sections with proper headings if the content is more than a few paragraphs long. More headings help to break up your text into easily parsible sections.
-
Consider having your page content reviewed by a skilled copy editor to make it more concise and fix any grammar, spelling, and punctuation errors. If you can't get a skilled copy editor, then consider picking up a copy of E.B. White and Strunk's Elements of Style for some excellent advice on this topic.
-
Consider the reading level of your target audience. In most cases, this is not as high as you might think. A good target level for general websites is an 8th grade reading level.
-
-
-
Use of acronyms or abbreviations without explanations and overuse of long acronyms:
-
Why? While your primary target audience may be familiar with the common acronyms used in your subject area, not everyone will, and a page full of cryptic codes makes your message uninteligable to someone trying to learn about your subject. For users of assistive technologies, acronyms may not be read aloud the way you are used to pronouncing them, which can further confuse the site visitor.
-
Proper Technique:
-
If you must use an acronym, then on the first use spell out the entire phrase and put the acronym in parentheses after it: Georgia Tech Research Institute (GTRI).
-
If you find yourself using an acronym repeatedly on a page, see if you can reword your content and/or use a single word from the acronym to reference that subject (e.g. "the center" or "the group").
-
Avoid using abbreviations where they are commonly confused and it takes little extra effort to spell out the word (e.g. state abbreviations).
-
-
-
Using tables to format the layout of text:
-
Why? Tables were never meant to be used for controlling the layout of text, but rather were designed to present tabular data (e.g. a spreadsheet of values). When a table is used to control the layout of text, what looks readable to a sighted person often does not come across in the correct order for a person using a screen reader, which attempts to read a table row by row from left to right.
-
Proper Technique: Tables should only be used for information that needs to be presented in a tabular format (e.g. a spreadsheet of values). If you wish to lay out a page with blocks of information (like a newspaper page), use the proper layout functions of your word processor to create this layout. If you simply wish to place an image within a paragraph, either left or right justified, use your word processor's image controls to achieve this placement.
In addition, do not use tables to display a simple list of items. Instead, numbered or bulleted list tags should be used as described above.
-
Common Navigational Problems
-
Using uninformative phrases for hyperlinks:
-
Why? People using assitsive technology may choose to have just the links on a document page read aloud. If all of the links read as "Click here", "Read more", etc., then the user can not tell where any of them actually go. (You should never expect the site visitor to have to use the URL of the link as a guide to understanding the link.)
-
Proper Technique: Every link should clearly describe the content to which it will take the reader. In particular, always avoid the word 'Click' as it alienates anyone who does not use a mouse, and really doesn't convey a useful message (except perhaps the message that whomever created that document does not know how to build a good document). A good rule of thumb is to write your full sentence first as if you were putting it into a printed document, then go back and find the words that describe what you want to link to and make them the text of your hyperlink. If you can't find the right words then you need to rethink and rewrite your sentence so that it makes proper mention of the item to which you want to link.
-
Common Audio and Video Problems
-
Providing embedded audio or video clips without captions or translations:
-
Why? People with hearing disabilities and even people without medical disability who happen to be in noisy environments cannot perceive the important content in a video or audio clip if a textual translation is not provided.
-
Proper Technique:
-
For audio clips only: Provide a written transcript of the clip, either on the same page and just below the clip, or accessible via a well labeled link provided adjacent to the clip. The transcript should accurately match all dialogue in the clip and describe any non-verbal sounds that aid in understanding the clip, particularly in the context in which the clip is being used.
-
For video clips: Captions must be provided within the video clip, though it is permissible to use closed captions (captions that only show for site visitors who enable them). The captions should accurately match all dialogue in the clip and describe any non-verbal sounds that aid in understanding the clip, particularly in the context in which the clip is being used. If you use any automated tool to generate captions, you must review them carefully to make sure they are accurate, as most automated tools make many mistakes in interpreting voices.
In addition to these guidelines, if you are creating video content in the classroom, you also have to make the content accessible for site visitors who have vision disabilities by giving audible descriptions of visual elements. This is best done by having the presenter clearly describe any graphs, diagrams, charts, demonstrations, etc. being presented, and read aloud anything being written on a whiteboard or shown on a projection screen.
-
Please see the Georgia Tech Webmasters Resource Site for a list of video captioning services, some of which may also provide audio transcription services.
-
-
This primer may be used by other Georgia Tech Units for their training and reference as long as Kevin Pittman and the Ivan Allen College of Liberal Arts are credited as the original authors.