Accessibility: Difference between revisions

Revision as of 04:44, 2 October 2012

Websites built with accessibility in mind are flexible in meeting different user needs, preferences and situations. Though these methods can increase usability for everyone who uses the Web they are often legally required to be implemented in a specific effort to prevent discrimination against people with disabilities.

Starting points

These are some readable introductions to accessibility that cover; what accessibility is, why it is important, as well as practical advice.

Moodle-related accessibility coding guidelines

Use CSS, but still use headings, strong and emphasis: It is generally a good idea to separate a document's content HTML from how it is presented using CSS. There are some tags that affect a document's presentation but also contribute to the structure and meaning of the content. These tags should remain in HTML. This includes heading tags <h1>, <h2>, <h3>..., which are used to form the document's hierarchical structure, and <strong> and <em> tags, which are used to add meaning to sections of text.
Avoid using background images for important information: Users of non-visual browsers cannot see images. They can read the alt tags of normal images, but background images are not presented like normal images.
Image alt and title attributes should differ: An image alt tag provides a text equivalent to an image, whereas a title attribute adds supplementary information about the purpose or action associated with an image. Simply repeating the same text in alt and title attributes adds little and can be annoying for screen reader users.
Support dynamic interaction with ARIA attributes: Events triggered by AJAX and JavaScript can be less obvious to users of non-visual browsers. ARIA attributes can assist users of such browsers to follow a dynamic change.
Use labels with inputs: Context can easily be lost without a visual presentation. Labels are needed on all input input elements (except button) to describe their purpose in a form. Labels should be unique on a page. Repeated elements should have a unique label that identifies the element within its context.
Use appropriate page titles: A page title is a starting point for a screen reader. Page titles should be unique and should make sense for the page. Avoid generic page titles.
All pages should be navigable using just a keyboard: It should be possible navigate to all points on a page just using a keyboard. Important events triggered by a mouse event should be able to be triggered when the item receives focus through keyboard navigation.

Web standards, guidelines and legislation

International

Web Accessibility Initiative
- Web Content Accessibility Guidelines (WCAG)
- Web Content Accessibility Guidelines 2.0 (draft)
  - An article on the problems with WCAG2 from A List Apart

USA

Section 508

UK

Germany

Barrierefreie Informationstechnik-Verordnung - BITV

Tools

Resources

Dive Into Accessibility by Mark Pilgrim

Joe Clark's writings on accessibility

Building Accessible Websites by Joe Clark (online version)

