660960 - Make Enter bug page compliant with WAI

Status: NEW

(Bugzilla :: User Interface, enhancement)

Description

[Francisco Donalisio]

We should change the enter bug page to make it complaint with W3C Web Accessibility Initiative.

Comment 1

[Francisco Donalisio]

Attachment: Remove WCAG 2.0 violations in the enter bug pages

Implements the W3C accessibility techniques:
-Using the title attribute to identify form controls when the label element cannot be used http://www.w3.org/TR/WCAG20-TECHS/H65.html
- Separating information and structure from presentation to enable different presentations - http://www.w3.org/TR/WCAG20-TECHS/G140.html
-Failure of Success Criterion 1.3.1 and 4.1.2 due to the association of label and user interface controls not being programmatically determinable http://www.w3.org/TR/WCAG20-TECHS/F68.html

Comment 2

[Tiago Mello [:timello]]

Comment on attachment 536400 [details] [diff] [review]
Remove WCAG 2.0 violations in the enter bug pages

Review of attachment 536400 [details] [diff] [review]:
-----------------------------------------------------------------

::: template/en/default/attachment/createformcontents.html.tmpl
@@ +71,4 @@
>             name="contenttypemethod" value="list">
>        <label for="list">select from list</label>:
>        <select name="contenttypeselection" id="contenttypeselection"
> +              title="Content type list"

'Select a content type from the list'.

I think the title should really explain what the field is for.

@@ +79,4 @@
>                   name="contenttypemethod" value="manual">
>        <label for="manual">enter manually</label>:
>        <input type="text" name="contenttypeentry" id="contenttypeentry"
> +             title="Content type manually "size="30" maxlength="200"

Maybe, 'Enter the content type manually'.

::: template/en/default/bug/create/create.html.tmpl
@@ +559,4 @@
>    [% END %]
>  
>    <tr>
> +    <th><label for="comment">Description:<label></th>

Nit: you should be closing </label>

::: template/en/default/global/choose-classification.html.tmpl
@@ +53,4 @@
>      </th>
>  
>      [% IF class.description %]
> +      <td>&nbsp;[% class.description FILTER html_light %]</td>

Shouldn't it still be vertical align: top?

Comment 3

[Francisco Donalisio]

Attachment: Remove WCAG 2.0 violations in the enter bug pages

Comment 4

[Frédéric Buclin]

timello: could you review this patch, please?

Comment 5

[Gervase Markham [:gerv]]

Comment on attachment 552473 [details] [diff] [review]
Remove WCAG 2.0 violations in the enter bug pages

>+    vertical-align: text-top;

What's the browser support like for this CSS construct?

>       <select name="contenttypeselection" id="contenttypeselection"
>+              title='Select a content type from the list'
>               onchange="this.form.contenttypemethod[1].checked = true;">

Nit: be consistent about choice of quotes. We seem to be using " here, not '.

>-             size="30" maxlength="200"
>+             title="Enter the content type manually "size="30" maxlength="200"

You are missing a closing quote.

Gerv

Comment 6

[Tiago Mello [:timello]]

Since francsd is no longer able work on this bug, I'm assigning it to Leonidas.

Comment 7

[Leonidas S. Barbosa]

Attachment: Patch to review

timello: could you review this patch, please?

Comment 8

[Frédéric Buclin]

Comment on attachment 632751 [details] [diff] [review]
Patch to review

If you want your patch to be reviewed, you have to set the review flag accordingly. :)

Comment 9

[Frédéric Buclin]

Comment on attachment 632751 [details] [diff] [review]
Patch to review

>=== modified file 'template/en/default/global/common-links.html.tmpl'

>-    <input type="hidden" id="no_redirect" name="no_redirect" value="0">
>+    <input type="hidden" id="no_redirect[% qs_suffix FILTER html %]" 
>+           name="no_redirect[% qs_suffix FILTER html %]" value="0">
>     <script type="text/javascript">
>       if (history && history.replaceState) {
>-        var no_redirect = document.getElementById("no_redirect");
>+        var no_redirect = document.getElementById("no_redirect[% qs_suffix %]");

Note that these changes have already been made in a separate bug, see attachment 649812 [details] [diff] [review]. The "name" attribute must not be renamed, though.



>-    <input class="txt" type="text" id="quicksearch[% qs_suffix FILTER html %]" name="quicksearch" 
>+    <input class="txt" type="text" [% 'role="search"' IF qs_suffix == "_top" %]  
>+           id="quicksearch[% qs_suffix FILTER html %]" 
>+           name="quicksearch[% qs_suffix FILTER html %]" 

Here too, the "name" attribute must not be renamed.


Otherwise your patch looks good. Could you update it to fix the few problems mentioned here, please? :)

Comment 10

[Frédéric Buclin]

Too late for 4.4.