Penn State Homepage

Teaching and Learning with Technology

Creating Accessible Web Sites

Accessibility in ANGEL

Because the ANGEL Course Management System is a Web tool you may not have all the ability to manipulate accessibility features that you would in your own Web site. However, there are some steps you can take to make your ANGEL content more accessible.

Note: See the ANGEL Help Page "Ensure ANGEL Course Content is Accessible" for the most up-to-date information.

This Page

  1. Display Options
  2. HTML Editor
  3. Uploaded Files
  4. Quizzes

Display Options

  1. Users who use a screen reader or those with severe low vision may want to switch their display option to 508 mode. This puts ANGEL into a frames-free text-only mode and enlarges the text. See the ANGEL Help Page "Ensure ANGEL Course Content is Accessible" for more details.

  2. Color blind or users who need large font sizes may wish to view all their pages in an accessible theme. To change a theme, Login, go to Settings in the My Profile menu on the left then click on Personal Theme Selector. Some themes which have been developed for accessibility purposes include:

    1. Large Text - Default text size is set higher.
    2. Black and White - Uses black text with a white background for highest contrast.
    3. High Contrast - Reverses colors so that background is dark and the text is light. Needed for some low vision users.

    NOTE: Users can check "Always use this theme" to override custom themes from a course.

  3. If students find the text too small in ANGEL even with zooming, you can suggest switching from Internet Explorer to other browsers such as Firefox, Mozilla, Opera (Windows) or Safari (Mac OS X). These browsers tend to allow more text to be zoomed.

  4. If you use complex image maps, multimedia or scripts, you may want to develop them on an external Web site and link to them from within ANGEL.

Top of Page

HTML Editor

The ANGEL HTML editor can be used to add formatting to HTML pages. Some tools that will assist users with different accessibility issues are:

  1. Page titles should be formatted with the Heading 1 <H1> option in the Select Format menu. This helps users with screen readers quickly identify the page title.

  2. Main section headings should be formatted with the Heading 2 <H2> option in the Select Format menu. This helps users with screen readers quickly scan and name major sections of the page. Use the Heading 3 <H3> option for subsection headings.

  3. When inserting images, remember to fill in the Alternate Text field in the upload screen. This is the text that will be read aloud by a screen reader. See the HTML Editor: Insert an Image help topic for more details.

  4. Make sure color schemes have enough contrasts between light and dark. See the Web site Color Page for more details on color schemes.

  5. If you copy formatted text from Microsoft Word, use the Clean HTML Content tool (eraser icon) to clean the Word HTML code, then reformat the page.

  6. You can switch to View Source if you wish to hand-edit HTML code for accessibility.

Top of Page

Uploaded Files

All files uploaded into ANGEL should be made accessible. Accessibility accommodations include:

  1. Extended text descriptions for images critical to course content. Remember that you cannot edit an ALT tag in ANGEL; so the description must be available in the text.

  2. Text transcripts for any audio used. Videos should be captioned or include a text transcript.

  3. Uploaded Word files, PowerPoint files (especially with images) or PDF files should have accessibility incorporated into them.

Top of Page

Quizzes

  1. When writing multiple choice questions in ANGEL, select the format of "Multiple Choice" (choices listed with radio buttons option) instead of the "Matching Option" (drop-down menu). Drop down menus present more accessibility issues for users with mobility impairment, screen readers or certain cognitive disabilities.

    Multiple Choice versus Matching in ANGEL

    Matching Format - Answers in Dropdown

    screen capture-dropdown

    Multiple Choice Format - Answers listed with radio button

    screen capture-radio buttons

    Both examples ask how Spanish /ñ/ differs from English /n/ in articulation and provide a list of anatomical terms. The answer is that the tongue body makes contact with the alveolar ridge for English /n/, but with the palate for Spanish /ñ/.

     

  2. Add text description for all uploaded images. For instance, if you upload an image for a quiz, include a brief description within the text for the quiz question. For example

    Sample ANGEL Quiz Question
    with description of image

    Q: Identify the saturated fat below. The fat chain has 18 carbon atoms in it.

    saturated fat molecule

         

    NOTE: This description is also useful for students who cannot see an image attachment or image file online for technical reasons.

  3. Students with learning or physical disabilities may not be able to complete timed quizzes within the given time frame. If these students are registered with the Penn State Office of Disability Services, they are permitted to request accommodation for timed quizzes and assignments.

Top of Page

Site Menu: Home Page/Main Menu | Section 508 Guidelines | Quick Checklist | Details by Tag
| Links | I.T.S. Seminar Page | Sitemap


©1999-2006 Pennsylvania State University.

This Web page is hosted by (by Teaching and Learning with Technology, a unit of Information Technology Services. Please contact the Webmaster if you have any questions.

Last Update: Monday, 24-Mar-2008 12:41:19 EDT