From d7834a1e5c02bc873f63873b8f5cef91b0f6ad55 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 21 Mar 2024 10:24:39 +0100 Subject: [PATCH 01/20] Integrate "How to Change Text Size or Colors" page directly in wai-website --- .gitmodules | 4 -- pages/wai-customize-design.md | 122 +++++++++++++++++++++++++++++++++- 2 files changed, 121 insertions(+), 5 deletions(-) mode change 120000 => 100755 pages/wai-customize-design.md diff --git a/.gitmodules b/.gitmodules index 362f6ff907a..b9ff7134855 100755 --- a/.gitmodules +++ b/.gitmodules @@ -154,10 +154,6 @@ path = _external/resources/wai-shared-experiences url = https://github.com/w3c/wai-shared-experiences.git branch = master -[submodule "_external/resources/wai-customize-design"] - path = _external/resources/wai-customize-design - url = https://github.com/w3c/wai-customize-design.git - branch = master [submodule "_external/resources/wai-sitemap"] path = _external/resources/wai-sitemap url = https://github.com/w3c/wai-sitemap.git diff --git a/pages/wai-customize-design.md b/pages/wai-customize-design.md deleted file mode 120000 index cd8899a4008..00000000000 --- a/pages/wai-customize-design.md +++ /dev/null @@ -1 +0,0 @@ -../_external/resources/wai-customize-design/index.md \ No newline at end of file diff --git a/pages/wai-customize-design.md b/pages/wai-customize-design.md new file mode 100755 index 00000000000..156ec695777 --- /dev/null +++ b/pages/wai-customize-design.md @@ -0,0 +1,121 @@ +--- +title: How to Change Text Size or Colors +layout: default +parent: "/" +permalink: /meta/customize/ +github: + repository: w3c/wai-website + path: 'pages/wai-customize-design.md' +license: creative-commons +feedbackmail: wai@w3.org +footer: > +

Date: Updated 4 March 2019. First published 2005.

+

Editors: Robert Jolly and Shawn Lawton Henry.

+--- + +
+ +To make text bigger, press two keys at the same time: + +* **Ctrl** _and_ **+** keys in Windows, Linux, and Chrome OS +* **⌘** _and_ **+** keys in Mac OS + +
+ +{::nomarkdown} +{% include box.html type="start" title="Summary" class="" %} +{:/} + +This page shows you how to change text size, text and background colors, and other display settings through your browser. + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include toc.html type="start" title="Page Contents" %} +{:/} + +- TOC is created automatically. +{:toc} + +{::nomarkdown} +{% include toc.html type="end" %} +{:/} + +## Change Text Size with Zoom + +

Most web browsers let you increase and decrease the size of text, images, and other web page content with "zoom" features. Some browsers let you choose to zoom only the text size.

+

To change the zoom in most browsers, press the following two keys at the same time:

