Wikipedia:Manual of Style/Accessibility/Anchor tests

Anchor tests
This is a test of:
 * What it looks like when you follow anchors that are done in particular ways; and
 * What it looks like in the edit summary when you click the [edit] tool for a heading and anchors are done different ways in relation to the heading.

Links to each anchor:


 * Anchor 1: Bare HTML around heading
 * Anchor 2: Bare HTML at start of heading
 * Anchor 3: Bare HTML at end of heading
 * Anchor 4: Template at start of heading
 * Anchor 5: Template at end of heading
 * Anchor 6: Anchor underneath heading
 * Anchor 7: Anchor above heading
 * Anchor 8: Multiple templated anchors at start of heading

Anchor 1: Bare HTML around heading
The code:

Anchor 1: Bare HTML around heading

 * Results
 * Heading: Fully visible after jumping to anchor.
 * Edit summary: No effect; the markup is invisible.
 * Accessibility issues: Hard to identify the heading in the markup, because it is preceded by code.

Anchor 2: Bare HTML at start of heading
The code:

Anchor 2: Bare HTML at start of heading

 * Results
 * Heading: Fully visible after jumping to anchor.
 * Edit summary: No effect; the markup is invisible
 * Accessibility issues: Hard to identify the heading in the markup, because it is preceded by code.

Anchor 3: Bare HTML at end of heading
The code:

Anchor 3: Bare HTML at end of heading

 * Results
 * Heading: Not entirely visible after jumping to anchor, but still readable (Chrome, Mac OS X).
 * Edit summary: No effect; the markup is invisible.
 * Accessibility issues: Some screen readers could potentially begin reading after the anchor point, though most work on a line-by-line basis, so this may be a non-issue.

Anchor 4: Template at start of heading
The code:

Anchor 4: Template at start of heading

 * Results
 * Heading: Fully visible after jumping to anchor.
 * Edit summary: Garbled by presence of template
 * Accessibility issues: Hard to identify the heading in the markup, because it is preceded by template code.

Anchor 5: Template at end of heading
The code:

Anchor 5: Template at end of heading

 * Results
 * Heading: Not entirely visible after jumping to anchor, but still readable (Chrome, Mac OS X).
 * Edit summary: Garbled by presence of template, but still readable because it's at the end
 * Accessibility issues: Some screen readers could potentially begin reading after the anchor point, though most work on a line-by-line basis, so this may be a non-issue.

Anchor 6: Anchor underneath heading
The code:

Anchor 6: Anchor underneath heading

 * Results
 * Heading: Not visible after jumping to anchor (Chrome, Mac OS X).
 * Edit summary: No effect; the markup is not present in it.
 * Accessibility issues: Screen readers may not realize there's a heading there, and thus not read it.

Anchor 7: Anchor above heading
The code:

Anchor 7: Anchor above heading

 * Results
 * Heading: Fully visible after jumping to anchor
 * Edit summary: No effect; the markup is not present.
 * Accessibility issues: None known.
 * Practical concern: When moving section, anchor will not go with it unless people notice it's there, so they have to be told, e.g in an HTML comment. If someone moves the section containing the anchor, it would take the anchor with it, so that section might also need an HTML comment about this.

Anchor 8: Multiple templated anchors at start of heading
The code:

Anchor 8: Multiple templated anchors at start of heading

 * Results
 * Note: This method is used, e.g., at News style and various other articles.
 * Heading: Fully visible after jumping to anchor
 * Edit summary: Long template string in front of the heading name, may make edit summaries very short, unless people realize they can remove the template part from between the  part.
 * Accessibility issues: Same as with other cases of using a template in front of the heading name, but worse due to the length.
 * Practical concern: This is actually a fairly lean way to do this if there are multiple short anchors, and the real heading isn't very long. Still, the  method above would also work for this.