COAP:COAP-2170/week6: Difference between revisions
Jump to navigation
Jump to search
m (→Wednesday) |
m (→Wednesday) |
||
| (31 intermediate revisions by the same user not shown) | |||
| Line 8: | Line 8: | ||
=== Monday === | === Monday === | ||
; Introduction ( | (Use IE for Windows format or download the video first) | ||
* [http://webaim.org/intro/video Keeping Web Accessibility in Mind] ( | |||
; Introduction (Videos and PPT) | |||
* [http:// | * [http://webaim.org/intro/index#video Keeping Web Accessibility in Mind] (Two Videos, part of the intro at webaim.org) | ||
* [http://doit-prod.s.uw.edu/doit/videos/index.php?vid=33 Surfing the Web With a Screen Reader] (Downloadable Windows format, 20 min. AccessIT Video, start a min 4) | |||
* [http://ucpl.cornell.edu/Web_Accessibility_Trerise.ppt PPT slides] from Sharon Trerise, Cornell | * [http://ucpl.cornell.edu/Web_Accessibility_Trerise.ppt PPT slides] from Sharon Trerise, Cornell | ||
* JAWS demo | * JAWS demo | ||
* [http://uiaccess.com/accessucd/design.html Accessibility in User-Centered Design] (online book chapter) | |||
; | ; Administration | ||
* | * Homework 5 questions (if any) | ||
* | * Mid-Term: Grade average was high (worst grade: B), some doubts about usability testing vs. user surveys | ||
; Principles and players | ; Principles and players | ||
* The "players": W3C, US gov, some other national programs, corporate (e.g. Microsoft), some universities | * The "players": W3C, US gov, some other national programs, corporate (e.g. Microsoft), some universities | ||
=== Checklists and tools === | |||
(for both Monday and Wednesday lessons) | |||
Some important checklists: | Some important checklists: | ||
| Line 32: | Line 35: | ||
* visual, motor, auditory, seizures, cognitive | * visual, motor, auditory, seizures, cognitive | ||
; On-line accessibility testing | ; On-line accessibility testing ('''''pick one of these for your homework or get another tool .... ''''') | ||
* [http://www. | * [http://www.508checker.com/ 508 Checker] | ||
* [http:// | * [http://accesslint.com/ AccessLint] (provides a short report in English sentences) | ||
* [http:// | * [http://www.tawdis.net/ingles.html?lang=en TAW3 online] checks WCAG 2.0 compliance at all levels. Will provide a written report (English only for some levels) | ||
* [http://www.cynthiasays.com/ Cynthia says] | * [http://wave.webaim.org/ WebAim] On-line service. (See also the recommended Firefox extension, below) | ||
* [http://valet.webthing.com/access/url.html Valet] on-line accessibility check/demonstrator. Provides a short report (select "listed") | |||
* [http://www.cynthiasays.com/ Cynthia says] (all-in-one service) | |||
* [http://uitest.com/en/check/ UITest.com]. This is an all-in-one service for accessibility, validity and miscellaneous. Enter a URL and the do checking using various other services. | * [http://uitest.com/en/check/ UITest.com]. This is an all-in-one service for accessibility, validity and miscellaneous. Enter a URL and the do checking using various other services. | ||
See [http://webaim.org/articles/tools/ Accessibility Evaluation Tools] at WebAIM and [http://www.w3.org/WAI/ER/tools/complete Complete List of Web Accessibility Evaluation Tools] at W3C for larger | See [http://webaim.org/articles/tools/ Accessibility Evaluation Tools] for tips on how to choose a tool at WebAIM and [http://www.w3.org/WAI/ER/tools/complete Complete List of Web Accessibility Evaluation Tools] at W3C for a larger list of tools. | ||
; Designers' web browser extensions (some are alternatives to online tools) | ; Designers' web browser extensions (some are alternatives to online tools) | ||
* [http://wave.webaim.org/toolbar | * [http://wave.webaim.org/toolbar WebAim Browser extension] for Firefox and Chrome '''Recommended'''. Click on "Icons key" for explanations of icons and problems encountered. As of Feb 2015, the Chrome version is interactive (much better). | ||
* [https://addons.mozilla.org/en-US/firefox/addon/wcag-contrast-checker/ WCAG Contrast checker] | * [https://addons.mozilla.org/en-US/firefox/addon/wcag-contrast-checker/ WCAG Contrast checker] | ||
* [https://addons.mozilla.org/en-US/firefox/addon/fangs-screen-reader-emulator/ Fangs Screen Reader Emulator], Firefox 2.0 -4.0 extension. | * [https://addons.mozilla.org/en-US/firefox/addon/fangs-screen-reader-emulator/ Fangs Screen Reader Emulator], Firefox 2.0 -4.0 extension. | ||
* [http://www.deque.com/products/fireeyes/ FireEye] from Deque. Interfaces with a web service for which registration is required. | |||
; Assistive technology for browsers | ; Assistive technology for browsers | ||
* See [[web accessibility]] (no need to install assistive technology for this lesson) | * See [[web accessibility]] (no need to install assistive technology for this lesson) | ||
; Web developer tools: F12 on most browsers or right-click->inspect element | |||
* allow to manipulate CSS etc. | |||
; Additional web developer tools, allow for example to disable CSS | |||
* [http://chrispederick.com/work/web-developer/ Home page/download] | |||
=== Wednesday === | === Wednesday === | ||
; Administration | ; Administration | ||
* Term project | * Term project: Each student '''must''' post her/his idea for a term project in the world classroom. A few sentences are enough. This activity is not directly graded, but non-participation will affect grade for term project. '''Deadline''': Friday week 6 midnight. | ||
* | * [[COAP:COAP-2170/term project|term project]] details | ||
* Homework 4 feedback ( | * Homework 4 feedback (maybe) | ||
; Classroom activity | ; Classroom activity | ||
Evaluate a website according to some WCAG (Web Content Accessibility Guidelines) principles. Pick '''one''' | Evaluate a website according to some WCAG (Web Content Accessibility Guidelines) principles. Pick '''one'''. You may use an online validation service for generating the initial report. | ||
(1) [http://www.w3.org/WAI/WCAG20/quickref/ WCAG 2.0] is today's most important standard | (1) [http://www.w3.org/WAI/WCAG20/quickref/ WCAG 2.0] is today's most important standard | ||
| Line 77: | Line 92: | ||
(3) US government - section 508 for government websites | (3) US government - section 508 for government websites | ||
* [http://webaim.org/standards/508/checklist WebAIM's Section 508 Checklist] ([http://webaim.org/standards/508/508checklist.pdf PDF version]) | * [http://webaim.org/standards/508/checklist WebAIM's Section 508 Checklist] ([http://webaim.org/standards/508/508checklist.pdf PDF version]) | ||
(4) Special color filtering | |||
* http://colorfilter.wickline.org/ | |||
* [http://gmazzocato.altervista.org/colorwheel/wheel.php Accessibility color wheel] by Giacomo Mazzocato | |||
* [http://contrast-finder.tanaguru.com/ Contrast-Finder] | |||
(5) Simplifying add-ons | |||
* https://addons.mozilla.org/en-US/firefox/addon/reader/ | |||
Tips: | |||
* Use an on-line service (see Monday) to help you with this task. | * Use an on-line service (see Monday) to help you with this task. | ||
| Line 82: | Line 107: | ||
=== Homework 6 === | === Homework 6 === | ||
Produce an accessibility review of a website of your choice. I suggest using one of the Webster web sites. | |||
You should at least evaluate the '''home page plus two other pages''' (groups do 6 pages or compare 2 websites). | |||
* Use a recognized evaluation grid or tool (e.g. the checklist used in the classroom activity or results produced from a service that checks for WCAG 1 or WCAC 2). I suggest starting with the [http://wave.webaim.org/toolbar recommended Wave Firefox extension], but it's your choice. | |||
* Doing an analysis at "A" level (i.e. strongly required items) is ok. I don't require analysis at AA or AAA level .... | |||
* Produce a report (you can copy/paste evaluation forms and/or reports from online or other evaluation software). | |||
* Structure of the report: Introduction, findings, conclusion. Findings may include cut/paste data. | |||
* Group work ok: 2 persons max/group, but analyze 6 pages or compare 2 websites. | |||
Due: Wednesday week 7 before class. | |||
Latest revision as of 09:54, 18 February 2015
COAP 2170 Week 6 program
Topic: Accessibility
Monday
(Use IE for Windows format or download the video first)
- Introduction (Videos and PPT)
- Keeping Web Accessibility in Mind (Two Videos, part of the intro at webaim.org)
- Surfing the Web With a Screen Reader (Downloadable Windows format, 20 min. AccessIT Video, start a min 4)
- PPT slides from Sharon Trerise, Cornell
- JAWS demo
- Accessibility in User-Centered Design (online book chapter)
- Administration
- Homework 5 questions (if any)
- Mid-Term: Grade average was high (worst grade: B), some doubts about usability testing vs. user surveys
- Principles and players
- The "players": W3C, US gov, some other national programs, corporate (e.g. Microsoft), some universities
Checklists and tools
(for both Monday and Wednesday lessons)
Some important checklists:
- WCAG 2.0 at a glance
- WCAG "quick" ref (official)
- WebAIM's WCAG 2.0 Checklist (A PDF version) .... this is more understandable
- WebAIM's Section 508 Checklist for the Section 508 Standards Guide
- Categories of users
- visual, motor, auditory, seizures, cognitive
- On-line accessibility testing (pick one of these for your homework or get another tool .... )
- AccessLint (provides a short report in English sentences)
- TAW3 online checks WCAG 2.0 compliance at all levels. Will provide a written report (English only for some levels)
- WebAim On-line service. (See also the recommended Firefox extension, below)
- Valet on-line accessibility check/demonstrator. Provides a short report (select "listed")
- Cynthia says (all-in-one service)
- UITest.com. This is an all-in-one service for accessibility, validity and miscellaneous. Enter a URL and the do checking using various other services.
See Accessibility Evaluation Tools for tips on how to choose a tool at WebAIM and Complete List of Web Accessibility Evaluation Tools at W3C for a larger list of tools.
- Designers' web browser extensions (some are alternatives to online tools)
- WebAim Browser extension for Firefox and Chrome Recommended. Click on "Icons key" for explanations of icons and problems encountered. As of Feb 2015, the Chrome version is interactive (much better).
- Fangs Screen Reader Emulator, Firefox 2.0 -4.0 extension.
- FireEye from Deque. Interfaces with a web service for which registration is required.
- Assistive technology for browsers
- See web accessibility (no need to install assistive technology for this lesson)
- Web developer tools
- F12 on most browsers or right-click->inspect element
- allow to manipulate CSS etc.
- Additional web developer tools, allow for example to disable CSS
Wednesday
- Administration
- Term project: Each student must post her/his idea for a term project in the world classroom. A few sentences are enough. This activity is not directly graded, but non-participation will affect grade for term project. Deadline: Friday week 6 midnight.
- term project details
- Homework 4 feedback (maybe)
- Classroom activity
Evaluate a website according to some WCAG (Web Content Accessibility Guidelines) principles. Pick one. You may use an online validation service for generating the initial report.
(1) WCAG 2.0 is today's most important standard
- WCAG 2.0 Checklist (HTML version)
- WCAG 2.0 Checklist (PDF version)
(2) Older W3C version focusing on content:
(3) US government - section 508 for government websites
(4) Special color filtering
- http://colorfilter.wickline.org/
- Accessibility color wheel by Giacomo Mazzocato
- Contrast-Finder
(5) Simplifying add-ons
Tips:
- Use an on-line service (see Monday) to help you with this task.
- You can work in teams of two if you like
Homework 6
Produce an accessibility review of a website of your choice. I suggest using one of the Webster web sites. You should at least evaluate the home page plus two other pages (groups do 6 pages or compare 2 websites).
- Use a recognized evaluation grid or tool (e.g. the checklist used in the classroom activity or results produced from a service that checks for WCAG 1 or WCAC 2). I suggest starting with the recommended Wave Firefox extension, but it's your choice.
- Doing an analysis at "A" level (i.e. strongly required items) is ok. I don't require analysis at AA or AAA level ....
- Produce a report (you can copy/paste evaluation forms and/or reports from online or other evaluation software).
- Structure of the report: Introduction, findings, conclusion. Findings may include cut/paste data.
- Group work ok: 2 persons max/group, but analyze 6 pages or compare 2 websites.
Due: Wednesday week 7 before class.