+ + +Browsers provide specific guidance on different ways to change the page zoom or text-only zoom: + +* [Google Chrome - Change text, image, and video sizes (zoom)](https://support.google.com/chrome/answer/96810) +* [Apple Safari - Zoom in on webpages](https://support.apple.com/guide/safari/zoom-in-on-webpages-ibrw1068/mac) +* [Mozilla Firefox - Font size and zoom](https://support.mozilla.org/en-US/kb/font-size-and-zoom-increase-size-of-web-pages) +* [Opera - Zoom](https://help.opera.com/en/latest/browser-window/#zoom) +* [Internet Explorer - Ease of access options](https://support.microsoft.com/en-us/help/17456/windows-internet-explorer-ease-of-access-options) +* [Microsoft Edge - Ease of Access in Microsoft Edge](https://support.microsoft.com/en-gb/help/4000734/windows-10-microsoft-edge-ease-of-access) +* [Vivaldi - Zooming options in Vivaldi](https://help.vivaldi.com/article/zooming-options-in-vivaldi/) + +## Other Text and Color Changes + +Some browsers provide functionality to set different aspects of font and color in the default view. + +* [Mozilla Firefox - Change the fonts and colors websites use](https://support.mozilla.org/en-US/kb/change-fonts-and-colors-websites-use) +* [Opera - Look and feel > Fonts](https://help.opera.com/en/presto/look-and-feel/#fonts) +* [Microsoft Internet Explorer - Ease of Access Options](https://support.microsoft.com/en-us/help/17456/windows-internet-explorer-ease-of-access-options) + +Other text and color settings are available in Reader View. + +## Reader View + +Most browsers offer a "Reader View" or "Reading View" that shows just the main content; it gets rid of navigation, ads, etc. Some browsers let you set the text font, text size, text color, background color, and line spacing in Reader View. + +* [Apple Safari - Hide ads when reading articles](https://support.apple.com/en-ca/guide/safari/hide-ads-when-reading-articles-sfri32632/mac) +* [Mozilla Firefox - Reader View for clutter-free web pages](https://support.mozilla.org/en-US/kb/firefox-reader-view-clutter-free-web-pages) +* [Microsoft Edge - Change font style and size for Reading view in Microsoft Edge](https://support.microsoft.com/en-us/help/4028023/microsoft-edge-change-font-style-and-size-for-reading-view) +* [Vivaldi - Reader View](https://help.vivaldi.com/article/reader-view/) + +## Advanced Options + +There are many browser extensions and add-ons that provide additional control over how the browser displays text and other content. + +While most browsers no long support user style sheets, extensions provide similar advanced user control. For example, the Stylus extension is available for several major browsers. + +## More Information + +### Why doesn't this work with some other websites? + +The browser settings on this page should work when websites and browsers meet **[accessibility guidelines](/standards-guidelines/)** and are designed for accessibility, flexibility, and user control. However: +* **some websites are designed to defeat user's browser settings** +* **some browsers do not provide as much user control** + +Text resizing, browser zoom, and other user choices may not work consistently on websites that do not meet accessibility guidelines. + +### Should all websites include instructions like this? + +It's up to the website owner. It's not an accessibility requirement that websites include information on changing text sizes and colors like this page. We chose to include this information to help people who want to know how to change their browser settings. + +### Should websites provide a widget to change text, color, etc. + +We chose to provide these instructions so that users can learn how to change the display for all websites. Widgets change only the website they are on. + +### Note: No Endorsement + +The World Wide Web Consortium (W3C) does not endorse specific web browsers or extensions and does not recommend one over another. While some common browsers are included in this page, mention of a specific browser does not imply endorsement or recommendation. + From 6d5b0b675a2a54ed9ea7c001f0e46a864c39af9a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 21 Mar 2024 10:32:10 +0100 Subject: [PATCH 02/20] Remove wai-customize-design submodule --- _external/resources/wai-customize-design | 1 - 1 file changed, 1 deletion(-) delete mode 160000 _external/resources/wai-customize-design diff --git a/_external/resources/wai-customize-design b/_external/resources/wai-customize-design deleted file mode 160000 index 2df12ea729a..00000000000 --- a/_external/resources/wai-customize-design +++ /dev/null @@ -1 +0,0 @@ -Subproject commit 2df12ea729a63dda7b6df6b90d2c5f009f97be7c From a4d949950f67dea92b7b1024db6923f235077afc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 21 Mar 2024 15:01:15 +0100 Subject: [PATCH 03/20] Integrate "WCAG Mobile Overlap" resource directly into wai-website --- .gitmodules | 4 - _external/resources/wai-wcag-mob-overlap | 1 - .../wai-wcag-mob-overlap.md | 144 +++++++++++++++++- 3 files changed, 143 insertions(+), 6 deletions(-) delete mode 160000 _external/resources/wai-wcag-mob-overlap mode change 120000 => 100644 pages/standards-guidelines/wai-wcag-mob-overlap.md diff --git a/.gitmodules b/.gitmodules index b9ff7134855..7ab9786ed5b 100755 --- a/.gitmodules +++ b/.gitmodules @@ -146,10 +146,6 @@ path = _external/resources/wai-about-wai url = https://github.com/w3c/wai-about-wai.git branch = master -[submodule "_external/resources/wai-wcag-mob-overlap"] - path = _external/resources/wai-wcag-mob-overlap - url = https://github.com/w3c/wai-wcag-mob-overlap.git - branch = master [submodule "_external/resources/wai-shared-experiences"] path = _external/resources/wai-shared-experiences url = https://github.com/w3c/wai-shared-experiences.git diff --git a/_external/resources/wai-wcag-mob-overlap b/_external/resources/wai-wcag-mob-overlap deleted file mode 160000 index 14151bd5b0c..00000000000 --- a/_external/resources/wai-wcag-mob-overlap +++ /dev/null @@ -1 +0,0 @@ -Subproject commit 14151bd5b0cb6fdd19cc9462dbd1ebb268fdcf97 diff --git a/pages/standards-guidelines/wai-wcag-mob-overlap.md b/pages/standards-guidelines/wai-wcag-mob-overlap.md deleted file mode 120000 index c2b9b9a3074..00000000000 --- a/pages/standards-guidelines/wai-wcag-mob-overlap.md +++ /dev/null @@ -1 +0,0 @@ -../../_external/resources/wai-wcag-mob-overlap/index.md \ No newline at end of file diff --git a/pages/standards-guidelines/wai-wcag-mob-overlap.md b/pages/standards-guidelines/wai-wcag-mob-overlap.md new file mode 100644 index 00000000000..d97100d8efb --- /dev/null +++ b/pages/standards-guidelines/wai-wcag-mob-overlap.md @@ -0,0 +1,143 @@ +--- +title: "Web Content Accessibility and Mobile Web: Making a Website Accessible Both for People with Disabilities and for Mobile Devices" +title_html: "Web Content Accessibility and Mobile Web:
Making a Website Accessible Both for People with Disabilities and for Mobile Devices" +permalink: /standards-guidelines/wcag-mobile-overlap/ +layout: default +github: + repository: w3c/wai-website + path: 'pages/standards-guidelines/wai-wcag-mob-overlap.md' +doc-note-type: archived +doc-note-message-md: > + This page introduces how: + + - The user experience of *people with disabilities using "traditional" computers* is related to the user experience of *all mobile users (particularly those without disabilities)* + + - Accessibility guidelines and mobile best practices overlap. + + This page was developed in 2008, and most of it is still relevant. + + **For more recent information on *mobile accessibility* — that is, people with disabilities using content on mobile devices, see [www.w3.org/WAI/mobile/](https://www.w3.org/WAI/mobile/)** +footer: > +

+ Status: + Updated 31 August 2012 (first published January 2008 at www.w3.org/WAI/mobile/Overview.html, moved to www.w3.org/WAI/mobile/overlap.html in August 2012)
+ Editors: Shawn Lawton Henry and Justin Thorp. Developed by the Web Accessibility Initiative Education and Outreach Working Group (WAI EOWG) with the Mobile Web Best Practices Working Group (MWI BPWG). +

+--- + +{::options toc_levels="2" /} + +{::nomarkdown} +{% include_cached toc.html type="start" title="Page Contents" %} +{:/} + +- TOC is created automatically. +{:toc} + +{::nomarkdown} +{% include_cached toc.html type="end" %} +{:/} + +Quick links: [Shared Web +Experiences](http://www.w3.org/WAI/mobile/experiences), [Relationship +between MWBP and WCAG](http://www.w3.org/TR/mwbp-wcag/)
+Related page: [Mobile Accessibility](http://www.w3.org/WAI/mobile/) + +## Introduction + +With global mobile phone use at an all time high, there has been a surge +of interest in developing websites that are accessible from a mobile +device. Similarly, making websites accessible for people with +disabilities is an integral part of high quality websites, and in some +cases a legal requirement. + +Most Mobile Web specialists don't know about design issues for people +with disabilities. Likewise, most web accessibility specialists don't +know Mobile Web design best practices. + +**Websites (including applications) can more efficiently meet both goals +when designers and developers understand the significant overlap between +making a website accessible for a mobile device and for people with +disabilities.** The similarities are introduced below along with +benefits of addressing both and [resources with technical details of the +overlap](#doc_resources). + +## Similar Barriers + +Users of mobile devices and people with disabilities experience similar +barriers when interacting with web content. For example, mobile phone +users will have a hard time if a website's navigation requires the use +of a mouse because they typically only have an alphanumeric keypad. +Similarly, desktop computer users with a motor disability will have a +hard time using a website if they can't use a mouse. Additionally, +people with disabilities sometimes use mobile devices to access +websites. + +## Similar Solutions + +The W3C provides guidelines/standards on making accessible content and +best practices for making mobile-friendly content. + +- [Web Content Accessibility Guidelines + (WCAG)]({{ "/standards-guidelines/wcag/" | relative_url }}) is a guide for making + websites accessible to people with disabilities. +- [Mobile Web Best Practices](http://www.w3.org/TR/mobile-bp/) (MWBP) + is a guide for making websites usable from a mobile device. +- [Mobile Web Application Best Practices](http://www.w3.org/TR/mwabp/) + (MWABP) is a guide for developing and delivering web applications on + mobile devices. + +There is an overlap between MWBP, MWABP and WCAG. For example, the MWBP +best practice on [tab order](http://www.w3.org/TR/mobile-bp/#TAB_ORDER) +("Create a logical order through links, form controls and objects") +corresponds with the WCAG 2.0 success criteria on [focus +order](http://www.w3.org/TR/WCAG20/#navigation-mechanisms-focus-order) +("...focusable components receive focus in an order that preserves +meaning and operability"). + +## Doing Both - Designing for Mobile and for Accessibility + +Following these two guidelines makes your web content more accessible to +everyone regardless of situation, environment, or device. Designing to +the guidelines together, instead of separately, can make the process +more efficient — especially when considered [early in the +project]({{ "/planning/involving-users/" | relative_url }}). + +Websites that already meet WCAG or MWBP are already well on the way to +meeting the other. + +Understanding the overlap also strengthens the business case for +adopting WCAG or MWBP in a website that already complies with one, or +for adopting both together. See also [Developing a Web Accessibility +Business Case for Your +Organization](http://www.w3.org/WAI/bcase/Overview). + +## Resources + +The following resources provide a detailed mapping of the overlap +between the barriers and solutions for making websites accessible to +people with disabilities and usable on mobile devices. + +- [**Shared Web Experiences: Barriers Common to Mobile Device Users + and People with + Disabilities**](http://www.w3.org/WAI/mobile/experiences) lists web + interaction that is similar by a user with a disability and by a + user with a mobile device. It links to recommendations + for designing web content without these barriers from WCAG, MWBP, + and MWABP. +- [**Relationship between Mobile Web Best Practices (MWBP) and Web + Content Accessibility Guidelines + (WCAG)**](http://www.w3.org/TR/mwbp-wcag/) includes the following + pages: + - [**From MWBP to WCAG + 2.0**](http://www.w3.org/TR/mwbp-wcag/mwbp-wcag20.html) + and [From MWBP to WCAG + 1.0](http://www.w3.org/TR/mwbp-wcag/mwbp-wcag10.html) are + designed for those who already know MWBP and want to learn how + they relate to the Web Content Accessibility Guidelines (WCAG). + - [**From WCAG 2.0 to + MWBP**](http://www.w3.org/TR/mwbp-wcag/wcag20-mwbp.html) and + [From WCAG 1.0 to + MWBP](http://www.w3.org/TR/mwbp-wcag/wcag10-mwbp.html) are + designed for those who already know WCAG and want to learn how + it relates to the Mobile Web Best Practices (MWBP). \ No newline at end of file From d255db44c702b043dce95b4ca7eb1a82755e27d9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 21 Mar 2024 15:10:22 +0100 Subject: [PATCH 04/20] Integrate "Shared Web Experiences" resource directly into wai-website --- .gitmodules | 4 - _external/resources/wai-shared-experiences | 1 - .../wai-shared-experiences.md | 778 +++++++++++++++++- 3 files changed, 777 insertions(+), 6 deletions(-) delete mode 160000 _external/resources/wai-shared-experiences mode change 120000 => 100644 pages/standards-guidelines/wai-shared-experiences.md diff --git a/.gitmodules b/.gitmodules index 7ab9786ed5b..de07f2032fb 100755 --- a/.gitmodules +++ b/.gitmodules @@ -146,10 +146,6 @@ path = _external/resources/wai-about-wai url = https://github.com/w3c/wai-about-wai.git branch = master -[submodule "_external/resources/wai-shared-experiences"] - path = _external/resources/wai-shared-experiences - url = https://github.com/w3c/wai-shared-experiences.git - branch = master [submodule "_external/resources/wai-sitemap"] path = _external/resources/wai-sitemap url = https://github.com/w3c/wai-sitemap.git diff --git a/_external/resources/wai-shared-experiences b/_external/resources/wai-shared-experiences deleted file mode 160000 index bb4af3e8145..00000000000 --- a/_external/resources/wai-shared-experiences +++ /dev/null @@ -1 +0,0 @@ -Subproject commit bb4af3e8145e67ad9b3ba7f39eb9fdf6cbbb6ed3 diff --git a/pages/standards-guidelines/wai-shared-experiences.md b/pages/standards-guidelines/wai-shared-experiences.md deleted file mode 120000 index 8a05f11dc83..00000000000 --- a/pages/standards-guidelines/wai-shared-experiences.md +++ /dev/null @@ -1 +0,0 @@ -../../_external/resources/wai-shared-experiences/index.md \ No newline at end of file diff --git a/pages/standards-guidelines/wai-shared-experiences.md b/pages/standards-guidelines/wai-shared-experiences.md new file mode 100644 index 00000000000..9843ed18115 --- /dev/null +++ b/pages/standards-guidelines/wai-shared-experiences.md @@ -0,0 +1,777 @@ +--- +title: "Shared Web Experiences: Barriers Common to Mobile Device Users and People with Disabilities" +title_html: "Shared Web Experiences:
Barriers Common to Mobile Device Users and People with Disabilities" +permalink: /standards-guidelines/shared-experiences/ +github: + repository: w3c/wai-website + path: 'pages/standards-guidelines/wai-shared-experiences.md' +doc-note-type: archived +doc-note-message: > +

If you want current information on mobile accessibility — that is, people with disabilities using content on mobile devices, see https://www.w3.org/WAI/mobile/

+

This page is archived. We do not plan to update it. It was developed in 2008. Much of the information is still relevant today. It is useful for understanding that:

+
    +
  • Many of the issues around designing for mobile devices are addressed by designing for people with disabilities.
  • +
  • When you address accessibility, you improve the mobile experience. This can help in presenting your business case for accessibility.
  • +
+layout: default +footer: > +

Date: Archived. Updated 22 January 2013. First published January 2008.

+

Editors: Yeliz Yesilada (University of Manchester), Alan Chuter (Fundación ONCE), and Shawn Lawton Henry (W3C WAI).

+

Developed by the Education and Outreach Working Group (EOWG) with the Mobile Web Best Practices Working Group (MWI BPWG).

+--- + +{::nomarkdown} +{% include box.html type="start" h="2" title="Summary" class="full" %} +{:/} + +This page describes many of the barriers that people with disabilities +and people using mobile devices experience when interacting with web +content, including web applications. It shows how these **barriers are +similarly addressed in [W3C](http://www.w3.org/)'s Web Content +Accessibility Guidelines (WCAG), Mobile Web Best Practices, and Mobile +Web Application Best Practices.** + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +## Background + +People with disabilities using computers have similar interaction +limitations as people without disabilities who are using mobile devices. +Both experience similar barriers when interacting with websites and web +applications. There is also significant overlap between the design +solutions for both. For more background, see: + +- An introduction to the overlap between W3C guidelines for + accessibility and best practices for mobile devices: [Web Content + Accessibility and Mobile Web: Making a Website Accessible Both for + People with Disabilities and for Mobile + Devices](http://www.w3.org/WAI/mobile/overlap) +- [Introduction to Web + Accessibility](http://www.w3.org/WAI/intro/accessibility.php) +- [How People with Disabilities Use the + Web](http://www.w3.org/WAI/intro/people-use-web.php) + +A comprehensive comparison between MWBP and WCAG is provided in +[Relationship between Mobile Web Best Practices (MWBP) and Web Content +Accessibility Guidelines (WCAG)](http://www.w3.org/TR/mwbp-wcag/). + +## Introduction + +The barriers on this page are grouped under four principles: +perceivable, operable, understandable and robust. These principles lay +the foundation necessary for anyone to access and use web content, as +described in [Understanding the Four Principles of +Accessibility](http://www.w3.org/TR/UNDERSTANDING-WCAG20/intro.html#introduction-fourprincs-head) +section of Introduction to Understanding WCAG 2.0. (Mobile devices vary +widely and not all the barriers are present on all models.) + +This page includes links to some relevant solutions in: + +- [Web Content Accessibility Guidelines (WCAG) + 2.0](http://www.w3.org/TR/WCAG20/) +- [Web Content Accessibility Guidelines (WCAG) + 1.0](http://www.w3.org/TR/WCAG10/) ***Note:* [W3C WAI recommends + using WCAG 2.0]({{ "/standards-guidelines/wcag/" | relative_url }}#version), instead + of WCAG 1.0.** +- [Mobile Web Best Practices 1.0](http://www.w3.org/TR/mobile-bp/) +- [Mobile Web Application Best Practices](http://www.w3.org/TR/mwabp/) + +**The information below is also available in [tabular +format](experiences-table.html).** + +## Contents + +- **[Perceivable](#perceivable)** + - [Information conveyed solely with color](#color) + - [Large pages or large images](#image) + - [Multimedia with no captions](#multimedia) + - [Audio-only prompts (beeps) for important information (warnings, + errors)](#prompts) + - [Non-text objects (images, sound, video) with no text + alternative](#non-text) + - [Text entry](#text-entry) + - [Content formatted using tables or CSS, and reading order not + correct when linearized (for example when CSS or tables not + rendered)](#table) + - [Information conveyed only using CSS (visual + formatting)](#visual-formatting) +- **[Operable](#operable)** + - [Mouse required for interaction and navigation](#mouse) + - [Scripting required to operate content](#script) + - [Special plugin required](#plugin) + - [Missing or inappropriate page title](#title) + - [Inconsistency between focus (tab) order and logical document + content sequence](#tab) + - [Non descriptive link label](#link-label) +- **[Understandable](#understandable)** + - [Long words, long and complex sentences, jargon](#complex) + - [Content spawning new windows without warning user](#popups) + - [Blinking, moving, scrolling or auto-updating content](#dynamic) +- **[Robust](#robust)** + - [Invalid or unsupported markup](#markup) + - [Scripting required to generate content](#script-generate) + +## Perceivable + +Information and user interface components must be presentable to users +in ways they can perceive. + +Experiences discussed below are also available in [tabular +format](experiences-table.html#perceivable_section). + +{::nomarkdown} +{% include box.html type="start" title="Information conveyed solely with color" id="color" class="large" h="3" %} +{:/} + +User perceives color incorrectly or not at all, and so misses or +misunderstands information or makes mistakes. + +**Disabilities Context:** User who is blind or colorblind perceives +color incorrectly or not at all. + +- WCAG 2.0 success criteria: [1.4.1 Use of + Color](http://www.w3.org/TR/WCAG20/#visual-audio-contrast-without-color), +- [1.3.1 Info and + Relationships](http://www.w3.org/TR/WCAG20/#content-structure-separation-programmatic), +- [1.4.3 Contrast + (Minimum)](http://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast) + and +- [1.4.6 Contrast + (Enhanced)](http://www.w3.org/TR/WCAG20/#visual-audio-contrast7). +{:.inline} + +- WCAG 1.0 checkpoint: + [2.1](http://www.w3.org/TR/WAI-WEBCONTENT/wai-pageauth.html#tech-color-convey) + and +- [2.2](http://www.w3.org/TR/WAI-WEBCONTENT/wai-pageauth.html#tech-color-contrast). +{:.inline.wcag1} + +**Mobile Context:** Many screens have limited color palette and color +difference is not presented. Device is used in poor lighting (for +example, outdoors), so colors are not clearly perceived. + +- MWBP 1.0 Best Practice: + [USE\_OF\_COLOR](http://www.w3.org/TR/mobile-bp/#USE_OF_COLOR) and +- [COLOR\_CONTRAST](http://www.w3.org/TR/mobile-bp/#COLOR_CONTRAST). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Large pages or large images" id="image" class="large" h="3" %} +{:/} + +User only sees small areas at a time, is unable to relate different +areas of a page, and so becomes disoriented or has to scroll +excessively. Additionally, user cannot access picture details because +the picture is shrunk. + +**Disabilities Context:** User with restricted field of vision or using +screen magnifier gets only small part of page or image at a time. + +- WCAG 2.0 Success Criteria: [1.4.8 Visual + Presentation](http://www.w3.org/TR/WCAG20/#visual-audio-contrast-visual-presentation). +{:.inline} + +- WCAG 1.0 checkpoint: + [12.3](http://www.w3.org/TR/WAI-WEBCONTENT/wai-pageauth.html#tech-group-information). +{:.inline.wcag1} + +**Mobile Context:** Mobile device has small screen (viewport). + +- MWBP 1.0 Best Practice: + [PAGE\_SIZE\_USABLE](http://www.w3.org/TR/mobile-bp/#PAGE_SIZE_USABLE) and +- [SCROLLING](http://www.w3.org/TR/mobile-bp/#SCROLLING). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Multimedia with no captions" id="multimedia" class="large" h="3" %} +{:/} + +User misses auditory information. + +**Disabilities Context:** User who is deaf or hard of hearing cannot +hear. + +- WCAG 2.0 Success Criteria: [1.2.2 Captions + (Prerecorded)](http://www.w3.org/TR/WCAG20/#media-equiv-captions), + [1.2.4 Captions + (Live)](http://www.w3.org/TR/WCAG20/#media-equiv-real-time-captions) + and [1.2.8 Media Alternative + (Prerecorded)](http://www.w3.org/TR/WCAG20/#media-equiv-text-doc). +{:.inline} + +- WCAG 1.0 checkpoint: + [1.1](http://www.w3.org/TR/WAI-WEBCONTENT-TECHS/#tech-text-equivalent) + and +- [1.4](http://www.w3.org/TR/WCAG10#tech-synchronize-equivalents). +{:.inline.wcag1} + +**Mobile Context:** Mobile users often turn off sound in public places +(trains, hotel lobbies); or often cannot hear in noisy places (streets, +nightclubs). + +- MWBP 1.0 Best Practice: + [NON-TEXT-ALTERNATIVES](http://www.w3.org/TR/mobile-bp/#NON-TEXT_ALTERNATIVES). + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Audio-only prompts (beeps) for important information (warnings, errors)" id="prompts" class="large" h="3" %} +{:/} + +User cannot operate or interact correctly with content, misses prompts, +makes mistakes. + +**Disabilities Context:** User who is deaf or hard of hearing cannot +perceive content. + +- WCAG 2.0 Success Criteria: [1.2.1 Audio-only and Video-only + (Prerecorded)](http://www.w3.org/TR/WCAG20/#media-equiv-av-only-alt) +{:.inline} + +- WCAG 1.0 checkpoint: + [1.1](http://www.w3.org/TR/WAI-WEBCONTENT-TECHS/#tech-text-equivalent) + and +- [1.4](http://www.w3.org/TR/WCAG10#tech-synchronize-equivalents). +{:.inline.wcag1} + +**Mobile Context:** Users often cannot hear in noisy (street, nightclub) +or in public places (trains, hotel lobbies). + +- MWBP 1.0 Best Practice: + [NON\_TEXT\_ALTERNATIVES](http://www.w3.org/TR/mobile-bp/#NON-TEXT_ALTERNATIVES). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Non-text objects (images, sound, video) with no text alternative" id="non-text" class="large" h="3" %} +{:/} + +User cannot perceive important information or loses information due to +lack of alternative. + +**Disabilities Context:** User who is blind cannot perceive content that +include non-text objects. Furthermore, information not available to user +whose browser, assistive technology, other user agent doesn't support +object. + +- WCAG 2.0 Success Criteria: [1.1.1 Non-text + content](http://www.w3.org/TR/WCAG20/#text-equiv-all). +{:.inline} + +- WCAG 1.0 checkpoint: + [1.1](http://www.w3.org/TR/WAI-WEBCONTENT-TECHS/#tech-text-equivalent). +{:.inline.wcag1} + +**Mobile Context:** User can be billed for download volume so images +might be turned off to save costs. Some mobile user agents have limited +support for non-text objects so user loses information. Some user agents +also shrunk images in size to fit the device's screen which can make +images meaningless. + +- MWBP 1.0 Best Practice: + [NON\_TEXT\_ALTERNATIVES](http://www.w3.org/TR/mobile-bp/#NON-TEXT_ALTERNATIVES) + and + [OBJECTS\_OR\_SCRIPT](http://www.w3.org/TR/mobile-bp/#OBJECTS_OR_SCRIPT). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title=" Text entry" id=" text-entry " class="large" h="3" %} +{:/} + +User has difficulty entering text so text is entered incorrectly or +mistakes are made. + +**Disabilities Context:** User with motor disability (for example, +partial paralysis, hand tremor, lack of sensitivity, coordination) has +difficulty entering information. + +- WCAG 2.0 Guideline: [3.3 Input Assistance: Help users avoid and + correct mistakes](http://www.w3.org/TR/WCAG20/#minimize-error). +{:.inline} + +**Mobile Context:** Device has small keypad which has limited +functionality compared to a full keyboard, or is held in an unsteady +hand. + +- MWBP 1.0 Best Practice: + [MINIMIZE\_KEYSTROKES](http://www.w3.org/TR/mobile-bp/#MINIMIZE_KEYSTROKES), +- [PROVIDE\_DEFAULTS](http://www.w3.org/TR/mobile-bp/#PROVIDE_DEFAULTS) + and +- [DEFAULT\_INPUT\_MODE](http://www.w3.org/TR/mobile-bp/#DEFAULT_INPUT_MODE). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Content formatted using tables or CSS, and reading order not correct when linearized (for example when CSS or tables not rendered)" id="table" class="large" h="3" %} +{:/} + +User cannot understand the content correctly when it's presented in a +linear order. + +**Disabilities Context:** User who is blind reads content in document +tree order. + +- WCAG 2.0 Success Criteria: [1.3.2 Meaningful + Sequence](http://www.w3.org/TR/WCAG20/#content-structure-separation-sequence). +{:.inline} + +- WCAG 1.0 checkpoint: + [5.3](http://www.w3.org/TR/WCAG10#tech-avoid-table-for-layout) and +- [5.4](http://www.w3.org/TR/WCAG10#tech-table-layout). +{:.inline.wcag1} + +**Mobile Context:** Meaning of content can be changed because of +reformatting or restructuring in adaptation process. + +- MWBP 1.0 Best Practice: + [TABLES\_LAYOUT](http://www.w3.org/TR/mobile-bp/#TABLES_LAYOUT), + [TABLES\_NESTED](http://www.w3.org/TR/mobile-bp/#TABLES_NESTED) and + [TABLES\_ALTERNATIVES](http://www.w3.org/TR/mobile-bp/#TABLES_ALTERNATIVES). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Information conveyed only using CSS (visual formatting)" id="visual-formatting" class="large" h="3" %} +{:/} + +User is unable to access information encoded in visual formatting or in +CSS. + +**Disabilities Context:** User who is blind doesn't perceive visual +formatting effects. + +- WCAG 2.0 Success Criteria: [1.3.1 Info and + relationship](http://www.w3.org/TR/WCAG20/#content-structure-separation-programmatic). +{:.inline} + +- WCAG 1.0 checkpoint: + [6.1](http://www.w3.org/TR/WCAG10#tech-order-style-sheets). +{:.inline.wcag1} + +**Mobile Context:** Often no or limited CSS support or diverging CSS +support by mobile browser. + +- MWBP 1.0 Best Practice: + [STYLE\_SHEETS\_SUPPORT](http://www.w3.org/TR/mobile-bp/#STYLE_SHEETS_SUPPORT). + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +Operable +-------- + +User interface components and navigation must be operable. + +Experiences discussed below are also available in [tabular +format](experiences-table.html#operable_section). + +{::nomarkdown} +{% include box.html type="start" title="Mouse required for interaction and navigation" id="mouse" class="large" h="3" %} +{:/} + +User is unable to navigate all content, or wastes time moving through +numerous links. + +**Disabilities Context:** Some users with a motor disability cannot use +a mouse. Users who are blind also do not use the mouse. + +- WCAG 2.0 Guideline: [2.1 Keyboard + Accessible](http://www.w3.org/TR/WCAG20/#keyboard-operation). +{:.inline} + +- WCAG 1.0 checkpoint: + [6.3](http://www.w3.org/TR/WCAG10#tech-scripts), +- [6.4](http://www.w3.org/TR/WCAG10#tech-keyboard-operable-scripts), +- [6.5](http://www.w3.org/TR/WCAG10#tech-fallback-page) and +- [8.1](http://www.w3.org/TR/WCAG10#tech-directly-accessible). +{:.inline.wcag1} + +**Mobile Context:** Device has no mouse, only alphanumeric keypad or +joystick. + +- MWBP 1.0 Best Practice: + [OBJECTS\_OR\_SCRIPT](http://www.w3.org/TR/mobile-bp/#OBJECTS_OR_SCRIPT), + [IMAGE\_MAPS](http://www.w3.org/TR/mobile-bp/#IMAGE_MAPS), + [NAVBAR](http://www.w3.org/TR/mobile-bp/#NAVBAR), + [BALANCE](http://www.w3.org/TR/mobile-bp/#BALANCE) and + [ACCESS\_KEYS](http://www.w3.org/TR/mobile-bp/#ACCESS_KEYS). +- MWABP Best Practice: [3.5.3 Design for Multiple Interaction + Methods](http://www.w3.org/TR/mwabp/#bp-presentation-interaction). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Scripting required to operate content" id="script" class="large" h="3" %} +{:/} + +User cannot operate the content so loses some information. + +**Disabilities Context:** User's assistive technology or browser doesn't +support scripting. + +- WCAG 2.0 Conformance Requirement: [Conformance Requirement 4: Only + Accessibility-Supported Ways of Using + Technologies](http://www.w3.org/TR/UNDERSTANDING-WCAG20/conformance.html#cc4) + and +- [Conformance Requirement 5: + Non-Interference](http://www.w3.org/TR/UNDERSTANDING-WCAG20/conformance.html#cc5). +{:.inline} + +- WCAG 1.0 checkpoint: + [6.3](http://www.w3.org/TR/WCAG10#tech-scripts), +- [6.4](http://www.w3.org/TR/WCAG10#tech-keyboard-operable-scripts), +- [6.5](http://www.w3.org/TR/WCAG10#tech-fallback-page) and +- [8.1](http://www.w3.org/TR/WCAG10#tech-directly-accessible). +{:.inline.wcag1} + +**Mobile Context:** Scripting turned off or not supported. + +- MWBP 1.0 Best Practice: + [OBJECTS\_OR\_SCRIPT](http://www.w3.org/TR/mobile-bp/#OBJECTS_OR_SCRIPT). +- MWABP Best Practice: [3.6.4 Support a non-JavaScript Variant if + Appropriate](http://www.w3.org/TR/mwabp/#bp-devcap-scripting-support). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Special plugin required" id="plugin" class="large" h="3" %} +{:/} + +User can not perceive content or can not operate interface. + +**Disabilities Context:** Plugin turned off, or not installed, or not +compatible with assistive technology. Plugin not operable with preferred +input device. + +- WCAG 2.0 Success Criteria: [2.1.1 + Keyboard](http://www.w3.org/TR/WCAG20/#keyboard-operation-keyboard-operable) + and +- [2.1.3 Keyboard (No + Exception)](http://www.w3.org/TR/WCAG20/#keyboard-operation-all-funcs) +{:.inline} + +- WCAG 1.0 checkpoint: + [11.1](http://www.w3.org/TR/WCAG10#tech-latest-w3c-specs). +{:.inline.wcag1} + +**Mobile Context:** Plugin turned off, or not installed, or not +available; not compatible with input device (for example, requires +mouse). + +- MWBP 1.0 Best Practice: + [OBJECTS\_OR\_SCRIPT](http://www.w3.org/TR/mobile-bp/#OBJECTS_OR_SCRIPT). + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Missing or inappropriate page title" id="title" class="large" h="3" %} +{:/} + +User cannot easily scan to get an overview because of missing, +inappropriate, or long page title. + +**Disabilities Context:** User who is blind typically uses a screen +reader feature to get a list of the currently open windows, by window +title. Therefore, if the page title is long, inappropriate or missing, +user cannot perceive the content. + +- WCAG 2.0 Success Criteria: [2.4.2 Page + titled](http://www.w3.org/TR/WCAG20/#navigation-mechanisms-title). +{:.inline} + +- WCAG 1.0 checkpoint: + [13.2](http://www.w3.org/TR/WCAG10#tech-use-metadata). +{:.inline.wcag1} + +**Mobile Context:** Page title truncated to fit narrow viewport of +mobile device. + +- MWBP 1.0 Best Practice: + [PAGE\_TITLE](http://www.w3.org/TR/mobile-bp/#PAGE_TITLE). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Inconsistency between focus (tab) order and logical document content sequence" id="tab" class="large" h="3" %} +{:/} + +User is unable to navigate content in logical sequence, becomes +disoriented. + +**Disabilities Context:** User with motor disability uses keyboard for +navigation not mouse. User who is blind also often use tab navigation to +move from one element to another. + +- WCAG 2.0 Success Criteria: [2.4.3 Focus + order](http://www.w3.org/TR/WCAG20/#navigation-mechanisms-focus-order). +{:.inline} + +- WCAG 1.0 checkpoint: + [9.4](http://www.w3.org/TR/WCAG10#tech-tab-order). +{:.inline.wcag1} + +**Mobile Context:** Mobile devices may not have a pointing device so the +user may have to navigate elements serially. + +- MWBP 1.0 Best Practice: + [TAB\_ORDER](http://www.w3.org/TR/mobile-bp/#TAB_ORDER). + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Non descriptive link label" id="link-label" class="large" h="3" %} +{:/} + +User cannot determine to follow or not to follow a link because the link +label is not descriptive enough. + +**Disabilities Context:** User can not determine purpose of a link when +read out of context. User who is blind often accesses a list of links on +a page without the context around them. + +- WCAG 2.0 Success Criteria: [2.4.4 Link Purpose (In + Context)](http://www.w3.org/TR/WCAG20/#navigation-mechanisms-refs) + and +- [2.4.4 Link Purpose (Link + only)](http://www.w3.org/TR/WCAG20/#navigation-mechanisms-link). +{:.inline} + +- WCAG 1.0 checkpoint: + [13.1](http://www.w3.org/TR/WCAG10#tech-meaningful-links). +{:.inline.wcag1} + +**Mobile Context:** User can not determine purpose of link. + +- MWBP 1.0 Best Practice: + [LINK\_TARGET\_ID](http://www.w3.org/TR/mobile-bp/#LINK_TARGET_ID) + and + [LINK\_TARGET\_FORMAT](http://www.w3.org/TR/mobile-bp/#LINK_TARGET_FORMAT). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +Understandable +-------------- + +Information and the operation of user interface must be understandable. + +Experiences discussed below are also available in [tabular +format](experiences-table.html#understandable_section). + +{::nomarkdown} +{% include box.html type="start" title="Long words, long and complex sentences, jargon" id="complex" class="large" h="3" %} +{:/} + +User has difficulty understanding information. + +**Disabilities Context:** Users with some types of cognitive +disabilities have difficulty processing information. Users who are deaf +and whose native language is sign, have difficulty processing complex +written language. + +- WCAG 2.0 Success Criteria: [3.1.5 Reading + level](http://www.w3.org/TR/WCAG20/#meaning-supplements). +{:.inline} + +- WCAG 1.0 checkpoint: + [14.1](http://www.w3.org/TR/WCAG10#tech-simple-and-straightforward). +{:.inline.wcag1} + +**Mobile Context:** Text is displayed in small font, and user is often +distracted by ambient conditions (background noise, conversations, +moving objects in field of vision). + +- MWBP 1.0 Best Practice: + [SUITABLE](http://www.w3.org/TR/mobile-bp/#SUITABLE) and +- [CLARITY](http://www.w3.org/TR/mobile-bp/#CLARITY). + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Content spawning new windows without warning user" id="popups" class="large" h="3" %} +{:/} + +User becomes disoriented among windows; back button doesn't work. User +closes window, not realizing it is last in stack, closing browser +instance. + +**Disabilities Context:** User with low vision, or restricted field of +vision, or blindness, or cognitive disabilities doesn't realize active +window is new. + +- WCAG 2.0 Success Criteria: [3.1.2 On + focus](http://www.w3.org/TR/WCAG20/#consistent-behavior-receive-focus), +- [3.2.2 On + input](http://www.w3.org/TR/WCAG20/#consistent-behavior-unpredictable-change) + and +- [3.2.5 Change on + request](http://www.w3.org/TR/WCAG20/#consistent-behavior-no-extreme-changes-context). +{:.inline} + +- WCAG 1.0 checkpoint: + [10.1](http://www.w3.org/TR/WCAG10#tech-avoid-pop-ups). +{:.inline.wcag1} + +**Mobile Context:** Single window interface. Multiple stacked windows on +small screen hide each other. + +- MWBP 1.0 Best Practice: + [POP\_UPS](http://www.w3.org/TR/mobile-bp/#POP_UPS). + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Blinking, moving, scrolling or auto-updating content" id="dynamic" class="large" h="3" %} +{:/} + +User has difficulty reading and comprehending content. + +**Disabilities Context:** People with reading disabilities, cognitive +limitations, and learning disabilities do not have sufficient time to +read or comprehend information. + +- WCAG 2.0 Success Criteria: [2.2.2 Pause, Stop, + Hide](http://www.w3.org/TR/WCAG20/#time-limits-pause) and [3.2.5 + Change on + request](http://www.w3.org/TR/WCAG20/#consistent-behavior-no-extreme-changes-context). +{:.inline} + +- WCAG 1.0 checkpoint: + [7.4](http://www.w3.org/TR/WCAG10#tech-no-periodic-refresh) and +- [7.5](http://www.w3.org/TR/WCAG10#tech-no-auto-forward). +{:.inline.wcag1} + +**Mobile Context:** Reduced size of mobile viewport or poor ambient +lighting makes it difficult to see content. Auto-refreshed pages may +also have cost implications if they are left open or put unnoticed into +the background. + +- MWBP 1.0 Best Practice: + [AUTO\_REFRESH](http://www.w3.org/TR/mobile-bp/#AUTO_REFRESH) and + [IMAGES\_SPECIFY\_SIZE](http://www.w3.org/TR/mobile-bp/#IMAGES_SPECIFY_SIZE). + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +Robust +------ + +Content must be robust enough that it can be interpreted reliably by a +wide variety of user agents, including assistive technologies. + +Experiences discussed below are also available in [tabular +format](experiences-table.html#robust_section). + +{::nomarkdown} +{% include box.html type="start" title="Invalid or unsupported markup" id="markup" class="large" h="3" %} +{:/} + +User cannot access the content because browser or adaptation system +chokes on markup or rejects or garbles it. + +**Disabilities Context:** User's assistive technology or browser cannot +handle markup. + +- WCAG 2.0 Success Criteria: [4.1.1 + Parsing](http://www.w3.org/TR/WCAG20/#ensure-compat-parses). +{:.inline} + +- WCAG 1.0 checkpoint: + [3.2](http://www.w3.org/TR/WCAG10#tech-identify-grammar), +- [11.1](http://www.w3.org/TR/WCAG10#tech-latest-w3c-specs) and +- [11.2](http://www.w3.org/TR/WCAG10#tech-avoid-deprecated). +{:.inline.wcag1} + +**Mobile Context:** Some older mobile browsers do not display content +with invalid markup. + +- MWBP 1.0 Best Practice: + [VALID\_MARKUP](http://www.w3.org/TR/mobile-bp/#VALID_MARKUP). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include box.html type="start" title="Scripting required to generate content" id="script-generate" class="large" h="3" %} +{:/} + +User cannot access the content so loses some information because +scripting is not supported by the user agent. + +**Disabilities Context:** User's assistive technology or browser doesn't +support scripting. + +- WCAG 2.0 Success Criteria: [Understanding Guideline + 4.1](http://www.w3.org/TR/UNDERSTANDING-WCAG20/ensure-compat.html) +{:.inline} + +- WCAG 1.0 checkpoint: + [6.3](http://www.w3.org/TR/WCAG10#tech-scripts). +{:.inline.wcag1} + +**Mobile Context:** Scripting turned off or not supported. + +- MWBP 1.0 Best Practice: + [OBJECTS\_OR\_SCRIPT](http://www.w3.org/TR/mobile-bp/#OBJECTS_OR_SCRIPT). +{:.inline} + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + + \ No newline at end of file From 0a431633a1b341efa91b22a6818ee25d0679a170 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 21 Mar 2024 15:16:56 +0100 Subject: [PATCH 05/20] Integrate "Accessibility Conformance Testing (ACT) Overview" directly into wai-website --- .gitmodules | 4 - _external/resources/wai-intro-act | 1 - pages/standards-guidelines/wai-intro-act.md | 84 ++++++++++++++++++++- 3 files changed, 83 insertions(+), 6 deletions(-) delete mode 160000 _external/resources/wai-intro-act mode change 120000 => 100644 pages/standards-guidelines/wai-intro-act.md diff --git a/.gitmodules b/.gitmodules index de07f2032fb..5bcfdf2f3ea 100755 --- a/.gitmodules +++ b/.gitmodules @@ -170,10 +170,6 @@ path = _external/resources/wai-eval-standards url = https://github.com/w3c/wai-eval-standards.git branch = master -[submodule "_external/resources/wai-intro-act"] - path = _external/resources/wai-intro-act - url = https://github.com/w3c/wai-intro-act.git - branch = master [submodule "_external/resources/wai-video-standards-and-benefits"] path = _external/resources/wai-video-standards-and-benefits url = https://github.com/w3c/wai-video-standards-and-benefits.git diff --git a/_external/resources/wai-intro-act b/_external/resources/wai-intro-act deleted file mode 160000 index c16e9bf0789..00000000000 --- a/_external/resources/wai-intro-act +++ /dev/null @@ -1 +0,0 @@ -Subproject commit c16e9bf078946f414711a6e78ec4996467b6c644 diff --git a/pages/standards-guidelines/wai-intro-act.md b/pages/standards-guidelines/wai-intro-act.md deleted file mode 120000 index c2c835ee8ba..00000000000 --- a/pages/standards-guidelines/wai-intro-act.md +++ /dev/null @@ -1 +0,0 @@ -../../_external/resources/wai-intro-act/index.md \ No newline at end of file diff --git a/pages/standards-guidelines/wai-intro-act.md b/pages/standards-guidelines/wai-intro-act.md new file mode 100644 index 00000000000..24a4d144ae7 --- /dev/null +++ b/pages/standards-guidelines/wai-intro-act.md @@ -0,0 +1,83 @@ +--- +title: Accessibility Conformance Testing (ACT) Overview +permalink: /standards-guidelines/act/ +lang: en +github: + repository: w3c/wai-website + path: 'pages/standards-guidelines/wai-intro-act.md' +feedbackmail: wai@w3.org +footer: > +

Date: Updated 30 October 2020.

+

Editors: Shadi Abou-Zahra and Shawn Lawton Henry.

+

Developed with input from the Education and Outreach Working Group (EOWG) and the ACT Task Force. ACT work is supported by the WAI-Tools Project, co-funded by the European Commission.

+ +--- + +{::nomarkdown} +{% include box.html type="start" h="2" title="Summary" class="full" %} +{:/} + +This page introduces the [Accessibility Conformance Testing (ACT) Rules Format](https://www.w3.org/TR/act-rules-format/) and lists ACT Rules formally published by W3C. + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + + +{::options toc_levels="2" /} + +{::nomarkdown} +{% include_cached toc.html type="start" title="Page Contents" %} +{:/} + +- TOC is created automatically. +{:toc} + +{::nomarkdown} +{% include_cached toc.html type="end" %} +{:/} + +## Introduction + +The purpose of the Accessibility Conformance Testing (ACT) effort is to establish and document rules for testing the conformance of web content to accessibility standards, such as Web Content Accessibility Guidelines (WCAG). These test rules address automated, semi-automated, and manual testing. ACT makes accessibility testing more transparent, and thus reduces confusion caused by different interpretations of accessibility guidelines. + +## Who ACT is for + +The primary audience of Accessibility Conformance Testing (ACT) is developers of accessibility evaluation methodologies and testing tools. They write, share, and implement ACT Rules into their products and services. + +A secondary audience is accessibility experts. They often assist in setting an organization's accessibility policy, and it is important for them to know what ACT Rules do, and how they relate to their own requirements. + +Who ACT is **not** for: Users of accessibility tools (web developers, content authors, QA testers, etc.) are not expected to read ACT. These audiences will use products and services that implement ACT Rules. + +## What is in ACT + +### ACT Rules Format 1.0 + +**[Accessibility Conformance Testing (ACT) Rules Format 1.0](https://www.w3.org/TR/act-rules-format/)** is a W3C Recommendation (web standard) that defines a format for writing test rules. The latest [Editor Draft](https://w3c.github.io/wcag-act/act-rules-format.html) and [GitHub repository](https://github.com/w3c/wcag-act/) are available for future development. + +#### Technical document format + +The ACT Rules Format follows the W3C format for technical specifications, which includes several sections at the beginning: links to different versions, editors, copyright, abstract, and status with the link to errata and the email address for comments. + +### ACT Rules Repository + +**[List of Accessibility Conformance Testing (ACT) Rules](/standards-guidelines/act/rules/)** formally published by the W3C Accessibility Guidelines Working Group (AG WG). More rules are expected in the coming months. The [ACT Rules Community Group](https://www.w3.org/community/act-r/) developed over [50 rules](https://act-rules.github.io/rules/), many of which will be submitted to the AG WG for review and approval. Other entities can also contribute candidate rules for review and approval. + +#### Future of ACT Rules + +We expect more ACT Rules to be formally published by W3C as further candidate rules are contributed by the community. Contact Daniel Montalvo for questions on how to contribute candidate rules and participate in the review process of ACT Rules. + +## Who develops ACT + +The [ACT Task Force](https://www.w3.org/WAI/GL/task-forces/conformance-testing/) of the W3C Accessibility Guidelines Working Group ([AG WG](https://www.w3.org/WAI/GL/)) develops the [ACT Rules Format](https://www.w3.org/TR/act-rules-format/) specification. The ACT Task Force also reviews test rules contributed by the community in first instance. Formal publication of the ACT Rules Format specification and of ACT Rules listed on this page is made by AG WG. + +The [ACT Rules Community Group](https://www.w3.org/community/act-r/) develops test rules according to the ACT Rules Format specification. These rules by the community group do not have any formal standing in the W3C process. + +Opportunities for contributing to ACT and other WAI work are introduced in [Participating in WAI](/about/participating/). + +## Additional information + +For more information, see: +* [Calibrate Your Accessibility Evaluation with ACT blog post](https://www.w3.org/blog/2019/10/calibrate-your-accessibility-evaluation-with-act/) +* [Harmonized Accessibility Testing blog post](https://www.w3.org/blog/2019/07/harmonized-accessibility-testing/) +* [ACT Rules Community Group GitHub workspace](https://act-rules.github.io/) From a056b142a49db1dc6b27510bf08c7eb1cdbd46ee Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 21 Mar 2024 15:24:48 +0100 Subject: [PATCH 06/20] Integrate "EARL Overview" directly into wai-website --- .gitmodules | 4 - _external/resources/wai-intro-earl | 1 - pages/standards-guidelines/wai-intro-earl.md | 79 +++++++++++++++++++- 3 files changed, 78 insertions(+), 6 deletions(-) delete mode 160000 _external/resources/wai-intro-earl mode change 120000 => 100644 pages/standards-guidelines/wai-intro-earl.md diff --git a/.gitmodules b/.gitmodules index 5bcfdf2f3ea..c79fe18ef62 100755 --- a/.gitmodules +++ b/.gitmodules @@ -118,10 +118,6 @@ path = _external/resources/wai-intro-wcag url = https://github.com/w3c/wai-intro-wcag.git branch = master -[submodule "_external/resources/wai-intro-earl"] - path = _external/resources/wai-intro-earl - url = https://github.com/w3c/wai-intro-earl.git - branch = master [submodule "_external/resources/wai-intro-uaag"] path = _external/resources/wai-intro-uaag url = https://github.com/w3c/wai-intro-uaag.git diff --git a/_external/resources/wai-intro-earl b/_external/resources/wai-intro-earl deleted file mode 160000 index e26bd25425f..00000000000 --- a/_external/resources/wai-intro-earl +++ /dev/null @@ -1 +0,0 @@ -Subproject commit e26bd25425f1ff0a826b65135f38e8c463f23d26 diff --git a/pages/standards-guidelines/wai-intro-earl.md b/pages/standards-guidelines/wai-intro-earl.md deleted file mode 120000 index 62d679b7508..00000000000 --- a/pages/standards-guidelines/wai-intro-earl.md +++ /dev/null @@ -1 +0,0 @@ -../../_external/resources/wai-intro-earl/index.md \ No newline at end of file diff --git a/pages/standards-guidelines/wai-intro-earl.md b/pages/standards-guidelines/wai-intro-earl.md new file mode 100644 index 00000000000..0160074402b --- /dev/null +++ b/pages/standards-guidelines/wai-intro-earl.md @@ -0,0 +1,78 @@ +--- +title: Evaluation and Report Language (EARL) Overview +permalink: /standards-guidelines/earl/ +layout: default +github: + repository: w3c/wai-website + path: 'pages/standards-guidelines/wai-intro-earl.md' +feedbackmail: wai@w3.org +footer: > +

Date: Updated 3 July 2018. First published 23 July 2005.

+

Editors: Shadi Abou-Zahra and Shawn Lawton Henry.

+

Developed with input from the Education and Outreach Working Group (EOWG) and the Evaluation and Repair Tools Working Group Working Group (ERT WG).

+--- + +{::nomarkdown} +{% include box.html type="start" h="2" title="Summary" class="full" %} +{:/} + +This page introduces the Evaluation and Report Language (EARL). + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::options toc_levels="2" /} + +{::nomarkdown} +{% include_cached toc.html type="start" title="Page Contents" %} +{:/} + +- TOC is created automatically. +{:toc} + +{::nomarkdown} +{% include_cached toc.html type="end" %} +{:/} + +The Evaluation and Report Language (EARL) is a machine-readable format for expressing test results. The primary motivation for developing EARL is to facilitate the processing of test results, such as those generated by web accessibility evaluation tools, using a vendor-neutral and platform-independent format. + +Web authoring tools and quality assurance software can use EARL to aggregate test results obtained from different testing tools including web accessibility evaluation tools, validators, and other types of content checkers. EARL uses the Resource Description Framework (RDF) to define the terms for expressing test results. + +## Who EARL is for + +EARL is primarily intended for developers of: + +- Web accessibility evaluation tools +- Web quality assurance and validation tools +- Web authoring and development tools +- Web content description and labeling frameworks + +## What is in EARL + +EARL is an RDF vocabulary, the terms of which are defined by the following specifications: + +- [Evaluation And Report Language (EARL) 1.0 Schema](https://www.w3.org/TR/EARL10-Schema/) - defines the core schema for EARL. +- [Developer Guide for Evaluation And Report Language (EARL) 1.0](https://www.w3.org/TR/EARL10-Guide/) - describes the motivations for EARL and provide a tutorial introduction on how to use the terms. +- [HTTP Vocabulary in RDF 1.0](https://www.w3.org/TR/HTTP-in-RDF10/) - provides terms to record HTTP exchanges between a client and a server in RDF. +- [Representing Content in RDF 1.0](https://www.w3.org/TR/Content-in-RDF10/) - provides terms to represent content (such as HTTP body entities) in RDF. +- [Pointer Methods in RDF 1.0](https://www.w3.org/TR/Pointers-in-RDF10/) - provides terms for representing pointers - entities that permit identifying a portion or segment of a piece of content. +- [Requirements for the Evaluation and Report Language (EARL) 1.0](https://www.w3.org/TR/EARL10-Requirements/) - describes the requirements for the scope, design, and features of EARL. + +EARL 1.0 reuses other RDF terms such as those provided by the [Dublin Core Metadata Initiative (DCMI)](https://www.dublincore.org/) and the [Friend Of A Friend (FOAF)](http://www.foaf-project.org/) project. EARL terms can also be reused for other purposes, such as for content description and content labeling. + +## What is the status of EARL + +EARL specifications are published as non-normative W3C Working Group Notes. + +### Technical document format + +The EARL documents follow the W3C format for technical specifications, which includes several sections at the beginning: links to different versions, editors, copyright, abstract, and status with the link to errata and the email address for comments. Most WAI specifications have a link at the top to the Table of Contents. + +## Who develops EARL + +EARL documents were developed by the [Evaluation and Repair Tools Working Group (ERT WG)](/WAI/ER), which was part of the World Wide Web Consortium ([W3C](https://www.w3.org)) Web Accessibility Initiative ([WAI](/WAI/)) until 2014. + +Some of the terms defined by EARL are being used by the [Accessibility Conformance Testing (ACT) Rules Format 1.0](https://www.w3.org/TR/act-rules-format/) currently being developed by the [ACT Task Force](https://www.w3.org/WAI/GL/task-forces/conformance-testing/). See [[ACT Overview]](/standards-guidelines/act/) for more information. + +Opportunities for contributing to EARL and other WAI work are introduced in [[Participating in WAI]](/about/participating/). From b81ea427b667a66e2beda26865e84d3ae70f7f9f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 21 Mar 2024 19:12:55 +0100 Subject: [PATCH 07/20] Integrate "Combined Expertise" Resource directly into wai-website --- .gitmodules | 4 - _external/resources/wai-inclusion | 1 - pages/test-eval/wai-combined-expertise.md | 120 +++++++++++++++++++++- 3 files changed, 119 insertions(+), 6 deletions(-) delete mode 160000 _external/resources/wai-inclusion mode change 120000 => 100644 pages/test-eval/wai-combined-expertise.md diff --git a/.gitmodules b/.gitmodules index c79fe18ef62..d9a641c570f 100755 --- a/.gitmodules +++ b/.gitmodules @@ -82,10 +82,6 @@ path = _external/resources/wai-eval-report-templates url = https://github.com/w3c/wai-eval-report-templates.git branch = master -[submodule "_external/resources/wai-combined-expertise"] - path = _external/resources/wai-combined-expertise - url = https://github.com/w3c/wai-combined-expertise.git - branch = master [submodule "_external/resources/wai-InvolveUsersAll"] path = _external/resources/wai-InvolveUsersAll url = https://github.com/w3c/wai-InvolveUsersAll.git diff --git a/_external/resources/wai-inclusion b/_external/resources/wai-inclusion deleted file mode 160000 index 6348fab280f..00000000000 --- a/_external/resources/wai-inclusion +++ /dev/null @@ -1 +0,0 @@ -Subproject commit 6348fab280f450018cb1bc212198d235cabd2cd4 diff --git a/pages/test-eval/wai-combined-expertise.md b/pages/test-eval/wai-combined-expertise.md deleted file mode 120000 index ff502cf72d0..00000000000 --- a/pages/test-eval/wai-combined-expertise.md +++ /dev/null @@ -1 +0,0 @@ -../../_external/resources/wai-combined-expertise/index.md \ No newline at end of file diff --git a/pages/test-eval/wai-combined-expertise.md b/pages/test-eval/wai-combined-expertise.md new file mode 100644 index 00000000000..6daf3214cc5 --- /dev/null +++ b/pages/test-eval/wai-combined-expertise.md @@ -0,0 +1,119 @@ +--- +title: Using Combined Expertise to Evaluate Web Accessibility +lang: en +permalink: /test-evaluate/combined-expertise/ +layout: default +github: + repository: w3c/wai-website + path: 'pages/test-eval/wai-combined-expertise.md' +footer: > +

Date: Versions and links updated 21 March 2024. Substantive content updated 2002.

+

Editor: Judy Brewer.

+

Developed by the Education and Outreach Working Group (EOWG). Developed with support from WAI-TIES, a project of the European Commission IST Programme

+--- + +{::options toc_levels="2" /} +{::nomarkdown} +{% include_cached toc.html type="start" title="Page Contents" class="full" %} +{:/} +- TOC is created automatically. +{:toc} +{::nomarkdown} +{% include_cached toc.html type="end" %} +{:/} + +## Introduction + +Evaluating the accessibility of Web content for people with disabilities requires diverse kinds of expertise and perspectives. While it is possible for individuals to evaluate Web accessibility effectively if they have training and experience across a broad range of disciplines, it is less likely that one individual will have all the expertise that a collaborative approach can bring.  + +This document describes:  + +- recommended expertise for evaluating Web accessibility +- approaches for creating collaborative evaluation processes +- considerations for effective collaboration in different settings + +References to related evaluation resources are mentioned throughout this document. Most of these resources can be found in, [[Evaluating Web Accessibility Overview]](/test-evaluate/). + +## Recommended Expertise +{:#expertise} + +Effective evaluation of Web accessibility requires more than simply running an evaluation tool on a Web site. Comprehensive and effective +evaluations require evaluators with an understanding of Web technologies, evaluation tools, barriers that people with disabilities experience, assistive technologies and approaches that people with disabilities use, and accessibility guidelines and techniques. + +The following list includes recommended expertise across a variety of areas, and provides links to initial resources, listed in the [Appendix](#appendix) at the end of this document, which may be useful in learning more about those areas.  +- Web technologies +- Validation tools for Web technologies +- Web Content Accessibility Guidelines and Techniques +- Approaches for evaluating Web accessibility +- Use of a variety of evaluation tools for Web site accessibility +- Disability barriers, assistive technologies, and adaptive strategies +- Involvement of people with disabilities in evaluation + +## Approaches for Collaborative Evaluation +{:#composition} + +When first conducting a Web accessibility evaluation, the initial approach in many organizations is to assign the task to an individual +within the organization, or to outsource it. However, many organizations use a collaborative evaluation process involving the skills and perspectives of multiple evaluators. This approach allows an organization to use in-house expertise as well as outside experts where needed. + +Collaborative evaluation processes can involve: + +- a group of colleagues distributed within a larger organization; for instance, Web developers from different units of a large corporation working together +- a Web development or quality assurance team within a larger organization, which brings in outside experts to help them conduct evaluations in the short term and helps them build improved capability for in-house evaluation over the long term +- a small business whose mission is to provide accessibility evaluation services, and which does so with a multi-disciplinary team +- disability advocates from different organizations who collaborate in online fora to monitor accessibility of Web sites +- a group of individuals distributed across related organizations such as government agencies, each with the obligation to monitor accessibility of their own Web site, who combine their diverse expertise & perspectives for higher quality evaluations + +## Considerations in Combining Expertise +{:#operation} + +### Centralized versus distributed evaluation capability + +Organizations with in-house evaluation capacity sometimes use a centralized group of evaluators, and sometimes use evaluators who are distributed across the organization. A centralized team can serve as a resource for the rest of the organization. Evaluation capability that is distributed across an organization may offer more possibilities for integrating accessibility work into Web development processes throughout the organization. It may help in identifying more diverse expertise since one can look beyond the boundaries of a centralized team. In addition, it can help in developing a shared organizational mission for continual improvement of accessibility, rather than leaving oversight of accessibility as the responsibility of a single office. + +### Identification of external expertise + +Once gaps in internal expertise are clear, an organization can prioritize its needs for external expertise. The internal gaps are often in areas of knowledge specific to disability and/or accessibility; for instance, Web accessibility guidelines, cross-disability accessibility barriers, or use of assistive technologies. In addition, even organizations with established user testing processes may need guidance on how to get feedback from users with disabilities. It can be valuable in some cases to bring in more than one outside expert to cover this range of issues effectively, or to look for feedback in online communities focusing on Web accessibility. + +### Involving users in evaluation + +Inclusion of people with disabilities in a collaborative group can contribute to a better understanding of accessibility issues within the organization, and/or to maintaining awareness of the urgency of addressing accessibility barriers on a site, in addition to their individual technical contributions to the evaluation. + +Regardless of the collective expertise of a collaborative group of evaluators in conducting conformance evaluations, an organization may want to ensure periodic review by users with a variety of disabilities. There are many factors to consider in effectively [involving users in Web accessibility evaluations](/test-evaluate/involving-users/), including ensuring diversity in disabilities represented, types of assistive technology used, and experience with the Web. + +### Facilitating collaboration through shared tools and templates + +A group of evaluators may want to arrange for shared access to certain evaluation tools, or to ensure that they have access to a [broad range of evaluation tools](/test-evaluate/tools/list/) across the group as a whole. + +Using an agreed-upon template for reporting the results of evaluations can greatly facilitate coordination between different evaluators. Such a template might be an adaptation of the [[Template for Accessibility Evaluation Reports]](/test-evaluate/report-template/). + +### Communicating results + +Collaborative teams may want to give particular attention to communicating the results of their evaluations to their customers clearly, since their reports represent the combined perspectives of different evaluators.  + +### Getting and giving feedback + +Providing a mechanism for feedback within an organization on the usefulness of the evaluation process and resulting report may assist +collaborative evaluators in ongoing identification of gaps in expertise, and contribute to long-term improvement in the quality of evaluations. + +Feedback from experienced groups of evaluators on evaluation resources such as W3C/WAI's resources in [[Evaluating Web Accessibility Overview]](/test-evaluate/) can, over time, also help improve the quality of evaluation support resources available to the broader Web community. Feedback links are available in the footers of pages in this Evaluation resource suite. + +## Appendix + +This appendix includes links to resources related to key areas of expertise needed for Web accessibility evaluation. + +- {:#webtechs} Web technologies + - [W3C Specifications and Standards](https://www.w3.org/TR/) +- {:#wcag} Web Content Accessibility Guidelines and Techniques + - [[Web Content Accessibility Guidelines (WCAG) Overview]](/standards-guidelines/wcag/) + - [How to Meet WCAG (Quick Reference)](https://www.w3.org/WAI/WCAG22/quickref/) + - [Web Content Accessibility Guidelines 2](https://www.w3.org/TR/WCAG/) + - {:#techs} [Techniques for WCAG 2](https://www.w3.org/WAI/WCAG22/Techniques/) +- {:#approacheval} Approaches for evaluating web accessibility + - [[Evaluating Web Accessibility Overview]](/test-evaluate/) +- {:#evaltools} Use of a variety of evaluation tools for Web site accessibility + - [[Selecting Web Accessibility Evaluation Tools]](/test-evaluate/tools/selecting/) + - [[Evaluation Tools for Web Accessibility]](/test-evaluate/tools/list/) +- {:#barriers} Disability barriers and assistive technologies and adaptive strategies + - [[How People with Disabilities Use the Web]](/people-use-web/) +- {:#involveusers} Involvement of people with disabilities in evaluation + - [[Involving Users in Web Accessibility Evaluation]](/test-evaluate/involving-users/) From e8b9eab7971ba4dc5403fe103c485a1f7d9a7da2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 21 Mar 2024 19:45:20 +0100 Subject: [PATCH 08/20] Integrate "Accessibility, Usability, Inclusion" directly into wai-website --- .gitmodules | 4 - .../accessibility-usability-inclusion.md | 114 +++++++++++++++++- 2 files changed, 113 insertions(+), 5 deletions(-) mode change 120000 => 100644 pages/fundamentals/accessibility-usability-inclusion.md diff --git a/.gitmodules b/.gitmodules index d9a641c570f..30f8aeb5012 100755 --- a/.gitmodules +++ b/.gitmodules @@ -2,10 +2,6 @@ path = _external/data url = https://github.com/w3c/wai-website-data.git branch = master -[submodule "_external/resources/wai-inclusion"] - path = _external/resources/wai-inclusion - url = https://github.com/w3c/wai-inclusion.git - branch = gh-pages [submodule "_external/resources/wai-bcase"] path = _external/resources/wai-bcase url = https://github.com/w3c/wai-bcase.git diff --git a/pages/fundamentals/accessibility-usability-inclusion.md b/pages/fundamentals/accessibility-usability-inclusion.md deleted file mode 120000 index 1061ff91477..00000000000 --- a/pages/fundamentals/accessibility-usability-inclusion.md +++ /dev/null @@ -1 +0,0 @@ -../../_external/resources/wai-inclusion/index.md \ No newline at end of file diff --git a/pages/fundamentals/accessibility-usability-inclusion.md b/pages/fundamentals/accessibility-usability-inclusion.md new file mode 100644 index 00000000000..339a5984de7 --- /dev/null +++ b/pages/fundamentals/accessibility-usability-inclusion.md @@ -0,0 +1,113 @@ +--- +title: Accessibility, Usability, and Inclusion +lang: en +github: + repository: w3c/wai-website + path: 'pages/fundamentals/accessibility-usability-inclusion.md' +permalink: /fundamentals/accessibility-usability-inclusion/ +layout: default +footer: > +

Date: Updated 6 May 2016. First published March 2010.

+

Editors: Shawn Lawton HenryShadi Abou-Zahra, and Kevin White. Contributors: Sharron Rush, and EOWG Participants.

+

Developed by the Education and Outreach Working Group (EOWG). Previously developed with support of the WAI-AGE Project.

+--- + +## Introduction +{:.no-display} + +*Accessibility, usability, and inclusion* are closely related aspects in creating a web that works for everyone. Their goals, approaches, and guidelines overlap significantly. It is most effective to address them together when designing and developing websites and applications. + +There are a few situations when it's important to focus specifically on one aspect. For example, when developing standards and policies. Researching the accessibility needs of people with disabilities helps with developing those. + +This article briefly: + +- explains the distinctions and overlaps between accessibility, usability, and inclusive design, +- encourages increased coordination across research and practice in these disciplines, and, +- points out the importance of maintaining the focus of accessibility on people with disabilities. + +Distinctions and Overlaps {#terms} +------------------------- + +**Accessibility**: addresses discriminatory aspects related to equivalent user experience for people with disabilities. Web accessibility means that people with disabilities can equally perceive, understand, navigate, and interact with websites and tools. It also means that they can contribute equally without barriers. For more information, see the [Accessibility introduction](/fundamentals/accessibility-intro/). + +**Usability**: is about designing products to be effective, efficient, and satisfying. Usability includes *user experience design*. This may include general aspects that impact everyone and do not disproportionally impact people with disabilities. Usability practice and research often does not sufficiently address the needs of people with disabilities. + +**Inclusion**: is about diversity, and ensuring involvement of everyone to the greatest extent possible. In some regions this is also referred to as *universal design* and *design for all*. It addresses a broad range of issues including: + +* accessibility for people with disabilities; +* access to and quality of hardware, software, and Internet connectivity; +* computer literacy and skills; +* economic situation; +* education; +* geographic location; +* culture; +* age, including older and younger people; +* and language. + +### Accessibility and Usability {#accessible-usable} + +Accessibility primarily focuses on people with disabilities. Many accessibility requirements improve usability for everyone, especially in limiting situations. For example, providing sufficient contrast benefits people using the web on a mobile device in bright sunlight or in a dark room. Captions benefit people in noisy and in quiet environments. Some people have age-related functional limitations, and may not identify these as "disability". Accessibility addresses these situations too. + +Accessibility includes: + +- **Requirements that are technical and relate to the underlying code rather than to the visual appearance**. For example, they ensure that websites work well with assistive technologies. This includes screen readers that read aloud content, and screen magnifiers that enlarge content. Voice recognition software used to input text is another form of assistive technology. These aspects are typically not a focus of usability research and practice. +- **Requirements that relate to user interaction and visual design**. Inadequate design can cause significant barriers for people with disabilities. That is why they are included. For example, understandable instructions and feedback for website forms and applications is good usability. They also help people with cognitive and learning disabilities. Without such requirements, some people with disabilities may be excluded from using the Web. + +There is a significant overlap between accessibility and usability. [ISO 9241-11 {% include_cached external.html %}](https://www.iso.org/iso/catalogue_detail.htm?csnumber=16883), defines usability as: + +> The "extent to which a product can be used by specified users to achieve specified goals effectively, efficiently and with satisfaction in a specified context of use". + +This could address accessibility ***when***: + +* "specified users" includes people with a range of disabilities, and +* "specified context of use" includes accessibility considerations such as assistive technologies. + +But usability practice and research often does not consider the needs of people with disabilities. + +### Accessibility and Inclusion {#inclusive-design} + +Several accessibility requirements also benefit people and situations that are a focus of inclusive design. For example, [Web Accessibility +Benefits People With and *Without* Disabilities](https://www.w3.org/WAI/bcase/soc#groups) describes accessibility benefits for: + +- people with low literacy or not fluent in the language, +- people with low bandwidth connections or using older technologies, +- new and infrequent users, and, +- [mobile device users](/standards-guidelines/wcag-mobile-overlap/). + +However, accessibility focuses on disability and does not try to address broader issues. Other efforts, such as [internationalization](https://www.w3.org/International/), address other inclusion issues. Keeping accessibility focused on disabilities encourages research and development on the specific needs of people with disabilities, and solutions that are optimized for these specific needs. + +Accessible Design +----------------- + +There are [guidelines, standards, and techniques for web accessibility](/standards-guidelines/), such as the Web Content Accessibility Guidelines ([WCAG](/standards-guidelines/wcag/), which is the international standard [ISO/IEC 40500](https://www.w3.org/blog/2012/10/wcag-20-is-now-also-isoiec-405/). +Yet when designers, developers, and project managers approach accessibility as a checklist to meet these standards, the focus is only on the technical aspects of accessibility. As a result, the human interaction aspect is often lost, and accessibility is not achieved. + +Combining accessibility standards and usability processes with real people ensures that web design is technically and functionally usable by people with disabilities. This is referred to as *usable accessibility* or *accessible user experience (UX)*. + +### Usable Accessibility + +Web designers and developers can use usability processes, methods, and techniques, to address the user interface component of accessibility. +While the considerations of people with disabilities are not always included in common practices, they can be easily integrated into user experience design. + +A key aspect is incorporating **real people** in design: + +- Ensuring that everyone involved in web projects understands the basics of [how people with disabilities use the Web](/people-use-web/), +- [Involving users with disabilities](/planning/involving-users/) early and throughout the design process, and +- [Involving users in evaluating web accessibility](/test-evaluate/involving-users/). + +**Accessibility standards** also have an important role in accessible design. For example, understanding the basic [Accessibility Principles](/fundamentals/accessibility-principles/) and using them for developing and evaluating early prototypes helps the development team provide basic accessibility in the earliest stages. +Addressing accessibility at later stages becomes increasingly difficult. + +Also, usability processes and user involvement alone cannot address all accessibility issues. Even large projects cannot cover the diversity of disabilities, adaptive strategies, and assistive technologies. +Accessibility guidelines, standards, and techniques ensure that the wide range of issues are adequately covered. + +Conclusion +---------- + +Accessibility practitioners and researchers can incorporate usability techniques to improve 'usable accessibility'. User experience designers and researchers can incorporate accessibility to make their designs work better for more people in more situations. Addressing accessibility, usability, and inclusion together can more effectively lead to a more accessible, usable, and inclusive web for everyone. Resources to help are linked throughout this page. + +For more on this topic, see [The role of accessibility in a universal web {% include_cached external.html %}](https://dspace.mit.edu/handle/1721.1/88013), which: + +- provides a more in-depth exploration of the importance and benefits of accessibility as a distinct discipline, and +- encourages increased communication and coordination between accessibility, usability, and inclusion research and practice. + From b90c04610ad577f965f5a6cdd4c1aa242614a41a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Tue, 9 Apr 2024 16:41:09 +0200 Subject: [PATCH 09/20] Add GitHub label --- pages/fundamentals/accessibility-usability-inclusion.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/pages/fundamentals/accessibility-usability-inclusion.md b/pages/fundamentals/accessibility-usability-inclusion.md index 339a5984de7..b0de28ecad6 100644 --- a/pages/fundamentals/accessibility-usability-inclusion.md +++ b/pages/fundamentals/accessibility-usability-inclusion.md @@ -2,8 +2,9 @@ title: Accessibility, Usability, and Inclusion lang: en github: - repository: w3c/wai-website + repository: remibetin/wai-website path: 'pages/fundamentals/accessibility-usability-inclusion.md' + label: wai-inclusion permalink: /fundamentals/accessibility-usability-inclusion/ layout: default footer: > From 2729bbcf21389835d721f90ca56d724957b9a32b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Tue, 9 Apr 2024 16:42:27 +0200 Subject: [PATCH 10/20] Test new feedback box --- _config.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_config.yml b/_config.yml index d2e106962f3..0b2c7efe493 100755 --- a/_config.yml +++ b/_config.yml @@ -41,7 +41,7 @@ repository: w3c/wai-website ytkey: AIzaSyCiZ9uToWu9jb7BTx47NtzCvmGGXKXp8nI # remote_themes are an extension for Jekyll running in GitHub pages and are a GitHub repo -remote_theme: w3c/wai-website-theme +remote_theme: w3c/wai-website-theme@update-github-issue paginate: 5 paginate_path: "/news/:num/" From f1fdc53bf20df74d90d5460b73f57ea439ed0426 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Tue, 9 Apr 2024 16:52:04 +0200 Subject: [PATCH 11/20] Add lang --- pages/standards-guidelines/wai-intro-earl.md | 1 + pages/standards-guidelines/wai-shared-experiences.md | 1 + pages/standards-guidelines/wai-wcag-mob-overlap.md | 1 + pages/wai-customize-design.md | 1 + 4 files changed, 4 insertions(+) diff --git a/pages/standards-guidelines/wai-intro-earl.md b/pages/standards-guidelines/wai-intro-earl.md index 0160074402b..3e03a2b26cd 100644 --- a/pages/standards-guidelines/wai-intro-earl.md +++ b/pages/standards-guidelines/wai-intro-earl.md @@ -1,5 +1,6 @@ --- title: Evaluation and Report Language (EARL) Overview +lang: en permalink: /standards-guidelines/earl/ layout: default github: diff --git a/pages/standards-guidelines/wai-shared-experiences.md b/pages/standards-guidelines/wai-shared-experiences.md index 9843ed18115..6fe20ab99c3 100644 --- a/pages/standards-guidelines/wai-shared-experiences.md +++ b/pages/standards-guidelines/wai-shared-experiences.md @@ -1,6 +1,7 @@ --- title: "Shared Web Experiences: Barriers Common to Mobile Device Users and People with Disabilities" title_html: "Shared Web Experiences:
Barriers Common to Mobile Device Users and People with Disabilities" +lang: en permalink: /standards-guidelines/shared-experiences/ github: repository: w3c/wai-website diff --git a/pages/standards-guidelines/wai-wcag-mob-overlap.md b/pages/standards-guidelines/wai-wcag-mob-overlap.md index d97100d8efb..a3552cfb58b 100644 --- a/pages/standards-guidelines/wai-wcag-mob-overlap.md +++ b/pages/standards-guidelines/wai-wcag-mob-overlap.md @@ -1,6 +1,7 @@ --- title: "Web Content Accessibility and Mobile Web: Making a Website Accessible Both for People with Disabilities and for Mobile Devices" title_html: "Web Content Accessibility and Mobile Web:
Making a Website Accessible Both for People with Disabilities and for Mobile Devices" +lang: en permalink: /standards-guidelines/wcag-mobile-overlap/ layout: default github: diff --git a/pages/wai-customize-design.md b/pages/wai-customize-design.md index 156ec695777..35ccea46c60 100755 --- a/pages/wai-customize-design.md +++ b/pages/wai-customize-design.md @@ -1,5 +1,6 @@ --- title: How to Change Text Size or Colors +lang: en layout: default parent: "/" permalink: /meta/customize/ From 6f671799f957dcb8f226c8058c3f7d2be8229687 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Tue, 16 Apr 2024 17:02:00 +0200 Subject: [PATCH 12/20] Update README --- README.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 77333a50e31..b683a73de5e 100755 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ -# wai-website +# W3C WAI Website -Preview: https://wai-website.netlify.com/ -WAI Website Manual: https://wai-website-theme.netlify.com/overview/ +- Live Website: https://www.w3.org/WAI/ +- Preview: https://wai-website.netlify.com/ -[![Netlify Status](https://api.netlify.com/api/v1/badges/faaa4954-0194-47fa-9b74-540ab79f4a8d/deploy-status)](https://app.netlify.com/sites/wai-website/deploys) ![Create Downloadable Release](https://github.com/w3c/wai-website/workflows/Create%20Downloadable%20Release/badge.svg) +[![Netlify Status](https://api.netlify.com/api/v1/badges/faaa4954-0194-47fa-9b74-540ab79f4a8d/deploy-status)](https://app.netlify.com/sites/wai-website/deploys) From c4943692d3518b515d80a45ebf080a540b962efb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Tue, 16 Apr 2024 17:06:50 +0200 Subject: [PATCH 13/20] Automatically label issues --- .github/labeler.yml | 16 ++++++++++++++++ .github/workflows/label-issues.yml | 19 +++++++++++++++++++ 2 files changed, 35 insertions(+) create mode 100644 .github/labeler.yml create mode 100644 .github/workflows/label-issues.yml diff --git a/.github/labeler.yml b/.github/labeler.yml new file mode 100644 index 00000000000..2b35a036a2d --- /dev/null +++ b/.github/labeler.yml @@ -0,0 +1,16 @@ +pronunciation: + - 'wai-pronunciation' +tips: + - 'wai-tips' +customize-design: + - 'wai-customize-design' +shared-experiences: + - 'wai-shared-experiences' +intro-act: + - 'wai-intro-act' +intro-earl: + - 'wai-intro-earl' +combined-expertise: + - 'wai-combined-expertise' +inclusion: + - 'wai-inclusion' \ No newline at end of file diff --git a/.github/workflows/label-issues.yml b/.github/workflows/label-issues.yml new file mode 100644 index 00000000000..f22dd93e26d --- /dev/null +++ b/.github/workflows/label-issues.yml @@ -0,0 +1,19 @@ +name: "Issue Labeler" +on: + issues: + types: [opened, edited, reopened] + +permissions: + issues: write + contents: read + +jobs: + triage: + runs-on: ubuntu-latest + steps: + - uses: github/issue-labeler@v3.4 + with: + configuration-path: .github/labeler.yml + enable-versioned-regex: 0 + sync-labels: 1 + repo-token: ${{ github.token }} \ No newline at end of file From fd75164ce394c6f30f451c42fd6f8412d0ccfc9d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Tue, 16 Apr 2024 17:07:03 +0200 Subject: [PATCH 14/20] Add Issues forms --- .github/ISSUE_TEMPLATE/config.yml | 11 ++++++++++ .github/ISSUE_TEMPLATE/content-issue.yml | 26 ++++++++++++++++++++++++ 2 files changed, 37 insertions(+) create mode 100644 .github/ISSUE_TEMPLATE/config.yml create mode 100644 .github/ISSUE_TEMPLATE/content-issue.yml diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml new file mode 100644 index 00000000000..879d44d9052 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -0,0 +1,11 @@ +blank_issues_enabled: true +contact_links: + - name: Translations intents + url: https://github.com/w3c/wai-translations/issues/new/choose + about: Want to translate a WAI resource? Use this link to declare your intent. + - name: WCAG + url: https://github.com/w3c/wcag/issues/ + about: WCAG discussions take place in the repository hosting WCAG data. + - name: WCAG-EM Report Tool + url: https://github.com/w3c/wai-wcag-em-report-tool/issues/new/choose + about: Issues concerning the WCAG-EM Report Tool should be reported using this link. \ No newline at end of file diff --git a/.github/ISSUE_TEMPLATE/content-issue.yml b/.github/ISSUE_TEMPLATE/content-issue.yml new file mode 100644 index 00000000000..c02574e1bf8 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/content-issue.yml @@ -0,0 +1,26 @@ +name: "Content issue" +description: Report a problem with content on WAI website. +body: + - type: input + id: wai-url + attributes: + label: Resource URL + description: The link to the page this issue is about or, if it's about multiple pages, an example or most important page. + validations: + required: true + - type: textarea + id: description + attributes: + label: Add a description + validations: + required: true + - type: markdown + attributes: + value: | + --- + The following field is prefilled and should not be modified. Please click "Submit new issue". + - type: input + id: wai-id + attributes: + label: Resource Shortname + description: Set automatically. Do not modify. From 3a89cf2517716fbc03a6d718e0e6094a03ca46ec Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Tue, 16 Apr 2024 18:31:03 +0200 Subject: [PATCH 15/20] Remove wai-combined-expertise submodule --- _external/resources/wai-combined-expertise | 1 - 1 file changed, 1 deletion(-) delete mode 160000 _external/resources/wai-combined-expertise diff --git a/_external/resources/wai-combined-expertise b/_external/resources/wai-combined-expertise deleted file mode 160000 index ae18481d1ca..00000000000 --- a/_external/resources/wai-combined-expertise +++ /dev/null @@ -1 +0,0 @@ -Subproject commit ae18481d1ca9ea36ec41a916156f7f970c0dc045 From 9f48b5cc00114535bd94b6ed8ae78fc6b7323983 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 18 Apr 2024 14:54:14 +0200 Subject: [PATCH 16/20] Delete outdated symlink to aria-practices read-this-first include --- _includes/read-this-first.html | 1 - 1 file changed, 1 deletion(-) delete mode 120000 _includes/read-this-first.html diff --git a/_includes/read-this-first.html b/_includes/read-this-first.html deleted file mode 120000 index 4c55ebb97d1..00000000000 --- a/_includes/read-this-first.html +++ /dev/null @@ -1 +0,0 @@ -../_external/resources/wai-aria-practices/_includes/read-this-first.html \ No newline at end of file From 3d4b9e467a01f54942d41a9ba34977f3a5cf56b3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 18 Apr 2024 14:54:30 +0200 Subject: [PATCH 17/20] Update theme branch used --- _config.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_config.yml b/_config.yml index 0b2c7efe493..d16ad6ebb00 100755 --- a/_config.yml +++ b/_config.yml @@ -41,7 +41,7 @@ repository: w3c/wai-website ytkey: AIzaSyCiZ9uToWu9jb7BTx47NtzCvmGGXKXp8nI # remote_themes are an extension for Jekyll running in GitHub pages and are a GitHub repo -remote_theme: w3c/wai-website-theme@update-github-issue +remote_theme: w3c/wai-website-theme@update-feedback-box paginate: 5 paginate_path: "/news/:num/" From f31280c21ed4a61072ed9cc4fd69fb79d198c96d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 18 Apr 2024 15:49:02 +0200 Subject: [PATCH 18/20] Content-issue form: rename wai-id field into wai-resource-id --- .github/ISSUE_TEMPLATE/content-issue.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/ISSUE_TEMPLATE/content-issue.yml b/.github/ISSUE_TEMPLATE/content-issue.yml index c02574e1bf8..5336497c6e8 100644 --- a/.github/ISSUE_TEMPLATE/content-issue.yml +++ b/.github/ISSUE_TEMPLATE/content-issue.yml @@ -20,7 +20,7 @@ body: --- The following field is prefilled and should not be modified. Please click "Submit new issue". - type: input - id: wai-id + id: wai-resource-id attributes: label: Resource Shortname description: Set automatically. Do not modify. From 01d4e0f99356ca8685013a873355e1b53350db4c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 18 Apr 2024 15:52:21 +0200 Subject: [PATCH 19/20] Test new feedback box translationsg --- .gitmodules | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.gitmodules b/.gitmodules index 30f8aeb5012..c91231ea4d0 100755 --- a/.gitmodules +++ b/.gitmodules @@ -1,7 +1,7 @@ [submodule "_external/data"] path = _external/data url = https://github.com/w3c/wai-website-data.git - branch = master + branch = update-terms-feedback-box [submodule "_external/resources/wai-bcase"] path = _external/resources/wai-bcase url = https://github.com/w3c/wai-bcase.git From 8fee2ab8905be6b178f9b2d88889c0c603e4012d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 18 Apr 2024 16:09:42 +0200 Subject: [PATCH 20/20] Update labels --- .github/labeler.yml | 8 +++----- pages/standards-guidelines/wai-intro-act.md | 1 + pages/standards-guidelines/wai-intro-earl.md | 1 + pages/standards-guidelines/wai-shared-experiences.md | 1 + pages/standards-guidelines/wai-wcag-mob-overlap.md | 1 + pages/test-eval/wai-combined-expertise.md | 1 + pages/wai-customize-design.md | 1 + 7 files changed, 9 insertions(+), 5 deletions(-) diff --git a/.github/labeler.yml b/.github/labeler.yml index 2b35a036a2d..73e79ab45e3 100644 --- a/.github/labeler.yml +++ b/.github/labeler.yml @@ -1,7 +1,3 @@ -pronunciation: - - 'wai-pronunciation' -tips: - - 'wai-tips' customize-design: - 'wai-customize-design' shared-experiences: @@ -13,4 +9,6 @@ intro-earl: combined-expertise: - 'wai-combined-expertise' inclusion: - - 'wai-inclusion' \ No newline at end of file + - 'wai-inclusion' +wcag-mob-overlap: + - 'wai-wcag-mob-overlap' \ No newline at end of file diff --git a/pages/standards-guidelines/wai-intro-act.md b/pages/standards-guidelines/wai-intro-act.md index 24a4d144ae7..72a9bb77eee 100644 --- a/pages/standards-guidelines/wai-intro-act.md +++ b/pages/standards-guidelines/wai-intro-act.md @@ -5,6 +5,7 @@ lang: en github: repository: w3c/wai-website path: 'pages/standards-guidelines/wai-intro-act.md' + label: wai-intro-act feedbackmail: wai@w3.org footer: >

Date: Updated 30 October 2020.

diff --git a/pages/standards-guidelines/wai-intro-earl.md b/pages/standards-guidelines/wai-intro-earl.md index 3e03a2b26cd..7dd1c10dab8 100644 --- a/pages/standards-guidelines/wai-intro-earl.md +++ b/pages/standards-guidelines/wai-intro-earl.md @@ -6,6 +6,7 @@ layout: default github: repository: w3c/wai-website path: 'pages/standards-guidelines/wai-intro-earl.md' + label: wai-intro-earl feedbackmail: wai@w3.org footer: >

Date: Updated 3 July 2018. First published 23 July 2005.

diff --git a/pages/standards-guidelines/wai-shared-experiences.md b/pages/standards-guidelines/wai-shared-experiences.md index 6fe20ab99c3..82c4b63c828 100644 --- a/pages/standards-guidelines/wai-shared-experiences.md +++ b/pages/standards-guidelines/wai-shared-experiences.md @@ -6,6 +6,7 @@ permalink: /standards-guidelines/shared-experiences/ github: repository: w3c/wai-website path: 'pages/standards-guidelines/wai-shared-experiences.md' + label: wai-shared-experiences doc-note-type: archived doc-note-message: >

If you want current information on mobile accessibility — that is, people with disabilities using content on mobile devices, see https://www.w3.org/WAI/mobile/

diff --git a/pages/standards-guidelines/wai-wcag-mob-overlap.md b/pages/standards-guidelines/wai-wcag-mob-overlap.md index a3552cfb58b..58c0c4b4b53 100644 --- a/pages/standards-guidelines/wai-wcag-mob-overlap.md +++ b/pages/standards-guidelines/wai-wcag-mob-overlap.md @@ -7,6 +7,7 @@ layout: default github: repository: w3c/wai-website path: 'pages/standards-guidelines/wai-wcag-mob-overlap.md' + label: wai-wcag-mob-overlap doc-note-type: archived doc-note-message-md: > This page introduces how: diff --git a/pages/test-eval/wai-combined-expertise.md b/pages/test-eval/wai-combined-expertise.md index 6daf3214cc5..c6a1951e3d7 100644 --- a/pages/test-eval/wai-combined-expertise.md +++ b/pages/test-eval/wai-combined-expertise.md @@ -6,6 +6,7 @@ layout: default github: repository: w3c/wai-website path: 'pages/test-eval/wai-combined-expertise.md' + label: wai-combined-expertise footer: >

Date: Versions and links updated 21 March 2024. Substantive content updated 2002.

Editor: Judy Brewer.

diff --git a/pages/wai-customize-design.md b/pages/wai-customize-design.md index 35ccea46c60..be9fb1d0063 100755 --- a/pages/wai-customize-design.md +++ b/pages/wai-customize-design.md @@ -7,6 +7,7 @@ permalink: /meta/customize/ github: repository: w3c/wai-website path: 'pages/wai-customize-design.md' + label: wai-customize-design license: creative-commons feedbackmail: wai@w3.org footer: >