EDSE/EDIT 526: Web Accessibility and Design

Syllabus

Syllabus Contents

Note: The most up-to-date version is found at http://www.paulbohman.com/webaccessibility/526/2006fall/syllabus.htm.

Course Information

Semester: Fall 2006
Credit hours: 3.0

For the Classroom-Based Sections (EDIT/EDSE 5T1):

For the Web-Based Sections (EDIT/EDSE 5T2):

Instructor

Name: Paul R. Bohman
Phone: 703-933-4725
Email: (please use the form at http://www.paulbohman.com/contact/)
Office: Thompson 216, Fairfax Campus
Office hours:
Mondays 10:00am-12:00 (noon);
Wednesdays 2:00pm-4:00pm;
Thursdays 10:00am-12:00 (noon);
Or by appointment

Course Description

This 3-credit course will enable students to use Macromedia Dreamweaver and other Web development tools to design and develop a comprehensive web site in accordance with universal web design standards and web accessibility guidelines as defined in Section 508 of the Rehabilitation Act and the Web Content Accessibility Guidelines (WCAG) 1.0. Students will learn to evaluate and report on the accessibility of existing web content from the perspective of different disability types, using a user-centered, principle-based approach.

Student Outcomes

This course is designed to enable students to:

  1. Evaluate the accessibility of existing web content by:
  2. Create web content that is accessible to a broad range of users, including people with disabilities by:

Professional/Technical Standards Taught

This course teaches students to create standards-compliant web content using:

Course Web Site

Most of the course materials are located at www.paulbohman.com/webaccessibility/526/2006fall/. The exams will take place in a learning management system. You will receive details about this soon.

Readings

Software

Note: You do not necessarily need to buy any of the software listed below, but you will need access to it. All of the required software will be available in the classroom computer labs in Commerce I and Robinson A352. The lab in Robinson A352 usually has more public free-use time than Commerce I. Check with the lab schedules.

Semester Schedule

Tentative Schedule of Activities

Class

 Date Topic Assignment Due
1 Aug 28 Getting Started; User Customization of Web Content —
— Sep 4

UNIVERSITY HOLIDAY (NO CLASS)

—
2 Sep 11 Basic XHTML Part 1  
3 Sep 18 Basic XHTML Part 2 Assignment 1: Post two practice pages on your web site using FTP—an "about me" page and one other page (due Sunday night Sep 24 or earlier; 15 points)
4 Sep 25 Web Accessibility and Universal Design  
5 Oct 2 Dreamweaver Techniques —
— Oct 9 UNIVERSITY HOLIDAY (NO CLASS, class meets on Tuesday, Oct 10) —
6 Oct 10
Tuesday!		 Presentation and Style Using Cascading Style Sheets (CSS) —
7 Oct 16 Templates & Navigation  
8 Oct 23 Images and Illustrations Assignment 2: Online exam about XHTML and CSS (due Friday Oct 27 or earlier; 10 points)
9 Oct 30 Tables and Frames —
10 Nov 6 Forms, JavaScript, and Interaction —
11 Nov 13 Captions, Flash, and Multimedia —
12 Nov 20 PDF, Word, PowerPoint, and their Alternatives —
13 Nov 27 Lab Work: Prepare Final Project Assignment 3: Accessibility evaluation of a web site—group project (due Tuesday Nov 28 or earlier; 30 points)
14 Dec 4 LAST DAY OF CLASS—Lab Work: Prepare Final Project —
— Dec 11 READING DAY (No class)

Assignment 4: Final portfolio web site design with "conformance claim" worksheet (due Tuesday Dec 12 or earlier; 35 points)
— Dec 18 OFFICIAL "EXAM DAY" (no class and no final exam) Assignment 5: Online exam about accessibility principles and techniques (due Monday Dec 18 or earlier; 10 points)

Assignments

List of Assignments
Assignment Due by Points
Assignment 1: Post two practice pages on your web site using FTP—an "about me" page and one other page Sep 21 15
Assignment 2: Online exam about XHTML and CSS Oct 27 10
Assignment 3: Accessibility evaluation of a web site (group project) Nov 28 30
Assignment 4: Final portfolio web site design with "conformance claim" worksheet Dec 12 35
Assignment 5: Online exam about accessibility principles and techniques Dec 18 10
Total points   100

Note that you may turn in assignments or take exams early.

Assignment Details

Assignment 1: Post two practice pages on your web site using FTP—an "about me" page and one other page (15 points)

Part 1:

Create an "about me" XHTML page using a plain text editor—NOT using Dreamweaver's Design View (if you use Dreamweaver for this assignment you must use the Code view ONLY). Post this page on your portfolio web site using FTP (you may use Dreamweaver's FTP features). The requirements for this page are as follows:

  1. Create the following XHTML elements, at a minimum:
    1. XHTML 1.0 strict doctype declaration
    2. UTF-8 character set declaration
    3. <head>
    4. <title>
    5. <body>
    6. <h1>
    7. <p>
    8. <a> (a link to a web page)
    9. <img> (A photo of yourself with appropriate alt text, and other photos if you like)
  2. The following content:
    1. A little bit about you: what you enjoy doing, the things that make you interesting, your family, etc.
    2. Your current program of study at George Mason University, and how far along in the program you are
    3. Your educational background (previous degrees and/or coursework)
    4. A brief explanation of your past web design experience (before this class), including HTML, XHTML, CSS, graphics, etc. (There's no need to try to impress me here. Just be honest and tell me what you do or don't know.)
    5. A brief explanation of your knowledge about web accessibility before taking this class, and whether or not you have ever tried to make a web site accessible to people with disabilities.
  3. The page must pass as "valid XHTML 1.0 strict" according to the validator at http://validator.w3.org/

