SC1-3-1-headings

From Automated WCAG Monitoring Community Group
Jump to: navigation, search

This test belongs to 1.3.1 Info and Relationships.

Status

Version 0.1: For review

Description

This test checks that a page is properly organized using headings.

Background

Assumptions

No assumptions yet

Test properties

Property Possible values
Success Criterion 1.3.1 Info and Relationships
Test name Proper use of headings
Test mode SemiAuto
Test environment HTML source
Test subject Web page
User expertise and skills No prior knowledge
User profile Requires sight

Test procedure

Selector

Test mode: earl:automatic


Select:

  • the h1,h2,h3,h4,h5,h6 elements. Selector: //*[self::h1 or self::h2 or self::h3 or self::h4 or self::h5 or self::h6]
  • each elements with the attribute role="heading". Selector: //*[self::*[role="heading"]]
  • the strong, b elements. Selector: //*[self::strong or self::b]
  • the div, span, p elements with CSS class="heading"
Open question: What are other elements that are wrongly used as heading?

Step 1: check element type

Test mode: earl:automatic



Step 2: heading content is non-empty (H42)

Test mode: earl:automatic


Check if the content of h1,h2,h3,h4,h5,h6 is Non-empty.

if yes, continue with #Step 3: heading markup is used when content is a heading

else return

Property Value
TestCase SC1-3-1-headings
Identifier SC1-3-1-headings-failed1
Outcome failed
ErrorMessage The heading element must have content.
Pointer position
Info


Step 3: heading markup is used when content is a heading (H42)

Test mode: earl:manual


User input question

Item presented to the user: Heading with the corresponding text

Question: Does the text is a heading with a correct level?

Answer options: "yes/no"

Help text:

Repair suggestion:

Properties of the test step:

  • context-sensitive = yes
  • user interaction (with the web content) required = yes


if yes, return

Property Value
TestCase SC1-3-1-headings
Identifier SC1-3-1-headings-passed1
Outcome passed
Pointer position
Info


else return

Property Value
TestCase SC1-3-1-headings
Identifier SC1-3-1-headings–failed2
Outcome failed
ErrorMessage the text is not a heading with a correct level.
Pointer position
Info


Open question: shall we fail 1.3.1 when h1 contains a wrong element e.g. table? or it is only a failure of 4.1.1 as it is an invalid code. Maybe this case this test should return a cann't tell and a failure for 4.1.1.

Step 4: Examine element with role="heading" (ARIA12)

Test mode: earl:manual


User input question

Item presented to the user: element, the content of the element, and aria-level attribute (if exist)

Question: Does the text is a heading with a correct level?

Answer options: "yes/no"

Help text:

Repair suggestion:

Properties of the test step:

  • context-sensitive = yes
  • user interaction (with the web content) required = yes


if yes, return

Property Value
TestCase SC1-3-1-headings
Identifier SC1-3-1-headings-passed2
Outcome passed
Pointer position
Info


else return

Property Value
TestCase SC1-3-1-headings
Identifier SC1-3-1-headings–failed3
Outcome failed
ErrorMessage the text is not a heading with a correct level.
Pointer position
Info


Step 5: using changes in text presentation to convey information (F2)

Test mode: earl:manual


User input question

Item presented to the user: strong,b and div,span,p that has CSS class="heading" with the content of them

Question: Does the text is a heading?

Answer options: "yes/no"

Help text:

Repair suggestion:

Properties of the test step:

  • context-sensitive = yes
  • user interaction (with the web content) required = yes


if yes, return

Property Value
TestCase SC1-3-1-headings
Identifier SC1-3-1-headings–failed4
Outcome failed
ErrorMessage styled text is used to convey structural information.
Pointer position
Info


else return

Property Value
TestCase SC1-3-1-headings
Identifier SC1-3-1-headings-passed3
Outcome passed
Pointer position
Info