Websites and HTML Practices
World Wide Web Considerations
The Web is rapidly becoming one of the most widely used media for delivery of distance education. The relatively low cost of delivery, ease of resource development and wide availability of student access make it an ideal instructional delivery resource. Although presently constrained by bandwidth considerations, the Web is fully capable of delivering a variety of multimedia and interactive instructional resources including audio, video and real-time chat services.
Access Issue
Students who are blind will be unable to access graphic images, text formatted in complex ways, Java applets and video clips. Students who are deaf or hard-of-hearing will not be able to hear the auditory content of the Web site. Some students with severe learning disabilities may be unable to process large amounts of text information without the use of assistive technologies. In addition, documents created using Adobe Portable Document Format (PDF) are difficult, if not impossible, to read using screen readers and/or refreshable braille displays. Thus, if materials are provided on a website in PDF format, an alternative version should also be available in plain text or HTML format. Of course, this is only feasible for textual information and would not apply to materials, or portions of materials, that are inherently graphic in nature such as pictures, graphs and maps.
This video shares student’s experiences:
Remedies
A comprehensive set of guidelines for meeting the Web access needs of persons with disabilities have been developed by the Web Accessibility Initiative (WAI) (http://www.w3.org/WAI/) as a working group of the World Wide Web Consortium (W3C).
Analysis:
The intent of these guidelines is to foster the creation of Web sites which provide equal access to information when viewed using typical, industry standard assistive computer technologies in wide use today by students with disabilities. Over the past two years, the international body of the World Wide Web Consortium (W3C) has sponsored the work of the Web Accessibility Initiative (WAI) in developing a set of international access guidelines for the Web. Although the WAI guidelines remain in draft format, they satisfy the access requirements identified under Title II of the Americans with Disabilities Act (ADA). In order to resolve compliance issues raised by OCR and to comply with Title II of the ADA, these guidelines have been adopted by the California Community Colleges Chancellor’s Office. They apply to use of Web based instructional resources created by the college or other Web-based resources students are required to use for course completion. They will be reviewed/modified as necessitated by future revisions of the WAI guidelines by W3C.
The WAI guidelines excerpted below fall into three priority levels:
Priority 1
This guideline must be followed by an author, or one or more groups of users will find it impossible to access information in the document. Implementing this guideline is a basic requirement for some groups to be able to use Web documents.
- Provide alternative text for images, applets, and image maps.
- Provide descriptions for important graphics, scripts, or applets if they are not fully described through alternative text or in the document’s content.
- Provide textual equivalents for audio information (captioning).
- Provide verbal descriptions of moving visual information in both auditory and text form.
- Ensure that text and graphics are perceivable and understandable when viewed without color.
- Ensure that moving, blinking, scrolling, or auto-updating objects or pages may be paused or frozen.
- Ensure that pages using newer HTML features (i.e. style sheets, forms, tables) will transform gracefully into an accessible form.
- Use features that enable activation of page elements via input devices other than a pointing device (e.g., via keyboard, voice, etc.).
- For frames, provide sufficient information to determine the purpose of the frames and how they relate to each other. Ensure that tables (not used for layout) have necessary markup to be properly restructured or presented by accessible browsers and other user agents.
- Only use technologies defined in a W3C specification and use them in an accessible manner. Where not possible, provide an accessible alternative page that does.
Priority 2
This guideline should be followed by an author, or one or more groups of users will find it difficult to access information in the document. Implementing this guideline will significantly improve access to Web documents.
- Indicate structure with structural elements, and control presentation with presentation elements and style sheets.
- Provide supplemental information needed to pronounce or interpret abbreviated or foreign text.
- Elements that contain their own user interface should have accessibility built in.
- Use interim accessibility solutions so that assistive technologies and older browsers will operate correctly.
- Group controls, selections, and labels into semantic units.
- Wherever possible, create good link phrases.
Priority 3
This guideline may be followed by an author to make it easier for one or more groups of users to access information in the document. Implementing this guideline will improve access to Web documents.
- Provide mechanisms that facilitate navigation within your site.
- Create a single downloadable file for documents that exist as a series of separate pages.
What is WAVE?
WAVE is tool to help web developers make their web content more accessible. WAVE cannot tell you if your web content is accessible. Only a human can determine true accessibility. But, WAVE can help you evaluate the accessibility of your web content.
WAVE is easy to use. Using the form at the top of any page, simply enter a the web page address of your page or browse to a file on your computer (images, styles, and other media may not display for uploaded files) and select WAVE this page!
What do all these icons mean?
WAVE will present your page with embedded icons and indicators. Each icon, box, and piece of information added by WAVE presents some information about the accessibility of your page. While WAVE is most effective when used by someone knowledgeable about web accessibility, people who are not web accessibility experts can also benefit from WAVE.
The report section at the top of the page indicates if WAVE detected any errors or not. The absence of errors DOES NOT mean your page is accessible. RED icons indicate accessibility errors. GREEN icons indicate accessibility features. The other icons and indicators indicate other elements that you should look at. WAVE brings the underlying accessibility information of a page to the fore-front so it can be easily evaluated in context.
You can view a brief overview of what each icon or indicator means by clicking it and viewing its documentation or by accessing the documentation panel.
Did my page pass WAVE? Is it "WAVE approved"?
Only humans can determine whether a web page is accessible. While WAVE can identify errors (in other words, if you see a red icon, your page almost certainly has an accessibility issue), it cannot tell you if your page is accessible. For this reason, we never indicate that your page is accessible or if it has 'passed' WAVE. While we invite you to provide a link on your page to the WAVE report (or simply link to http://wave.webaim.org/refer), we do not provide any approval or certification indicators or badges.
What guidelines and standards does WAVE use? Section 508, WCAG, or both?
Our goal with WAVE is to support true accessibility and we have added as many tests for true accessibility as we can think of, including many checks for compliance issues found in the Section 508 and WCAG 2.0 guidelines. But WAVE cannot check all of the issues in these guidelines - no automated tool can. You can select certain guidelines and standards filters in the Details panel, but be careful, doing so might cause you to overlook important accessibility issues.
WAVE helps its users better evaluate the things that automatically tools cannot check. For example, WAVE cannot tell you if your alt text is equivalent and appropriate, so it instead reveals the alt text so it can be evaluated by the WAVE user. Using WAVE can help you determine if your site is both accessible AND compliant.
WAVE Views
WAVE displays accessibility information in three ways:
- Styles
- No Styles
- Contrast
Styles View presents your page with the embedded accessibility icons and indicators. This is the default view with most WAVE features enabled. Because of the complexity of this view, reports for some complex, CSS-powered layouts may become difficult to read. If this occurs, you can select the No Styles View. Scripting is removed from this an all other WAVE reports. Use the WAVE toolbar to evaluate scripts and script-modified web content.
No Styles View displays your page with styles disabled and tables linearized, thus revealing the unstyled HTML and the WAVE icons and indicators. This view also presents the underlying reading and navigation order, the order in which keyboard-only and screen reader users will access the page.
Contrast View shows only contrast issues on your page, based on WCAG 2.0 guidelines. You can use the tools in the details panel to review your color contrast, and even get updated colors that meet these guidelines.
In addition to the views above, you can select the Code tab at the bottom of the page to view the underlying markup of your page (note that the markup might be slightly different than the original, due to us necessarily removing scripting from your page).
Take a look at this video on use the WAVE Technology
HTML Best Practices
The HTML Best Practices are designed to give web developers the markup techniques they need to make web resources functionally accessible to people with disabilities and comply with the Section 508 Information Technology Accessibility Standards Links to an external site., the W3C Links to an external site., and the Web Content Accessibility Guidelines (WCAG) 2.0 Links to an external site.. The best practices development are based on the following principles:
- Benefits to people with disabilities
- Benefits to web developers
- Benefits to all users
- Support for automated testing
Moving Toward Accessible Design
The accessible repair approach commonly taken to improve the accessibility of web resources often results in web resources becoming more "technically accessible" but still remaining functionally unusable by many people with disabilities. The Best Practices avoid this problem by focusing on the functional requirements that improve access to all users, including people with disabilities. They are inspired by the needs of people with disabilities but are designed to give all users more options and control when accessing web resources and support the interoperability concepts of the web. In accessible design approach, less assumptions are made about what technologies will be used to access a web resource and emphasis is placed on separating content from styling and creating semantically meaningful markup. This provides all users with more options to use of a broader range of technologies and provide users with the ability to restyle information for their own needs, including people with disabilities.
Resources
All faculty, whether they teach online or oncampus, are required to meet the State and Federal requirements for ensuring accessibility of all course offerings. All courses must be accessible regardless of whether or not a disabled student is currently enrolled. Please use the following resources and tools to assist you in making your course accessible.
Evaluation and Repair Tools List
WAVE Links to an external site. is tool to help web developers make their web content more accessible. WAVE cannot tell you if your web content is accessible.
AChecker Links to an external site.. This tool checks single HTML pages for conformance with accessibility standards to ensure the content can be accessed by everyone.
AMP Express Links to an external site.checks your website against more than 900 individual conformance criteria for accessibility standards like Section 508 and WCAG.
VisCheck Links to an external site. is a free, on-line program that will evaluate your web page for color contrast and simulate what your site will look like to an individual with colorblindness. The download version requires the Photoshop software
Cynthia Says Links to an external site. portal is a joint education and outreach project of HiSoftware that helps users identify errors in their Web content related to Section 508 standards and/or the WCAG guidelines for Web accessibility.
Other Resources
The High Tech Center Training Unit (HTCTU) Links to an external site. has several training manuals and tutorials that provide more detailed information on making specific filetypes accessible to students with disabilities.
HiSoftware Links to an external site. educates users in the concepts behind website accessibility. It is meant for personal, non-commercial use to inform the community on what constitutes accessible web design and content. It helps users identify errors in their Web content related to Section 508 standards and/or the WCAG guidelines for Web accessibility.
Adobe Links to an external site.is an industry leader in accessibility and supports the creation of outstanding web experiences by encouraging developers to produce rich, engaging content that is accessible to all.
Please select the next tab above to move to the next content tab or the next button below to move to the next topic.