Wikipedia

Wikipedia:WikiProject Accessibility/Manual of Style draft: Difference between revisions

Browse history interactively
← Previous edit
Content deleted Content added
VisualWikitext
Dodoïste (talk | contribs)
3,461 edits
→Data tables: Reviewed
{{superseded|date=2013|Wikipedia:Manual of Style/Accessibility}}
 
(12 intermediate revisions by 3 users not shown)
Line 1:
{{Wikipedia:WikiProject Accessibility/Breadcrumb|Coordination|[[Wikipedia:WikiProject Accessibility/Manual of Style draft|Manual of Style draft]]}}
{{Wikipedia:WikiProject Accessibility/Navigation menu|Coordination}}
{{superseded|date=2013|[[Wikipedia:Manual of Style/Accessibility]]}}
 
After a [http://en.wikipedia.org/w/index.php?title=Wikipedia_talk:Manual_of_Style_(accessibility)&oldid=380142437#Changes_to_this_guideline discussion on Wikipedia talk:Manual of Style (accessibility)], it became clear that great changes needs to be prepared on a dedicated subpage.
 
Line 7:
 
Criteria on this page are prioritized according to impact (W3C's accessibility level of priorities: A, AA or AAA) and degree of feasibility (with MediaWiki's syntax and the burden it places on users).
 
== Data tables ==
 
<div style="color:green;"><strong>Status: Complete. Reviewed by an accessibility expert.</strong></div>
*Priority: high (A accessibility level)
*Difficulty: easy (blend in nicely with editorial habits)
 
<pre>
{|
|+ [caption text]
|-
! scope="col" | [column header 1]
! scope="col" | [column header 2]
! scope="col" | [column header 3]
|-
! scope="row" | [row header 1]
| [normal cell 1,2] || [normal cell 1,3]
|-
! scope="row" | [row header 2]
| [normal cell 2,2] || [normal cell 2,3]
...
|}
</pre>
 
; Caption ( <code>|+</code> ): A caption is a table's title, describing its nature.<ref name="H39" group="WCAG-TECH">[http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H39 H39: Using caption elements to associate data table captions with data tables], A accessibility level.</ref>
; Row & column headers (<code> ! </code>): Like the caption, these help present the information in a logical structure to visitors.<ref group="WCAG-TECH">[http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H51 H51: Using table markup to present tabular information]</ref> The headers help screen readers render header information about data cells. For example, header information is spoken prior to the cell data, or header information is provided on request.<ref>[http://www.w3.org/TR/REC-html40/struct/tables.html#edef-TH Table cells: The TH and TD elements], W3C</ref>
; Scope of headers (<code> ! scope="col" | and ! scope="row" | </code>): This clearly identifies headers as either row headers or column headers. Headers can now be associated to corresponding cells.<ref name="H63" group="WCAG-TECH">[http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H63.html H63: Using the scope attribute to associate header cells and data cells in data tables], A accessibility level.</ref>
 
[[Wikipedia:WikiProject Accessibility/Manual of Style draft/Data tables tutorial]] provides detailed requirements:
# Correct table captions
# Correct headers structure
# Images and color
# Avoiding nested tables
 
== Layout tables ==
Line 46 ⟶ 13:
 
=== Bad example ===
From [http://en.wikipedia.org/w/index.php?title=S.M.A.R.T.&oldid=377897571#Known_ATA_S.M.A.R.T._attributes S.M.A.R.T.]. This layout table uses a table header <code>! Legend</code>, which indicatesmust abe dataavoided tablein wherelayout ittables. isScreen readers will interpret tables with a table header as data tables, thus layout tables must not contain table headers. Also, it uses a poorly contrasted icon without alt text.
 
{| class="wikitable" style="margin:auto;"
Line 52 ⟶ 19:
! colspan = "4" | Legend
|-
| <center>[[ImageFile:Green Arrow Up.svg|12px]] || <center>Higher raw value is better || <center>[[ImageFile:Green Arrow Down.svg|12px]] || <center>Lower raw value is better
|- style="background:#ffa07a;"
| colspan="2" style="width:50%; "| <center>'''Critical: red colored row''' || colspan="2" style="width:50%; background:#ffa07a;"| Potential indicators of imminent electromechanical failure
|}
 
==== Good example ====
In this example, the table header <code>! Legend</code> has been replaced by a table cell <code>| Legend</code>.
 
In addition : Icons with improved contrast, alt text and no link. The warning information given by the red row is now also textually provided by the warning icon thanks to <code>alt=warning</code>.
 
{| class="wikitable" style="margin:auto;"
| colspan="2" style="text-align:center;" | <strong>Legend</strong>
|-
| [[ImageFile:Dark Green Arrow Up.svg|12px|center|link=|alt=Higher]]
| Higher raw value is better{{discuss}}
|-
| [[ImageFile:Dark Green Arrow Down.svg|12px|center|link=||alt=Lower]]
| Lower raw value is better
|-
Line 76 ⟶ 44:
== Headings ==
 
''Statuts : under construction, needs translation''
 
Les titres de section permettent à tous les utilisateurs de percevoir et de comprendre la structure globale de la page. Les utilisateurs de lecteurs d'écran ou de loupe d'écran les utilisent pour explorer celle-ci et y naviguer rapidement. Ils doivent résumer avec concision le contenu de la section<ref group="WCAG-TECH">[http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H42 {{lang|en|Using h1-h6 to identify headings}}], niveau d'accessibilité A</ref>.
 
== Position of navigation templates ==
'Bonne pratique''' :</b> placer systématiquement les blocs de navigation (palettes, portails, autres projets, sections liens internes et externes) à la même position dans tous les articles.{{Fin cadre}}
 
* priorité : moyenne
* difficulté : facile
 
La position des éléments de navigation doit être prévisible pour les utilisateurs : il faut donc éviter de placer les blocs de navigation à des endroits différents selon les articles (parfois en début de contenu, parfois au milieu, parfois en fin de contenu). Quel que soit l'emplacement retenu (il est indifférent pour l'accessibilité), celui-ci doit être constant<ref group="WCAG-TECH">[http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/G61 {{lang|en|Presenting repeated components in the same relative order each time they appear}}], niveau d'accessibilité AA</ref>.
 
'''Remarque''' : ce n'est pas la position à l'écran qui compte en matière d'accessibilité (à droite ou à gauche par exemple) mais la position dans l'ordre du code HTML (en début ou en fin du code de la zone de contenu de la page)
 
== Colour ==
Line 90 ⟶ 70:
''Statuts : under construction''
 
== Other languagesText ==
 
''Statuts : under construction''
 
2 Texte des articles
[http://www.w3.org/TR/UNDERSTANDING-WCAG20/meaning-other-lang-id.html Language of Parts: Understanding SC 3.1.2], WCAG 2.0.▼
2.1 Citations
2.2 Changements de langue
2.3 Termes techniques et usages rares d'un terme
2.4 Acronymes et abréviations
2.5 Attribut HTML title
2.6 Références à un contenu par sa position à l'écran
2.7 Recours aux symboles graphiques Unicode
2.8 Diagrammes et images en caractères ASCII (art ASCII)
2.8.1 Arborescences
 
=== CitationsOther languages ===
 
''Statuts : under construction''
 
▲[http://www.w3.org/TR/UNDERSTANDING-WCAG20/meaning-other-lang-id.html Language of Parts: Understanding SC 3.1.2], WCAG 2.0.
== Text ==
 
=== Citations ===
 
''Statuts : under construction''
 
== References ==
<references/>
Retrieved from "https://en.wikipedia.org/wiki/Wikipedia:WikiProject_Accessibility/Manual_of_Style_draft"