Last modified: 2014-11-17 10:34:54 UTC

Wikimedia Bugzilla is closed!

Wikimedia migrated from Bugzilla to Phabricator. Bug reports are handled in Wikimedia Phabricator.
This static website is read-only and for historical purposes. It is not possible to log in and except for displaying bug reports and their history, links might be broken. See T2457, the corresponding Phabricator task for complete and up-to-date bug report information.
Bug 457 - Clean up use of header tags in MonoBook & Vector skin UI elements
Clean up use of header tags in MonoBook & Vector skin UI elements
Status: RESOLVED FIXED
Product: MediaWiki
Classification: Unclassified
Interface (Other open bugs)
1.20.x
All All
: Low normal with 5 votes (vote)
: ---
Assigned To: Nobody - You can work on this!
: accessibility
Depends on:
Blocks: 367
  Show dependency treegraph
 
Reported: 2004-09-12 01:41 UTC by Aaron J. Angel
Modified: 2014-11-17 10:34 UTC (History)
6 users (show)

See Also:
Web browser: ---
Mobile Platform: ---
Assignee Huggle Beta Tester: ---


Attachments

Description Aaron J. Angel 2004-09-12 01:41:48 UTC
Current usage does not follow the guideline that headings represent logical
structure of documents.  The sitesubtitle and personal, navigation, toolbar and
search box labels appear to use HTML heading tags for font and/or emphasis
rather than logical structure.  Below is the output from the W3C HTML Validator
using the Outline option; the outline generated is incomplete as headings are
used inappropriately.


Outline

Below is an outline for this document, automatically generated from the heading
tags (<h1> through <h6>.)

    * Main Page
          o A level 2 heading is missing!  <----- problem
                + From PhutureWiki
          o Development projects
                + A level 3 heading is missing!  <----- problem
                      # A level 4 heading is missing!  <----- problem
                            * Views
                            * Personal tools
                            * Navigation
                            * Search
                            * Toolbox

If this does not look like a real outline, it is likely that the heading tags
are not being used properly. (Headings should reflect the logical structure of
the document; they should not be used simply to add emphasis, or to change the
font size.)
Comment 1 Aaron J. Angel 2004-09-12 01:42:30 UTC
er, forgot to mention, this was with the default Monobook skin.
Comment 2 Brion Vibber 2004-09-12 02:21:27 UTC
Here's the use of heading tags in MediaWiki:

<h1> page title
<h2> == Heading ==
<h3> === Heading ===
<h4> ==== Heading ====
<h5> ===== Heading =====
<h6> ====== Heading ======

If there's something wrong in the usage of these tags, please fix the relevant articles.

If that's not sufficient, please reopen the bug and clarify. If you can cite the guidelines you're talking about that would be very helpful.
Comment 3 Aaron J. Angel 2004-09-12 02:34:33 UTC
As far as wiki markup goes, headers are generated correctly.  The problem
appears to exist in the template(s) applied to the article source used to
generate the HTML output for the page. Please review the Outline in the original
comments more carefully, the problems are pointed out rather clearly.  Several
outline entries do not relate to the contents article itself, such as the
sitesubtitle, and the box labels, none of which have parent headers (though they
have grandparent headers).  The problem that exists cannot be fixed by modifying
the source of any wiki article; the problem is in the skin template.

The guidelines mentioned were pasted right in the original comments for the bug;
see the outline pasted , it came from the W3C Validator (as do the guidelines),
also mentioned in the original comments for the bug.
Comment 4 Brion Vibber 2004-09-12 07:14:48 UTC
Set component, changed summary to reflect the issue at hand.
Comment 5 davao 2007-04-21 21:24:07 UTC
Created attachment 3484
Comment 6 davao 2007-04-21 21:24:23 UTC
Created attachment 3485
Comment 7 davao 2007-04-21 21:24:32 UTC
Created attachment 3486
Comment 8 davao 2007-04-21 21:24:41 UTC
Created attachment 3487
Comment 9 davao 2007-04-21 21:24:51 UTC
Created attachment 3488
Comment 10 davao 2007-04-21 21:24:59 UTC
Created attachment 3489
Comment 11 davao 2007-04-21 21:25:08 UTC
Created attachment 3490
Comment 12 davao 2007-04-21 21:25:19 UTC
Created attachment 3491
Comment 13 davao 2007-04-21 21:25:28 UTC
Created attachment 3492
Comment 14 davao 2007-04-21 21:25:36 UTC
Created attachment 3493
Comment 15 Daniel Kinzler 2007-04-21 21:33:36 UTC
you know, putting everything into *one* diff would be much nicer. Try svn help diff
Comment 16 Aryeh Gregor (not reading bugmail, please e-mail directly) 2007-04-22 03:01:17 UTC
Perhaps you would care to examine the contents of those patches before
commenting on the best format for them.
Comment 17 Andy Mabbett 2008-09-01 22:23:13 UTC
Is anything happening with this? There are accessibility impacts when headers are not structured correctly:

http://www.accessibilitytips.com/2008/03/10/avoid-skipping-header-levels/
Comment 18 Michael Zajac 2009-01-21 00:31:41 UTC
This blocks accessibility (Bug 367).

Ideally, the headings should be nested in order without skipping any—this deficiency blocks WCAG 1.0 AA and AAA conformance.  The site subtitle (h3#siteSub) is not a heading organizing the document or describing the content below, so it shouldn't be marked up as a heading element at all—this blocks WCAG 1.0 AA and AAA, WCAG 2.0 AA and AAA conformance.

WCAG 1.0 requires headings to be used and nested correctly (Priority 2, http://www.w3.org/TR/WCAG10/wai-pageauth.html#tech-logical-headings)

WCAG 2.0 requires headings to describe topic and purpose (AA, http://www.w3.org/TR/WCAG20/#navigation-mechanisms-descriptive) and section headings to organize a document (AAA, http://www.w3.org/TR/WCAG20/#navigation-mechanisms-headings).  Proper nesting is recommended, but not required (http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/G141).
Comment 19 Michael Zajac 2009-01-21 00:58:07 UTC
Although WCAG 2.0 doesn't require proper nesting, having sidebar boxes (h5) contained within the last article section (if it's headed by h2, h3, or h4) is an incorrect representation of the document structure, and arguably breaks WCAG 2.0 AAA conformance.  the h5's should be changed to h2's, below the page title (h1), and at the same level as the article's main section subheadings (h2).  

Of course the CSS skins should be adjusted so the presentation remains the same.
Comment 20 Danny B. 2010-07-19 13:17:36 UTC
The h3#siteSub replaced by div#siteSub in r69545.
Comment 21 Bartosz Dziewoński 2012-09-22 21:46:26 UTC
Assigning to myself. I'm going to work on it.
Comment 22 Bartosz Dziewoński 2012-09-22 22:58:34 UTC
Here's a draft of a change I would do: https://gerrit.wikimedia.org/r/#/c/24674/

Comments welcome (preferably on the patch).
Comment 23 Bartosz Dziewoński 2012-10-12 17:27:48 UTC
Unassigning, I abandoned the patch.

People do not like my proposed solution(s), and frankly I don't like theirs. I won't oppose it, but I don't feel like implementing it myself.
Comment 24 Bartosz Dziewoński 2012-10-29 13:25:02 UTC
I've attempted a fix once again, this time in a much less controversial way, in I9a2ebd50.
Comment 25 Bartosz Dziewoński 2012-11-24 12:17:08 UTC
Patch merged by Siebrand. There is a follow-up submitted by Aude to adjust the Vector extension to the changes that is not merged yet (I64794145), but apart from that this bug is done, so I'm marking this RESOLVED FIXED.
Comment 26 Erwin Dokter 2012-11-29 22:10:08 UTC
One question: Why?

The reason H5 is used in Vector's tab design is *because* is is the same size as regular text, so the exact height of the top bar is exactly 5em (2 x 2.5em). I see absolutely no benefit in chaging the headers to H3. Apart from completely killing my tabs gadget, we now have inconsistent sizing issues, which may break other gadgets and templates as well who's positioning rely on the top bar being 5em.

Fixing HTML is fine, but changing elements in the core design is a big no-no, and should be reverted. All the H5s were invisible, so there was nothing to fix.
Comment 27 Michael Zajac 2012-11-29 23:06:52 UTC
Erwin Dokter, obviously, the style sheet should be updated to format the H3 replacing an H5 to maintain the same visual styles. Hopefully this will prevent breaking gadgets. If your gadget relies on particular visual styling, can it be made less fragile by incorporating the required styles?

If the core design has improper HTML, then it should be fixed. Choosing H5 because it happens to be a particular size (with a particular style sheet in a particular visual browser) is a bad idea in the first place.
Comment 28 Andre Klapper 2012-11-30 13:01:34 UTC
[Restoring previous state.]

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


Navigation
Links