@@ Line 1: / Line 1: @@
-Websites built with '''accessibility''' in mind are flexible in meeting different user needs, preferences and situations. Though these methods can increase [[Development:Usability|usability]] for everyone who uses the web they are often legally required to be implemented in a specific effort to prevent discrimination against people with disabilities.
+Websites built with '''accessibility''' in mind are flexible in meeting different user needs, preferences and situations. Though these methods can increase [[Development:Usability|usability]] for everyone who uses the Web they are often legally required to be implemented in a specific effort to prevent discrimination against people with disabilities.
-See the tracker under [http://tracker.moodle.org/browse/MDL-7396 Accessibility Compliance in Moodle 1.8] and [http://tracker.moodle.org/browse/MDL-7860 Compliance with Italian Legislation on Accessibility] for more information on what we are doing for Moodle 1.8.
 == Starting points ==
@@ Line 11: / Line 8: @@
 * [http://joeclark.org/book/ Joe Clark's ''Building Accessible Websites'' book]
-== Standards, guidelines and legislation ==
+== Moodle-related accessibility coding guidelines ==
+; Use CSS, but still use headings, strong and emphasis
+: It is generally a good idea to separate a document's content HTML from how it is presented using CSS. There are some tags that affect a document's presentation but also contribute to the structure and meaning of the content. These tags should remain in HTML. This includes heading tags <code>&lt;h1&gt;, &lt;h2&gt;, &lt;h3&gt;...</code>, which are used to form the document's hierarchical structure, and <code>&lt;strong&gt;</code> and <code>&lt;em&gt;</code> tags, which are used to add meaning to sections of text.
+; Avoid using background images for important information
+: Users of non-visual browsers cannot see images. They can read the <code>alt</code> tags of normal images, but background images are not presented like normal images.
+; Image <code>alt</code> and <code>title</code> attributes should differ
+: An image <code>alt</code> tag provides a text equivalent to an image, whereas a <code>title</code> attribute adds supplementary information about the purpose or action associated with an image. Simply repeating the same text in <code>alt</code> and <code>title</code> attributes adds little and can be annoying for screen reader users.
+; Support dynamic interaction with [[ARIA]] attributes
+: Events triggered by AJAX and JavaScript can be less obvious to users of non-visual browsers. [[ARIA]] attributes can assist users of such browsers to follow a dynamic change.
+; Use labels with inputs
+: Context can easily be lost without a visual presentation. Labels are needed on all input input elements (except button) to describe their purpose in a form. Labels should be unique on a page. Repeated elements should have a unique label that identifies the element within its context.
+; Use appropriate page titles
+: A page title is a starting point for a screen reader. Page titles should be unique and should make sense for the page. Avoid generic page titles.
+; All pages should be navigable using just a keyboard
+: It should be possible navigate to all points on a page just using a keyboard. Important events triggered by a mouse event should be able to be triggered when the item receives focus through keyboard navigation.
-=== International & USA ===
+== Web standards, guidelines and legislation ==
+=== International ===
 * [http://www.w3.org/WAI/ Web Accessibility Initiative]
@@ Line 19: / Line 33: @@
 ** [http://www.w3.org/WAI/intro/wcag20 Web Content Accessibility Guidelines 2.0 (draft)]
 *** An article on the [http://www.alistapart.com/articles/tohellwithwcag2 problems with WCAG2] from A List Apart
+=== USA ===
 * [http://www.section508.gov/ Section 508]
-=== Other countries ===
+=== UK ===
-* UK:
+* [http://www.parliament.the-stationery-office.co.uk/pa/ld200001/ldbills/003/2001003.htm SENDA - Special Educational Needs and Disability Act/Bill]
-: [http://www.parliament.the-stationery-office.co.uk/pa/ld200001/ldbills/003/2001003.htm SENDA - Special Educational Needs and Disability Act/Bill]
+* [http://www.opsi.gov.uk/acts/acts1995/1995050.htm Disability Discrimination Act 1995]
-: [http://www.opsi.gov.uk/acts/acts1995/1995050.htm Disability Discrimination Act 1995]
-* Germany:
+=== Germany ===
-: [http://www.einfach-fuer-alle.de/artikel/bitv/ Barrierefreie Informationstechnik-Verordnung - BITV]
+* [http://www.einfach-fuer-alle.de/artikel/bitv/ Barrierefreie Informationstechnik-Verordnung - BITV]
 == Tools ==
@@ Line 47: / Line 62: @@
 * [http://www.nvda-project.org/ NVDA NonVisual Desktop Access] - open source screen reader for Windows
-see also this [http://www.w3.org/WAI/ER/tools/complete long list of accessibility tools].
+See also this [http://www.w3.org/WAI/ER/tools/complete long list of accessibility tools].
 == Resources ==
@@ Line 60: / Line 75: @@
 * [http://juicystudio.com/article/validity-accessibility.php ''Validity and Accessibility'']
 * [http://www.edtec.unsw.edu.au/inter/support/accessibility/access_vids.cfm Videos showing as student accessing another Learning Management System via Screen Reader software]
-== Common accessibility coding errors ==
-; Using CSS for titles, bold and emphasis
-: It is generally a good idea to separate a document's content HTML and how it is presented using CSS, however where there are some tags that affect a document's presentation but also contribute to the structure and meaning of the content. These tags should remain in HTML. This includes heading tags <code>&lt;h1&gt;, &lt;h2&gt;, &lt;h3&gt;...</code>, which are used to form the document's hierarchical structure, and <code>&lt;strong&gt;</code> and <code>&lt;em&gt;</code> tags, which are used to add meaning to sections of text.
-; Avoid using background images for important information
-: Users of non-visual browsers cannot see images. They can read the <code>alt</code> tags of normal images, but background images are not presented like normal images.
 == See also ==
@@ Line 80: / Line 88: @@
 * [http://www.bbc.co.uk/blogs/bbcinternet/2008/03/homepage_accessibilty.html BBC blog post on how their Web 2.0 homepage was made accessible]
 * [http://www.bbc.co.uk/accessibility/ BBC Accessibility Help]
+* [http://tracker.moodle.org/browse/MDL-7396 Accessibility Compliance in Moodle 1.8]
+* [http://tracker.moodle.org/browse/MDL-7860 Compliance with Italian Legislation on Accessibility]
 [[Category:Coding guidelines|Accessibility]]
 [[Category:Accessibility]]

Documentation

Accessibility: Difference between revisions

Revision as of 04:44, 2 October 2012

Contents

Starting points

Moodle-related accessibility coding guidelines

Web standards, guidelines and legislation

International

USA

UK

Germany

Tools

Firefox extensions

Accessibility validation tools

Screen readers

Resources

See also