Testing And Adding Accessibility

3y ago
28 Views
2 Downloads
4.82 MB
17 Pages
Last View : 2m ago
Last Download : 3m ago
Upload by : Javier Atchley
Transcription

Web AccessibilityTesting and Adding Accessibility

Purpose of InstructionInform about free accessibility tools and simple techniquesto help identify common web accessibility issues.

Web AccessibilityTESTING FOR ACCESSIBILITY

Mouse Navigation TestUsers with motor disabilities and users with visual impairment struggle withnavigating websites using a mouse. Meaning, websites must be accessible by onlyusing a keyboard.Test a webpage:1. Use the Tab key to navigate a webpage. Can all information be accessed?2. When navigating the webpage using tab, is order logical?3. Use the Enter key to activate links and other content. Does the link take you tothe intended destination?Can all content within a page be accessed by using the keyboard? If not, thenthere is an access issue.

Enlarge TextIndividuals with visual impairment willenlarge a webpage to view its content.Enlarge text on a page to ensure text isnot hidden or distorted when enlarged.100% - Normal1. Open a web browser.2. On the keyboard press and hold CTRLthen press or – to increase ordecrease the content size of the page.Browsers also allow only text size tochange. Safari: View Zoom Text Only Firefox: View Zoom Zoom Text Only Internet Explorer: View Text size200% - Enlarged

Web Accessibility Evaluation Tool (WAVE)WAVE is a webpage evaluation tool tocheck for accessibility issuescontained on a webpage.1. Open a web browser and go thewave.webaim.org.2. Enter a webpage address in thetextbox.3. Press the Enter key.

WAVE Accessibility Summary Red icons show accessibilityissues. Yellow icons alert to a possibleissue. Green icons show webpagefeatures. Blue icons refer to the webpagestructure (headings, lists, etc.). Pink icons identify HTML5 andAria usage. Black icons show color contrasterrors.

Web AccessibilityADDING ACCESSIBILITY

Page TitlesGood page titles are particularlyimportant for orientation whenbrowsing webpages.Page titles can be: Shown in the window title bar Shown in browsers' tabs whenmultiple web pages open Shown in search engine results Used for browserbookmarks/favorites Read by screen readers In the web page markup is the title within the head

LinksUse simple, meaningful descriptions when links are used within aparagraph or out of context to identify what website the link is associated. Assistive technology Initiative Office of Disabilities Services George Mason UniversityAvoid vague links descriptions. Click here, here, read more, more info, etc.

HeadingsWebpages have sections ofinformation separated by visualheadings. In order for a screenreader to quickly access Content.Heading text is a larger font size andbold. Headings need to be "markedup" in the webpage "code“ (e.g.,HTML).A “Heading” for a webpage can be: The title of the page Titles of subsections of the pageHeading levels should have ameaningful hierarchy and logicalorder, such as:Heading Level 1 h1 Heading Level 2 h2 Heading Level 3 h3 Heading Level 2 h2 Heading Level 3 h3 Heading Level 4 h4 Heading Level 2 h2

Alternative (Alt) TextAlt text should be functional andprovide an equivalent userexperience.Alt text conveys the purpose of animage, including pictures,illustrations, charts, etc.For example, individuals with visualimpairments use screen readers tohear the alt text read aloud.Example HTML code of the alt text forthe George Mason University logo: img src "graphics/logo.gif“alt "George Mason University“ /

TablesTables can be frustrating tonavigate with a screen reader orkeyboard for individuals withvisual impairments when tablesare not formatted correctly.Ensure tables have headings toaid in communicating dataaccurately.Class ScheduleClass NameCourse #LocationBiologyBIO 100Building AChemistryCHEM 100Building BExample Code: table caption Class Schedule /caption tr th scope ”col” Class Name /th th scope ”col” Course # /th th scope ”col” Location /th /tr tr th scope ”row” Biology /th td Bio 100 /td td Building A /td /tr tr .

Color ContrastAdding color to websites looksappealing, however, using colorswithout enough contrast causes issuesfor individuals with colorblindness orother visual impairments.Webpages should have a minimumcontrast ratio of at least 4.5:1 fornormal-size text.1. Open a web browser and go tohttp://webaim.org/resources/contrastchecker/2. Enter the foreground and backgroundcolors.3. The checker will provide a pass or failfor normal and enlarged text.

CaptionsVideos can present large quantitiesof content in a short period of time.However, for individuals with hearingimpairment, videos without captionsare inaccessible.If videos will be hosted on a website,ensure captions are available.

Accessibility Tools & Resources WAVE by Webaim - http://wave.webaim.org/ WAVE Chrome Extension - http://wave.webaim.org/extension/ Color Contrast Analyzer ntrastanalyzer/dagdlcijhfbmgkjokkjicnnfimlebcll?hl en Open AJAX Alliance - ajax-accessibility-exte/ Web Accessibility Toolbar by Paciello Group https://www.paciellogroup.com/resources/wat/

Contact ATI at 703-993-4329 or ati@gmu.edu

Web Accessibility Evaluation Tool (WAVE) WAVE is a webpage evaluation tool to check for accessibility issues contained on a webpage. 1. Open a web browser and go the wave.webaim.org. 2. Enter a webpage address in the textbox. 3. Press the Enter key.

Related Documents:

DOR Document Accessibility Standards Page 2 . Accessibility Testing Accessibility testing should be conducted on all created documents and forms that will be submitted for review as well as distributed to the public. A designated person within the unit or division should ensure the documents and forms meet DOR Document Accessibility Standards.

testing environment. axe Auditor is a manual accessibility testing solution for Accessibility Testing Specialists that allows you to optimize your accessibility testing, tracking, and reporting with step -by-step guidance and report building. Based on The Deque Way of

Administer accessibility supports during instruction and assessment. 5. Evaluate and improve the use of accessibility supports. Intended Audience and Recommended Use The Georgia Department of Education [s Accessibility & Accommodations Manual is intended for use in administering accessibility supports for those students who need them.

IAAP Web Accessibility Specialist (WAS) International Association of Accessibility Professionals. 1. Creating Accessible Web Content. 1.1. Understand and interpret accessibility specifications and techniques. 1.1.1. Overview. This competency focuses on designing and creating web content in accordance with the following W3C accessibility .

Bluetooth Switch or Hook iOS Switch Interface with these steps. STEP 1: SET UP YOUR ACCESSIBILITY SHORTCUT The Accessibility Shortcut gives you the ability to easily turn Switch Control on or off by triple clicking the home or power button on your device. 1. Go to Settings App Accessibility Accessibility Shortcut 2. Select Switch Control

Slide 17- Adding Pizzazz: Clip Art Slide 18- Adding Pizzazz: Photos Slide 19- Adding Pizzazz: Navigating Windows to Copy/Paste Slide 20- Adding Pizzazz: Photos & Clip Art Using Copy/Paste Slide 21- Adding Pizzazz: WordArt Slide 22- Adding Pizzazz: Borders Slide 23-Moving Graphics & Clip Art

3.2 Investing in adopting and implementing accessibility standards 22 3.3 Investing in a disability-inclusive procurement approach 24 3.4 Investing in development and employment of access audits 26 Chapter 4: Drivers for and added value of investing in accessibility 29 4.1 Demographic factors driving the need for investing in accessibility 30

Investigating Chemistry through Inquiry 11 - 1 S PRELIMINARY ACTIVITY FOR . Beer’s Law Investigations . Guided Inquiry Version . The primary objective of this Preliminary Activity is to determine the concentration of an unknown copper (II) sulfate solution. You will use a Colorimeter (a side view is shown in Figure 1). In this device, red light from the LED light source will pass through the .