Moodle

Course AJAX has very poor accessibility - ALT text,

Details

  • Type: Sub-task Sub-task
  • Status: Closed Closed
  • Priority: Major Major
  • Resolution: Fixed
  • Affects Version/s: 1.8, 1.9, 2.0
  • Fix Version/s: 1.9, 2.0
  • Component/s: Accessibility, AJAX, Course
  • Labels:
    None
  • Affected Branches:
    MOODLE_18_STABLE, MOODLE_19_STABLE, MOODLE_20_STABLE
  • Fixed Branches:
    MOODLE_19_STABLE, MOODLE_20_STABLE

Description

A lot of very basic accessibility and usability errors - developers may assume that users of assistive technology would have the "AJAX and Javascript" user profile setting set to "no", but users may not know about this "advanced" setting, and in any case their seems to have been lazy development.

Was this a Google Summer of Code project? - these ad hoc developers need to gain basic accessibility awareness, and their work needs serious code review (http://docs.moodle.org/en/Student_projects/AJAX_course_format).

Problems include ('buttons' here means an image and container with a Javascript event):
1. A bug in lib/ajax/ajaxcourse.js main_class.prototype.mk_button function - the second FOR loop should test "c<imgAttributes.length" NOT "c<attributes.length" (nothing to do with accessibility),
2. None of the buttons created in section_classes.js or block_classes.js have ALT text. Some have a TITLE, but this is inconsistent.
3. Where possible the ALT text needs to be specific - for example "Move section N". (the container TITLE can be just "Move" - awkward for IE).
4. The ALT text for the show/hide buttons should toggle between "Show ..." and "Hide ..."
5. I think the Javascript is removing the images from the non-AJAX course format buttons, but keeping the links - BAD - the whole link needs removing.
6. For the buttons, the container is sometimes an 'a' anchor, sometimes a DIV - need consistency - should it be an <input type="image" .../> ?

The attached patch address items 1-4 (do 5 separately). A new parameter 'text' is added to the main_class.prototype.mk_button method. Tested in Firefox and IE 6.

I'd like to get quick feedback, then commit to HEAD and 1.9 branches.

Activity

Hide
Nick Freear added a comment -

The patch affects 5 files:
-lang/en_utf8/moodle.php - 2 new strings, 'hidesection', 'movesection'.
-lib/ajax/ajaxcourse.js - modifies mk_button method (minor edit to main_class.prototype.getString).
-lib/ajax/ajaxlib.js - use more language strings.
-lib/ajax/block_classes.js
-lib/ajax/section_classes.js

Show
Nick Freear added a comment - The patch affects 5 files: -lang/en_utf8/moodle.php - 2 new strings, 'hidesection', 'movesection'. -lib/ajax/ajaxcourse.js - modifies mk_button method (minor edit to main_class.prototype.getString). -lib/ajax/ajaxlib.js - use more language strings. -lib/ajax/block_classes.js -lib/ajax/section_classes.js
Hide
Nick Freear added a comment -

I've committed the one-line fix for item 1 above to HEAD, 1.9 and 1.8 branches, tagged MERGED. I'm about to commit the rest to HEAD.

Martin, can I merge these changes to 1.9 branch? thanks Nick

Show
Nick Freear added a comment - I've committed the one-line fix for item 1 above to HEAD, 1.9 and 1.8 branches, tagged MERGED. I'm about to commit the rest to HEAD. Martin, can I merge these changes to 1.9 branch? thanks Nick
Hide
Martin Dougiamas added a comment -

Great, thanks! Definitely OK to commit to HEAD any time.

Porting to 1.9 needs to be done carefully - remember that HEAD is now tableless and being tested that way ... 1.9 still currently uses tables.

Show
Martin Dougiamas added a comment - Great, thanks! Definitely OK to commit to HEAD any time. Porting to 1.9 needs to be done carefully - remember that HEAD is now tableless and being tested that way ... 1.9 still currently uses tables.
Hide
Nick Freear added a comment - - edited

Thanks. Understood - I'm being careful!
I have tested on 1.9 branch and HEAD, in IE 6, IE 7, Firefox (Opera and Safari - course AJAX doesn't work) with help from a colleague, and I'm happy that the weeks and topics course pages look and work the same as before, with AJAX enabled (or not).

I have added a hack to fix Internet Explorer tooltips to use the image TITLE, not the ALT attribute (the ALT text is unnecessarily specific for sighted users - eg. "Hide section 1").

(Note, item 5 in the original bug report is not and issue - I hadn't updated section_classes.js for Ann's patch, MDL-9306.)

Everything now committed to HEAD and 1.9 branch, tagged merged.

Show
Nick Freear added a comment - - edited Thanks. Understood - I'm being careful! I have tested on 1.9 branch and HEAD, in IE 6, IE 7, Firefox (Opera and Safari - course AJAX doesn't work) with help from a colleague, and I'm happy that the weeks and topics course pages look and work the same as before, with AJAX enabled (or not). I have added a hack to fix Internet Explorer tooltips to use the image TITLE, not the ALT attribute (the ALT text is unnecessarily specific for sighted users - eg. "Hide section 1"). (Note, item 5 in the original bug report is not and issue - I hadn't updated section_classes.js for Ann's patch, MDL-9306.) Everything now committed to HEAD and 1.9 branch, tagged merged.
Hide
Nick Freear added a comment -

(OU Bug # 4186.)

Show
Nick Freear added a comment - (OU Bug # 4186.)

People

Vote (0)
Watch (1)

Dates

  • Created:
    Updated:
    Resolved: