From Dokeos

Accessibility

Introduction

The purpose of this work is to allow the visible part of Dokeos to become accessible. For this purpose we took 3 actions:

• Modification of the HTML generated by PHP pages at several places.
• Creation of a structured editor allowing only to integrate a text, an image and a link in an article instead of a WYSIWIG editor.
• Modification of the quickForm code in order to bring in the valid forms.

Modification of the HTML

From the beginning the HTML of Dokeos was already fine. It would just be necessary to add on the elements allowing the “accessibility”. The most important element to add is the “avoiding menu” in order for the persons who linearly go through the page to be able to jump directly towards the menu or towards the content of the page. This menu is not visible if the CSS are activated. It is also needed to put an id on the menu and on the content to make them clearly identified.

Illustration 1: standard editor

Illustration 2:accessible editor

Editor

Those two pictures show the edition of a page or article. On the first picture, the accessibility mode is deactivated while it is activated on the second one.

The methods used to manipulate the forms are in the WCAG_rendering.php file. A special quickform component exists and gives the possibility to create a link towards an image. It is located in « image.php » and is defined in « FormValidator.class.php ».

line 58 :

// added for accessibility
$this->registerElementType('image', $dir.'Element/image.php', 'HTML_QuickForm_image');

Modification of the quickForm code

By default, quickform does not allow to generate forms adapted to the accessibility standards. We therefore modified them so that they are now adapted.

Goals

At present, a form looks like this:

Identifiant<br />
<input size="15" name="login" type="text" />

We would like to get this:

<label for="login">Identifiant</label> <br />
<input id="login" size="15" name="login" type="text" />

Modifications

input.php : to put an id on all fields; at the same time we give a name to the field, we set an ID. We thus modify the setName($name) method at line 89.

function setName($name)
{


  $this->updateAttributes(array('name'=>$name));

  // added for accessibilty

  $this->updateAttributes(array('id'=>$name));

}


Default.php : We just replace the token '{id}' by the field's name, this token is defined in the file index.php which is located in “home” at line 425 :

$element_template = '<!-- BEGIN required --><span class="form_required">*</span> <!-- END required --><label for="{id}">{label}</label><br />

default.php ligne 245 :

$html = str_replace('{id}', $name, $html);