Make Describe Components page compliant with WAI

RESOLVED FIXED in Bugzilla 4.2

Status

()

Bugzilla
User Interface
--
enhancement
RESOLVED FIXED
7 years ago
6 years ago

People

(Reporter: Francisco Donalisio, Assigned: Francisco Donalisio)

Tracking

(Blocks: 2 bugs)

unspecified
Bugzilla 4.2
Dependency tree / graph
Bug Flags:
approval +

Details

Attachments

(1 attachment, 2 obsolete attachments)

(Assignee)

Description

7 years ago
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
(Assignee)

Updated

7 years ago
Blocks: 252715
Depends on: 635764
Hardware: x86 → All
(Assignee)

Comment 1

7 years ago
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
Attachment #514229 - Flags: review?(timello)
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?
Attachment #514229 - Flags: review?(timello) → review-
(Assignee)

Comment 3

7 years ago
Created attachment 518033 [details] [diff] [review]
Remove WCAG 2.0 violations in the describecomponents pages
Attachment #514229 - Attachment is obsolete: true
Attachment #518033 - Flags: review?(timello)
(Assignee)

Updated

7 years ago
Blocks: 640579

Updated

7 years ago
Status: UNCONFIRMED → NEW
Ever confirmed: true
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!
Attachment #518033 - Attachment description: Remove WCAG 2.0 violations in the buglist pages → Remove WCAG 2.0 violations in the describecomponents pages
Attachment #518033 - Flags: review?(timello) → review+

Updated

7 years ago
Flags: approval?

Comment 5

7 years ago
Why using em as units for font-size for <h2> but % for <h3>?
Assignee: ui → francsd
Status: NEW → ASSIGNED
Target Milestone: --- → Bugzilla 4.2
(Assignee)

Comment 6

7 years ago
Created attachment 523634 [details] [diff] [review]
Remove WCAG 2.0 violations in the describe components page

Now using only % in the font-size.
Attachment #518033 - Attachment is obsolete: true
Attachment #523634 - Flags: review?(timello)

Updated

7 years ago
Flags: approval?
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!
Attachment #523634 - Flags: review?(timello) → review+

Updated

6 years ago
Flags: approval?

Updated

6 years ago
Flags: approval? → approval+
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.
Status: ASSIGNED → RESOLVED
Last Resolved: 6 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.