ADA Compliance: Sculpting Web Design Elements That Provide Accessibility for Everyone By Jeff Statham Instructional Designer University of Alabama

Terms & Definitions ADA – Americans with Disabilities Act was signedinto law on July 26, W3C – World Wide Web Consortium WCAG – Web Content Accessibility Guidelines

Low Hanging Fruit Choosing a color contrast will provide greater accessibility forthose who are visually impaired. True-type fonts are easier to read, can successfully beenlarged, and load faster. A hyperlink should be defined without depending solely oncolor or using a mouse to hover over it. Alternative text should be included in any elements thatrequire a description for greater accessiblity.

Color Contrast Good contrast provides easierreadability not only for the visuallyimpaired but for everyone! Dark or shady fonts are notrecommended for darkbackgrounds. Good / Bad

True Type Fonts True-type fonts are highly recommended due to their abilityto appear exactly the same on the screen as it looks when it isprinted True-type fonts are easier to read, easier to be enlarged, andprove to load faster. Use a font size of 12 point or greater to maximize the level ofreadability.

LINKS Text hyperlinks should appear with an underlined without depending on a mouse to hover over it. Focus indicators or dotted line surrounding a button will enhance accessibility for keyboard users. Avoid creating a link described with the words Click Here. It is very unclear and is not descriptive.

Alternative Text Alternative text is textual information that describes an image in a document or webpage. If an image is merely decorative and does not add to the content, it is recommended to have an alt attribute of null. Videos should always include captions that will provide a greater level of accessibility. When designing tables and forms, you should use alternative text to describe table cells and form labels.

PDF Documents Adobe Acrobat documents are called PDFs (PortableDocument Format). This document format should always include to the optionto include text as machine-readable-text or text that can bereadable by a screen reader device. PDF documents containing text should provide aninteractive table of contents for greater accessibility.

Word Documents For a Microsoft Word document to be accessible, youshould use heading styles when formatting your text. Thiswill optimize the readability for screen readers. If heading styles are used, a Word document may easilybe saved as a PDF file with an interactive table ofcontents. Images should include alternative text when moreinformation is needed to describe its purpose.

PowerPoint Presentations Textual content should utilize heading styles. Images should include alternative text when needed. Video content should include captions. Color contrast will provide easier readability. Animation that does not add to the content deliveryshould be limited.

Thank you Jeff Statham Instructional Designer University of Alabama