Last Comment Bug 635940 - Make Describe Components page compliant with WAI
: Make Describe Components page compliant with WAI
Status: RESOLVED FIXED
:
Product: Bugzilla
Classification: Server Software
Component: User Interface (show other bugs)
: unspecified
: All All
: -- enhancement (vote)
: Bugzilla 4.2
Assigned To: Francisco Donalisio
: default-qa
Mentors:
Depends on: 635764
Blocks: bz-WAI 640579
  Show dependency treegraph
 
Reported: 2011-02-22 11:06 PST by Francisco Donalisio
Modified: 2011-04-12 10:52 PDT (History)
4 users (show)
LpSolit: approval+
See Also:
QA Whiteboard:
Iteration: ---
Points: ---


Attachments
Remove WCAG 2.0 violations in the describe components page (2.31 KB, patch)
2011-02-22 11:25 PST, Francisco Donalisio
timello: review-
Details | Diff | Review
Remove WCAG 2.0 violations in the describecomponents pages (1.31 KB, patch)
2011-03-09 04:47 PST, Francisco Donalisio
timello: review+
Details | Diff | Review
Remove WCAG 2.0 violations in the describe components page (1.31 KB, patch)
2011-04-01 11:00 PDT, Francisco Donalisio
timello: review+
Details | Diff | Review

Description Francisco Donalisio 2011-02-22 11:06:46 PST
User-Agent:       Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.2.13) Gecko/20101206 Ubuntu/10.10 (CK-IBM) (CK-IBM) Firefox/3.6.13
Build Identifier: 

We should change the Describe Component page to make it complaint with W3C Web
Accessibility Initiative.


Reproducible: Always
Comment 1 Francisco Donalisio 2011-02-22 11:25:00 PST
Created attachment 514229 [details] [diff] [review]
Remove WCAG 2.0 violations in the describe components page

Implements the following W3C accessibility techniques 
- 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 due to using structural markup in a way that does not represent relationships in the content -  http://www.w3.org/TR/WCAG20-TECHS/F43.html
Using the summary attribute of the table element to give an overview of data tables - http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H73
Comment 2 Tiago Mello [:timello] 2011-03-05 10:43:26 PST
Comment on attachment 514229 [details] [diff] [review]
Remove WCAG 2.0 violations in the describe components page

>=== modified file 'skins/contrib/Dusk/global.css'
> #bugzilla-body th {
>-    text-align: right;

Why are you removing this?

>     font-weight: bold;
>     vertical-align: top;
>     white-space: nowrap;
>@@ -229,6 +228,10 @@
> 
> /* other */
> 
>+.bz_simple_search th {
>+    text-align: right;
>+} 
>+

I think this is not part of this patch, right?

> .bz_row_odd {
>     background-color: #f0f0f0;
> }
>
>=== modified file 'skins/standard/reports.css'
>--- skins/standard/reports.css	2009-12-12 21:48:11 +0000
>+++ skins/standard/reports.css	2011-02-22 17:58:27 +0000
>@@ -29,6 +29,7 @@
> }
> 
> .product_name {
>+  font-size: 1.5em;
>   margin: 0;
> }
> 
>
>=== modified file 'template/en/default/reports/components.html.tmpl'
>--- template/en/default/reports/components.html.tmpl	2010-07-22 22:46:02 +0000
>+++ template/en/default/reports/components.html.tmpl	2011-02-22 18:35:45 +0000
>@@ -45,7 +45,7 @@
>       Select a component to see open [% terms.bugs %] in that component:
>     </td>
>     <td class="product_container">
>-      <h2 class="product_name">[% product.name FILTER html %]</h2>
>+      <strong class="product_name">[% product.name FILTER html %]</strong>

I'm not sure if we want to emphasize that... I think we can use <span class="product_name"> with font-weight: bold instead.

>       <div class="product_desc">
>         [% product.description FILTER html_light %]
>       </div>
>@@ -53,12 +53,12 @@
>   </tr>
> </table>
> 
>-<h3 class="components_header">Components</h3>

It can be a <span> here.

> 
>-<table class="component_table" cellspacing="0" cellpadding="0">
>+<table summary="Components table"
>+       class="component_table" cellspacing="0" cellpadding="0">
>   <thead>
>   <tr>
>-    <th>&nbsp;</th>
>+    <th><strong class="components_header">Components</strong></th>

Then no need for this.

>     <th>Default Assignee</th>
>     [% IF Param("useqacontact") %]
>       <th>Default QA Contact</th>
>
>=== modified file 'template/en/default/search/search-specific.html.tmpl'

This is not part of this patch as well, right?
Comment 3 Francisco Donalisio 2011-03-09 04:47:44 PST
Created attachment 518033 [details] [diff] [review]
Remove WCAG 2.0 violations in the describecomponents pages
Comment 4 Tiago Mello [:timello] 2011-03-23 19:34:25 PDT
Comment on attachment 518033 [details] [diff] [review]
Remove WCAG 2.0 violations in the describecomponents pages

It looks good! It passes in all tests. Thanks!
Comment 5 Frédéric Buclin 2011-03-30 10:04:05 PDT
Why using em as units for font-size for <h2> but % for <h3>?
Comment 6 Francisco Donalisio 2011-04-01 11:00:24 PDT
Created attachment 523634 [details] [diff] [review]
Remove WCAG 2.0 violations in the describe components page

Now using only % in the font-size.
Comment 7 Tiago Mello [:timello] 2011-04-11 21:12:07 PDT
Comment on attachment 523634 [details] [diff] [review]
Remove WCAG 2.0 violations in the describe components page

Ok! Using as the same unit as the others. And the size looks the same as <h2>.

Thanks Francisco!
Comment 8 Tiago Mello [:timello] 2011-04-12 10:52:48 PDT
Committing to: bzr+ssh://timello%40gmail.com@bzr.mozilla.org/bugzilla/trunk/                                                                                                           
modified skins/standard/reports.css
modified template/en/default/reports/components.html.tmpl
Committed revision 7775.

Note You need to log in before you can comment on or make changes to this bug.