Review of Viewing Interface (preview)

General

• There seems to be reasonable use of html5 structural element (section, article, header, etc).
• Within the <article>
  • OER title is <h1>,
  • "headings" are <h2>,
  • "subheadings" are <h3>.

• Bold, underline and italic are accomplished using <b>, <u> and <i>.

• The Universal Subtitles widget is inserting a <style> element into the widget markup.

• Image and video labels are nicely associated using <figure> and <figcaption> elements.
• Image have no alt text.

• <figcaption> uses <strong> for file name in caption - it probably shouldn't (meant for importance); the <strong> element has custom styles in the CSS.

• Inside the Table of Contents, subheading lists are not defined inside the <li> of the related header.
  i.e. current:

  Code Block
  html html
  <li>Heading</li> <ul> <li>sub heading</li> </ul> <li>Heading</li>

  recommended:

  Code Block
  html html
  <li>Heading <ul> <li>sub heading</li> </ul> </li> <li>Heading</li>

Keyboard access

• When tabbing around, there is no visual indication of focus.
• The ToC is tabbable.
• In Firefox, tab focus gets stuck inside first video player (ok in IE9, Chrome).

Review of Authoring Interface

General

• All of the authoring steps (write, describe, submit) are present in the DOM at the same time, visually positioned in a horizontal arrangement: "future" steps are positioned to the right of the current step, "previous" steps to the left. This causes issues with keyboard navigation: all controls are on the page, so tabbing moves through all of them.

...

• Buttons are links (<a>) with background images, with no associated text in some cases.

• In FF, Chrome, IE9, The "next step" button at bottom of first page is positioned below bottom of window, with no scroll bars. If you tab to it, page moves up, toolbar no longer visible.

• On the 'describe' page, if page made more narrow, the controls rearrange more vertically, : some controls drop below the fold, but no scrollbars appear. If you tab to it, page moves up, toolbar no longer visible.

• on On the 'publish' page, if page made too narrow, controls slide over top of 'current license' box (buttons also drop too low, with no scrollbar).

Keyboard

...

access

• buttons keyboard-accessible, but no visual feedback of focus
• buttons not activatable using "space bar"
• text style drop-down not usable with keyboard (no way to choose a style - nothing happens)
• on the 'describe' page, the keyword "buttons" are not keyboard accessible, so you can't read them or delete them
• can't edit OER title using keyboard
• can't tab to table of contents at all
• in FF, can't tab to table of contents or edit area
• in Chrome, can tab to content, and to some content within the content (table controls)
• in IE9, can tab to content, and to some content within the content (table controls, video controls)
• 'escape' key does not dismiss popups (e.g. link dialog, footnote dialog)

...