Part 2:

Create another page according to the following requirements:

  1. Create the following XHTML elements, at a minimum:
    1. XHTML 1.0 strict doctype declaration
    2. UTF-8 character set declaration
    3. <head>
    4. <title>
    5. <body>
    6. At least three headings of three different levels (e.g. <h1>, <h2>, <h3>)
    7. An image (<img>)with alt text
    8. A link (<a>) to your other web page
    9. A link (<a>) to another web site (e.g. George Mason's web site, or some other external web site)
    10. A link (<a>) to an email address
    11. A link (<a>) to a spot on the same page (an anchor <a> with a name and id)
    12. A bulleted (unordered <ul>) list
    13. A numbered (ordered <ol>) list
    14. A definition list (<dl>)
    15. A data table (<table>) with rows (<tr>), header cells (<th>), and data cells (<td>)
    16. A block quote (<blockquote>) used to quote somebody, not just for indenting purposes
    17. At least one word with emphasis (using the <em> element)
    18. At least one word with strong emphasis (using the <strong> element)
    19. An abbreviation (using the <abbr> element)
    20. An acronym (using the <acronym> element)
    21. A superscript (<sup>)
    22. A subscript (<sub>)
    23. A hidden comment (using <!-- and -->)
  2. The text content of the page can be anything you like
  3. The page must pass as "valid XHTML 1.0 strict" according to the validator at http://validator.w3.org/
Assignment 1 Grading Criteria
Credit Criteria
Full credit The student completed the assignment as directed (with all 6 criteria mentioned above) AND on time.
Partial credit The student did not finish the assignment, turned in the assignment late, or did not follow the instructions properly.
No credit The student did not turn in the assignment, or turned it in more than a week late.

Assignment 2: Online exam about XHTML and CSS; 10 points

This is an "open-book", open-note, open-internet exam, but it is not a collaborative exam. You must take it alone, without help from class members or any other people. You may take it at any time on or before the deadline. You must get an "A" on the exam (94% or higher), or else it does not count. If necessary, you may re-take the exam until you get an A.

Assignment 2 Grading Criteria
Credit Criteria
Full credit The student took the test on or before the deadline and received a grade of 94% or better.
Partial credit No partial credit is offered.
No credit The student did take the exam or did not receive a grade of 94% or better, even after re-takes.

Assignment 3: Accessibility Evaluation of a Web Site—Group project (30 points)

This is your chance to play the role of "web accessibility consultant" in a team setting. Here's the role-playing scenario: your team has been commissioned to evaluate the accessibility for an existing web site. The site's owners have hired you to find out what they need to do to make their web site comply with Section 508 (for compliance with United States regulations) and WCAG 1.0 Level 2 (for compliance with international regulations). Your team must produce a report (based in either XHTML or Word; I don't want a printed document) which commends the site owners for the things they have done right (list these things explicitly), and which clearly lists the things they need to fix. You must explain the steps they need to take to reach compliance with Section 508 and WCAG 1.0 Level 2. Try to be positive and encouraging, but firm in your recommendations. Include links in your report to relevant "how-to" tutorials on the web so that their developers have a clear set of instructions to follow. Organize your report with the following sections:

  1. Intro page or "cover sheet"
  2. Table of contents
  3. Executive summary
  4. Description of existing accessibility features
  5. Accessibility (Perceivability, Operability, Understandability, Robustness) of the site from the perspective of people with various types of disabilities. Include relevant references to all applicable guidelines in Section 508 and WCAG 1.0 in the context of the narrative and/or in a list at the end of each section. Disability types include:
    1. Visual disabilities, including:
      1. blindness
      2. low vision
      3. color-blindness
    2. Auditory disabilities: deafness
    3. Motor disabilities, including:
      1. inability to use a mouse
      2. diminished muscle control (spasms, imprecise and/or slow hand movements, etc.)
    4. Cognitive disabilities, including challenges with:
      1. Perception and Processing
      2. Memory
      3. Problem Solving
      4. Attention
    5. Seizure disorders: photoepilepsy
  6. An analysis of the accessibility of the template(s) used
  7. Specific types and instances of content (not in the templates) that need to be fixed (e.g. error messages that appear in the wrong place, tables without headers, etc.). Include the URLs of the specific pages needing to be fixed and instructions on how to fix them.
  8. Appendices, if applicable
Assignment 3 Grading Criteria
Credit Criteria
Full credit The group found all of the relevant accessibility features and/or errors using the criteria supplied by the instructor AND demonstrated an understanding of the potential barriers experienced by people with disabilities on that particular site AND turned in the assignment on time.
Partial credit The group missed some of the errors, demonstrated a partial or faulty understanding of potential accessibility barriers, or turned in the assignment late.
No credit The group did not turn in the assignment, or turned it in more than a week late.

Assignment 4: Final Portfolio Web Site Design with "conformance claim" worksheet (35 points)

This is the big individual assignment for the class. Everything you learn in this class will prepare you for this project. You should not leave this until the last minute, the last week, or even the last month. You should begin to think about and work on this project as soon as possible.

The following general principles will be used to judge all of the content:

The instructor will generally follow the same criteria for assessing the accessibility of your web site that students use in Assignment 3 to assess the accessibility of another web site.

On a technical level, the required elements are as follows:

  1. A navigation scheme that allows users to know where they are within the web site (make sure visual cues are present)
  2. Appropriate <title> elements on each page (each page should have a unique title)
  3. Markup that validates as XHTML 1.0 Strict
  4. Pages that pass WAVE 3.5 and CynthiaSays.com
  5. No broken links or missing pages
  6. Structural and semantic markup used where appropriate (headers, bulleted lists, etc.)
  7. At least one foreground image with appropriate alt text
  8. At least one "decorative" background image in CSS
  9. At least one image requiring a "long description"
  10. At least one unordered list
  11. At least one ordered list
  12. At least one simple data table with the scope attribute
  13. At least one complex data table using the id and headers method
  14. A form with at least one of each of the following elements:
    1. An <input> element with an appropriate <label>
    2. A set of checkboxes or radio buttons with appropriate <fieldset>, <legend>, and <label> elements
    3. A submit button
The conformance claim

The instructor will provide the students with a worksheet to document the accessibility features of their web site design.

Your site's content: A student portfolio

All students should use this class to develop a portfolio web site, which can be used to document progress toward their degrees or certificates. Portfolios are required for all Track 1 students, and can be beneficial to students in all of the tracks and programs as a way to showcase coursework and achievements for potential employers. Students whose programs do not require portfolios may receive permission to develop a different kind of web site—but permission must be granted by the instructor in advance. Students who already have portfolio web sites may use this class to redesign their web site in accordance with accessibility principles and standards.

Students will not be graded on the quality of the portfolio, per se. They will be graded on the accessibility and standards-compliance of the web site. Other courses (such as EDIT 601) deal more directly with the quality of the portfolio. (And yes, you can use the same portfolio web site for both classes.) For the purposes of this class, students may even use placeholder text (e.g. Lorem ipsum text) rather than real text in some areas of the site. For example, it can take quite a while to write high-quality "personal reflections" or "insights" for a good portfolio. Rather than spend the time doing that during this class, it would be better to spend the time focusing on web accessibility and standards-based design. Students can fill in the portfolio later with real examples of their work, thoughtful essays, and so on. For now, just focus on web accessibility and standards.

According to the syllabus for EDIT 601 (Instructional Design and Development Mid Program Portfolio), the portfolio web site should include the items in the list below.

The instructor will provide example portfolio students for students to use as a reference when designing their own sites.

Assignment 5 Grading Criteria
Credit Criteria
Full credit The web site meets accessibility standards in accordance with the criteria in Assignment 4 AND the web site contains all of the required technical elements AND the web site accomplishes its goal (i.e. it can serve as a student portfolio site) AND the student turned in the assignment on time.
Partial credit The student failed to meet accessibility criteria, or did not include all of the required technical elements, or did not create a site that meets its goal, or did not finish the web site.
No credit The student did not turn in the assignment, or turned it in more than a week late.

Assignment 5: Online exam about accessibility principles and techniques; 10 points

Similar to the first exam, this is an "open-book", open-note, open-internet exam, but it is not a collaborative exam. You must take it alone, without help from class members or any other people. You may take it at any time on or before the deadline. You must get an "A" on the exam (94% or higher), or else it does not count. If necessary, you may re-take the exam until you get an A.

Assignment 5 Grading Criteria
Credit Criteria
Full credit The student took the test on or before the deadline and received a grade of 94% or better.
Partial credit No partial credit is offered.
No credit The student did take the exam or did not receive a grade of 94% or better, even after re-takes.

Grades

Grading Scale
Points Grade
94-100 A
90-93 A-
87-89 B+
84-86 B
80-83 B-
70-79 C
69 or below F

CEHD Statement of Expectations

The College of Education and Human Development (CEHD) expects that all students abide by the following: