diff --git a/_rules/heading-descriptive-b49b2e.md b/_rules/heading-descriptive-b49b2e.md index f469d6bc92..d2d877d1ef 100755 --- a/_rules/heading-descriptive-b49b2e.md +++ b/_rules/heading-descriptive-b49b2e.md @@ -1,10 +1,10 @@ --- id: b49b2e -name: Heading is descriptive +name: Heading is relevant and meaningful rules_format: 1.1 rule_type: atomic description: | - This rule checks that headings describe the topic or purpose of the content. + This rule checks that headings are meaningful and they are relevant to a specific topic, purpose or page. accessibility_requirements: wcag20:2.4.6: # Headings and labels (AA) forConformance: true @@ -13,11 +13,11 @@ accessibility_requirements: inapplicable: further testing needed input_aspects: - Accessibility Tree - - DOM Tree - CSS Styling - Language acknowledgments: authors: + - Armagan Tekdoner - Carlos Duarte - Dagfinn Rømen - Geir Sindre Fossøy @@ -27,203 +27,330 @@ acknowledgments: --- ## Applicability +This rule applies to any visible content that is perceived as a heading on a given page, as well as to any semantic heading element that is [included in the accessibility tree](included-in-the-accessibility-tree "Definition of included in the accessibility tree") while not visible. In other words, this rule applies to headings and their relation to the content, regardless of their compliance with any other accessibility criteria. -This rule applies to any [semantic][semantic role] `heading` element that is [included in the accessibility tree][] and has a non-empty (`””`) [accessible name][]. +The testing scope under this rule is limited exclusively to the wording in elements perceived or presented as headings. -## Expectation +### None of the following is within this rule's scope: +- Complete lack of headings +- Heading structure or hierarchy +- Coding errors, provided that the heading is visible or exposed to assistive technologies +- Grammar or spelling errors in headings, unless they render the text entirely unintelligible +- Styling and presentation, unless the styling renders the heading completely illegible +- Other accessibility failures covered by distinct WCAG success criteria, regardless of their severity -Each target element describes the topic or purpose of the first [perceivable content][] after the test target that is not [decorative][]. The order of elements is determined by the [flat tree][]. - -**Note:** Headings do not need to be lengthy. A word, or even a single character, may be sufficient. +## Expectations +- Each heading text is sufficiently intelligible and carries meaning +- Each heading is relevant to the specific page or section where it appears ## Background +This rule evaluates any element that functions as a heading, including those perceived visually by sighted users or explicitly exposed as headings to assistive technologies. The scope encompasses fully accessible headings (e.g., `

Meaningful and relevant heading

`), visual headings that lack assistive technology support (e.g., `

Meaningful and relevant heading

`), and structural headings that are hidden from visual presentation (e.g., `

Meaningful and relevant heading

`). While various implementations may simultaneously trigger failures under other WCAG success criteria, they are all subject to this rule. -Headings that are visible but not in the accessibility tree are a failure of [Success Criterion 1.3.1 Info and Relationships][sc131]. These are not tested by this rule but they can still fail [Success Criterion 2.4.6 Headings and Labels][sc246]. +Under this rule, "content" refers to any textual or non-textual element presented on the web page, including sections, paragraphs, forms, user interface components, media galleries, lists, or hyperlinks. -Testing tools treat empty headings `

` or `div role="heading" aria-level="1">` differently. Some report that empty headings fail under 1.3.1 Info and Relationships or 2.4.6 Labels or Instructions. Other tools report that these headings pass because they are ignored by most assistive technologies and cause no accessibility barriers at all. This rule does not include examples of empty headings because there is currently no harmonized approach for testing them. +To pass, a heading must have a meaning and be relevant to its associated content. Headings consisting of placeholder text or uninformative character strings fail this rule inherently. ### Assumptions +This rule assumes that testers evaluating the content possess the necessary language proficiency and contextual comprehension required to assess the relationship between the headings and their associated content. -This rule assumes that the [flat tree][] order is close to the reading order as elements are rendered on the page. Due to positioning, it is possible to render a document in an order that greatly differs from the tree order, in which case the content which is visually associated with a heading might not be the content following it in tree order and this rule might fail while [Success Criterion 2.4.6 Headings and Labels][sc246] is still satisfied. +#### Limitations +The following scenarios present inherent limitations to evaluation and the headings being tested may be deemed out of scope: +- Multilingual content: Web pages containing content in multiple languages (e.g., a heading in one language preceding content in another) where the tester does not possess professional working proficiency in all languages present. +- Rapidly changing or real-time content streams: Live, dynamic content fields (e.g., streaming data feeds, live social walls, or active chat interfaces) where the content updates at a rate that prevents static evaluation against its structural headings. +- Use of automated testing tools: This rule is inherently subjective and relies entirely on human judgment; it is not intended for automated testing tools. +- Exposure to controversies: Because evaluating the relevance and meaning of textual content is non-technical, findings can be contested by anyone regardless of their technical background. Consequently, this rule is designed as a test-to-pass evaluation, meaning failures are exceptions. Testers should default to a passing or not applicable result when in doubt. -This rule also assumes that the content the heading is intended to describe is [visible][] and not hidden from assistive technologies. Otherwise, cases such as expandable content using a heading might fail this rule while [Success Criterion 2.4.6 Headings and Labels][sc246] is still satisfied. +#### Exceptions +The following scenarios constitute exceptions to this rule, as the contextual intent of the author cannot be objectively determined by a web accessibility content guidelines specialist: +- Highly specialized or technical domains: content involving advanced scientific, technical, or academic material (e.g., specialized research documentation) that requires domain-specific expertise. +- Abstract or creative Works: content consisting of creative literary works, poetry, or abstract text where relevance is interpretive or non-linear rather than purely informational. +- Legally mundated or standardized statements: documents or user interfaces where the text and structure of headings are rigidly dictated by statutory, regulatory, or legal mandates (e.g., standardized privacy disclosures) that cannot be altered by the author. ### Accessibility Support - -Implementation of [Presentational Roles Conflict Resolution][] varies from one browser or assistive technology to another. Depending on this, some [semantic][semantic role] `heading` elements can fail this rule with some technology but users of other technologies would not experience any accessibility issue. +This rule does not rely on the support for particular accessibility features by different assistive technologies and user agents. ### Other Resources - -- [Understanding Success Criterion 1.3.1: Info and Relationships](https://www.w3.org/WAI/WCAG22/Understanding/info-and-relationships.html) - [Understanding Success Criterion 2.4.6: Headings and Labels](https://www.w3.org/WAI/WCAG22/Understanding/headings-and-labels.html) - [G130: Providing descriptive headings](https://www.w3.org/WAI/WCAG22/Techniques/general/G130) -- [H42: Using h1-h6 to identify headings](https://www.w3.org/WAI/WCAG22/Techniques/html/H42) -- [ARIA12: Using role=heading to identify headings](https://www.w3.org/WAI/WCAG22/Techniques/aria/ARIA12) +- [Understanding Success Criterion 2.4.10 Section Headings](https://www.w3.org/WAI/WCAG21/Understanding/section-headings) +- [Use headings to convey meaning and structure](https://www.w3.org/WAI/tips/writing/#use-headings-to-convey-meaning-and-structure) - [HTML Specification - Heading content](https://html.spec.whatwg.org/#heading-content) -## Examples +## Test Cases -### Passed +### Passed (Situation A) +Headings that are compliant under this criterion, while exhibiting no other accessibility or structural failures under WCAG. #### Passed Example 1 +This `h1` element provides a relevant heading that states the functional purpose of the page content. +```html +

Renew Your Passport Online

+ +``` -This `h1` heading element describes the topic of the following paragraph. +#### Passed Example 2 +This `h1` element provides a relevant heading for the marketing content that follows it. +```html +

Fresh deals just dropped: Printers

+ +``` +#### Passed Example 3 +This `h1` element provides a relevant heading for the informational data that follows it. ```html - -

Opening Hours

-

We are open Monday through Friday from 10 to 16

- +

Current Weather in New York

+ ``` -#### Passed Example 2 +### Passed (Situation B) +Headings that serve as structural or sequential identifiers, which are inherently compliant regardless of the specific content that follows. +Similarly: +- Headings denoting standard document sections – such as "Glossary," "Summary," or "Appendix" – are inherently compliant, unless an obvious error is observed. +- Headings serving as call-to-action items, reminders, or warnings followed by list items or other relevant content – such as "Don't Forget To:", "Please Bring...", or "Doors are closed at 10:00 pm sharp!" – are considered compliant, unless a clear contextual mismatch is observed (such as appearing on an unrelated page). -This heading marked up with an [explicit role][] of `heading` describes the topic of the following paragraph. +#### Passed Example 4 +This `h1` element provides a sequential identifier for a major document section. The content that follows makes no difference to the outcome of this test. +```html +

Chapter 4

+ +``` +#### Passed Example 5 +This `h1` element provides a structural identifier for a section of a musical work. The content that follows makes no difference to the outcome of this test, unless an obvious misplacement is observed. ```html - - Opening Hours -

We are open Monday through Friday from 10 to 16

- +

1st movement

+ ``` -#### Passed Example 3 +#### Passed Example 6 +This `h1` element is for a standard document section. The content that follows makes no difference unless an obvious error indicates it is not a glossary section. +```html +

Glossary

+ +``` + +#### Passed Example 7 +This `h1` element is a reminder heading. The content that follows makes no difference unless a clear contextual mismatch indicates it belongs on another page. +```html +

Don't Forget To Bring:

+ +``` -This `h1` heading element with an image describes the topic of the following paragraph. +### Passed (Situation C) +Headings that are compliant under this criterion, despite exhibiting other accessibility or structural failures under WCAG. +#### Passed Example 8 +This `h1` element provides a relevant heading that states the purpose of the page content. It passes this rule despite exhibiting other WCAG failures, such as hiding the text from assistive technologies and having a severely low contrast ratio. ```html - -

- Opening hours -

-

We are open Monday through Friday from 10 to 16

- +

Your Future Starts Here, at Our University

+ ``` -#### Passed Example 4 +#### Passed Example 9 +Because this `p` element looks like a heading, it is perceived as a heading. It passes this rule as its text is relevant, despite failing other WCAG criteria due to using changes in text presentation without using the appropriate markup and utilizing an invalid ARIA role and value. +```html +

A Million Different Journeys

+ +``` + +#### Passed Example 10 +Because this `img` element is visually presented as a heading, it is perceived as a heading. It passes this rule as its text is relevant, despite failing other WCAG criteria by relying entirely on an image of text and lacking an accessible name. +```html + + + +``` -This `h1` heading element has a single character text that describes the topic of the following description list. +### Passed (Situation D) +Headings that are compliant under this criterion by remaining meaningful and relevant, irrespective of whether they could be optimized for length, contain redundant phrasing, are entirely unnecessary, or provide editorially unnecessary descriptions. +#### Passed Example 11 +This `h1` element provides a relevant heading from which the purpose of the page content can be understood. It passes this rule despite being overly casual and including unnecessary details. ```html - -

A

-
-
airplane
-
- a powered flying vehicle with fixed wings and a weight greater than that of the air it displaces. -
-
apple
-
- the round fruit of a tree of the rose family, which typically has thin green or red skin and crisp flesh. -
-
- +

Welcome to Our State-of-the-art New Wizard That Will Mail Your Driver's Licence Home

+ ``` -#### Passed Example 5 +#### Passed Example 12 +This `h1` element provides a relevant heading from which the purpose of the page content can be understood. It passes this rule despite containing completely redundant phrasing. +```html +

Travel Advisories and Travel Advisory Information

+ +``` -This heading marked up with an [explicit role][] of `heading` describes the topic of the following paragraph. The heading is positioned off screen but is [included in the accessibility tree][]. +#### Passed Example 13 +This `h2` element accurately describes the content of the promotional banner that follows it. It passes this rule despite being entirely unnecessary, as it repeats the text of the accompanying `figcaption` element verbatim. +```html +

Our hotel, conveniently located near the historic town center, features 118 guest rooms and 18 luxury suites

+
+ Panoramic view of a mountain ski resort in winter, with the modern hotel facade illuminated in the foreground. +
Our hotel, conveniently located near the historic town center, features 118 guest rooms and 18 luxury suites.
+
+``` +#### Passed Example 14 +This `h2` element provides a relevant heading that accurately describes the content of the section. It passes this rule despite being editorially unnecessary because the following list of hyperlinks makes the purpose of the section immediately obvious. Although an alternative like "Links to External Resources" would provide better clarity, headings cannot be deemed non-compliant under this rule for merely stating the obvious, as such choices remain strictly within the editorial domain. ```html - - Opening Hours -

- We are open Monday through Friday from 10 to 16 -

- +

List of Links

+ ``` -#### Passed Example 6 +### Passed (Situation E) +Headings whose relevance or relationship to the section content is not immediately apparent, but becomes evident upon evaluation of the surrounding content or structural context. -This heading describes the first [perceivable content][] after it (the first `p` element). The next [perceivable content][] (the second `p` element) is not considered by this rule. +#### Passed Example 15 +This `h2` element uses a satirical or metaphorical phrase to introduce the topic. Although the heading text does not literally match the vocabulary of the section, its contextual relevance becomes evident when considering the immediate context of the paragraph that follows. Headings that use literary devices remain compliant under this rule, as the determination of tone or stylistic approach falls within the editorial domain. +```html +

Final Day for Savings

+

Everything will be more expensive tomorrow.

+ +``` +#### Passed Example 16 +This `h1` element employs irony to introduce the topic. Although the heading text does not explicitly reference the literal vocabulary of the section, its contextual relevance becomes evident when the primary purpose of the content is determined. Headings that utilize literary or stylistic devices remain compliant under this rule, as the determination of editorial tone falls outside the scope of accessibility evaluation. ```html - -

Opening Hours

-

We are open Monday through Friday from 10 to 16

-

We are open Saturday from 10 to 13

- +

Nobel's Peace Prize Office is Temporarily Closed Due to Declining Business

+ ``` -### Failed +#### Passed Example 16 +This `h3` element employs an interrogative structure to introduce the section topic. Although the heading itself asks a question rather than providing a direct declaration, its contextual relevance becomes immediately evident upon evaluating the concise response that follows in the immediate text. +```html +

Opening hours?

+

24/7

+

No opening hours. We are at your service round the clock!

+``` -#### Failed Example 1 +### Passed (Situation F) +Headings that are compliant under this criterion, while containing errors in spelling, punctuation, capitalization, syntax, vocabulary, or structure. They may also include replicated text fragments resulting from copy-paste errors. These headings are considered passing if the text remains fairly intelligible. This is because the severity of these errors does not introduce ambiguity, distort the user's comprehension of the page structure, or cause any adverse material impact on any group of users. -This `h1` heading element does not describes the topic of the following paragraph. +#### Passed Example 17 +This `h2` element contains a combination of language errors. Despite the poor linguistic quality of the text, it remains compliant with this rule because the meaning is completely preserved, leaving no room for user misinterpretation or navigational barriers. +```html +

The Goverment is Planing to Introducing New Regulations!.

+ +``` +#### Passed Example 18 +This `h3` element contains a duplicated text fragment and a trailing white space resulting from a mechanical copy-paste or rendering error. It remains compliant because the core descriptive intent remains entirely unambiguous, not introducing a risk for user misunderstanding. ```html - -

Weather

-

We are open Monday through Friday from 10 to 16

- +

Contact Contact Customer Support

+ ``` -#### Failed Example 2 +#### Passed Example 19 +This `h2` element utilizes an incorrect word substitution resulting from a literal cross-linguistic translation. While the word "command" cannot replace "order" in English here, the heading remains compliant because the immediate operational context allows the action to be unmistakably understood, not introducing a risk for user misunderstanding. +```html +

Command your food for delivery

+ +``` -This heading marked up with an [explicit role][] of `heading` does not describe the topic of the following paragraph. +### Failed (Situation A) +Headings that contain unintended or malformed text resulting from programmatic errors, publishing anomalies, or unremoved development artifacts. These structural failures are typically identifiable through programmatic or visual evaluation without requiring a deep analysis of the surrounding content. + +#### Failed Example 1 +This `h1` element contains unremoved placeholder text from a content template. It fails this rule because the text serves as a developmental instruction rather than describing the purpose or topic of the page content. +```html +

[Replace this text with heading 1]

+``` +#### Failed Example 2 +This `h1` element contains a raw back-end runtime error message injected during server-side execution. It fails this rule because the displayed text is a system-generated message rather than an intentional heading describing the purpose or topic of the page content. ```html - - Weather -

We are open Monday through Friday from 10 to 16

- +

Uncaught Error: Call to undefined function get_user_data() in /var/www/html/profile.php on line 42

+ ``` #### Failed Example 3 +This `h1` element contains only a raw timestamp. Due to a publishing or layout logic failure, this metadata was incorrectly rendered within the primary heading container rather than as a document footer element. It fails this rule because the date and time string do not identify or describe the primary purpose or topic of the page content. +```html +

2026-06-30 13:46 UTC

+ +``` -This heading marked up with an [explicit role][] of `heading` does not describe the topic of the following paragraph. The heading is positioned off screen but is [included in the accessibility tree][]. +### Failed (Situation B) +Headings that consist entirely of generic phrases, sequential locators, or conversational greetings that, on their face, lack the descriptive property required to identify a specific topic. Because these labels are inherently ambiguous, they typically fail this rule based on their textual content alone, without necessitating any evaluation of the surrounding content. +#### Failed Example 4 +This `h1` element contains a brief, conversational greeting. It fails this rule on its face because the informal text possesses no descriptive value and provides no indication of the highly specific transactional nature of the form that follows. ```html - - Weather -

- We are open Monday through Friday from 10 to 16 -

- +

Hi

+ ``` -#### Failed Example 4 +#### Failed Example 5 +This `h1` element consists solely of a sequential placeholder. It fails this rule because the text lacks any topic-specific descriptor to identify the subject of the section, unless the page is part of a multi-volume document or a strictly paginated publication where the sequence itself serves as the primary identifier. A rapid evaluation of the immediate context confirms that this is a standard product listing, meaning the sequential label provides no descriptive utility. +```html +

Page 1

+ +``` + +#### Failed Example 6 +This `span` element utilizes the `role="heading"` attribute to programmatically identify itself as an `h1` equivalent, but contains a generic operational description of the site structure rather than a descriptive label for the current view. It fails this rule because the text describes the navigational tier instead of identifying the unique topic, aggregate purpose, or functional scope of the content that follows; consequently, it provides no discernable indication whatsoever regarding the actual nature of the articles being presented. +```html + Home Page of Our Newspaper + +``` -This `h1` heading element does not describe the first [perceivable content][] after it (the first `p` element). The next [perceivable content][] (the second `p` element) is not considered by this rule. +### Failed (Situation C) +Headings that contain explicitly incorrect, mislabeled, or contradictory information that misrepresents the actual purpose, functional scope, or transactional nature of the content that follows. +Unlike subjective editorial choices, these failures are characterized by objective, glaring mismatches that can be easily identified by a human reviewer within seconds of contextual evaluation. This situation focuses primarily on structural errors that cause immediate, severe consequences for most users, but especially for screen reader users and for users with cognitive disabilities the consequences may be more severe. +#### Failed Example 7 +This `h2` element misrepresents the operational direction of a financial transaction. The element fails this rule because the heading text explicitly contradicts the functional purpose of the content it introduces. +By providing an entirely inaccurate label for the transaction, the heading possesses zero descriptive utility and fails to identify the true topic or purpose. When a heading explicitly states an inbound transaction ("Request Money") but the interactive form executes an outbound transaction ("Send Money"), a user may inadvertently authorize an irreversible transfer of funds, resulting in immediate financial loss. ```html - -

Weather

-

We are open Monday through Friday from 10 to 16

-

It is going to rain tomorrow

- +

Request Money

+ ``` -### Inapplicable +#### Failed Example 8 +This `h1` element contains an explicit mismatch regarding the organizational topic of the page. At first glance, a user or tester is led to believe they are accessing Human Resources information, only to find that the subsequent headings and content are obviously dedicated to Information Technology. +The `h1` element fails this rule because the primary heading text explicitly misidentifies the subject matter of the content it precedes. A rapid evaluation of the heading structure reveals a direct contradiction between the primary title and the functional content sections, meaning the h1 provides zero accurate descriptive value for the document view. -#### Inapplicable Example 1 +```html +

Contact Human Resources

+
+

Information Technology (IT) management contact information

+ +
+``` -There is no heading. +#### Failed Example 9 +This `h1` element contains an explicitly erroneous transactional label, which is directly refuted by the form labels and input fields immediately following it. This `h1` element fails this rule because the primary heading text provides a completely false description of the page's functional utility. ```html - -

We are open Monday through Friday from 10 to 16

- +

Apply for Urgent Passport Renewal

+
+ + + +
``` -#### Inapplicable Example 2 +### Failed (Situation D) +Headings that contain errors in spelling, punctuation, capitalization, syntax, vocabulary, or structure. They may also include replicated text fragments resulting from copy-paste errors. These headings are considered failing if the text no longer remains fairly intelligible. This is because the severity of these errors introduces ambiguity, distorts the user's comprehension of the page structure, or causes an adverse material impact on some group of users. + +#### Failed Example 10 +This `h2` element contains severe mechanical text fragments and truncations, likely caused by an automated find-and-replace or script error. It fails to comply with this criterion because the structural degradation of the words prevents users from determining the topic or purpose of the subsequent content. + +```html +

The gov regu next year

+ +``` -This `h1` heading element is not [included in the accessibility tree][]. +#### Failed Example 11 +This `h3` element contains fragmented, truncated text resulting from a catastrophic copy-paste or rendering error. It fails to comply with this criterion because the remaining text fragment fails to convey any meaningful topic, leaving it entirely irrelevant to the underlying content. +```html +

ortcontact Custo

+ +``` +#### Failed Example 12 +This `h2` element utilizes an incorrect word substitution resulting from a literal cross-linguistic translation. While the developer intended to convey "finalize or complete your order," the word "terminate" instead implies canceling or deleting the items. The heading is non-compliant because it introduces severe ambiguity and a risk of user misunderstanding. ```html - -

Opening Hours

-

We are open Monday through Friday from 10 to 16

- +

Terminate your food basket here

+ ``` +______________________ CHANGES MADE END HERE _____________________________ -[decorative]: https://www.w3.org/TR/WCAG22/#dfn-pure-decoration 'WCAG definition of Pure decoration' -[flat tree]: https://drafts.csswg.org/css-scoping/#flat-tree 'Definition of flat tree' -[included in the accessibility tree]: #included-in-the-accessibility-tree 'Definition of included in the accessibility tree' -[presentational roles conflict resolution]: https://www.w3.org/TR/wai-aria-1.2/#conflict_resolution_presentation_none 'Presentational Roles Conflict Resolution' -[sc131]: https://www.w3.org/TR/WCAG22/#info-and-relationships ' Success Criterion 1.3.1 Info and Relationships' -[sc246]: https://www.w3.org/TR/WCAG22/#headings-and-labels 'Success Criterion 2.4.6 Headings and Labels' -[semantic role]: #semantic-role 'Definition of semantic role' -[visible]: #visible 'Definition of visible' -[accessible name]: #accessible-name 'Definition of accessible name' -[perceivable content]: #perceivable-content 'Definition of perceivable content'