Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 5 additions & 5 deletions _rules/presentational-children-no-focusable-content-307n5z.md
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,7 @@ This element with the `menuitemcheckbox` role has an `input` element as a descen

#### Passed Example 4

This `<button>` element has an `a` element as a [child][]. The `a` element has no `href` attribute, so it isn't included in [sequential focus navigation][]. So this `button` element passes the rule.
This `<button>` element has an `a` element as a [child][]. The `a` element has no `href` attribute, so it isn't included in [sequential focus navigation][].

```html
<button><a>button/link</a></button>
Expand Down Expand Up @@ -139,7 +139,7 @@ This element with the `menuitemcheckbox` role has a checkbox as a child. Because

#### Failed Example 4

This element with the `tab` role contains an `a` element. The `tab` role has [presentational children][]. The `a` element is included in [sequential focus navigation][]. So the element with the `tab` role fails the rule. (This tablist implementation is non-functional for users. It's not meant to function - it's only meant to show roles.)
This element with the `tab` role contains an `a` element. The `tab` role has [presentational children][]. The `a` element is included in [sequential focus navigation][]. This tablist implementation is non-functional for users. It's not meant to function - it's only meant to show roles.

```html
<ul role="tablist">
Expand All @@ -151,7 +151,7 @@ This element with the `tab` role contains an `a` element. The `tab` role has [pr

#### Failed Example 5

This element with the `img` role contains an `a` element. The `img` role has [presentational children][]. The `a` element is included in [sequential focus navigation][]. So the element with the `img` role fails the rule.
This element with the `img` role contains an `a` element. The `img` role has [presentational children][]. The `a` element is included in [sequential focus navigation][].

```html
<span role="img" aria-label="some ASCII art">****** This ASCII art ******* <a href="#">contains a link.</a></span>
Expand All @@ -161,7 +161,7 @@ This element with the `img` role contains an `a` element. The `img` role has [pr

#### Inapplicable Example 1

None of the roles that build this semantic table structure (`table` for `table`, `row` for `tr`, `columnheader` for `th`, and `cell` for `td`) have [presentational children][]. So this rule does not apply to them.
None of the roles that build this semantic table structure (`table` for `table`, `row` for `tr`, `columnheader` for `th`, and `cell` for `td`) have [presentational children][].

```html
<table>
Expand All @@ -180,7 +180,7 @@ None of the roles that build this semantic table structure (`table` for `table`,

#### Inapplicable Example 2

This `a` element has a `link` role, which does not have [presentational children][]. So this `a` element does not fail this rule, because it's inapplicable. To have a "focusable element within a focusable element" like this is a bad practice, but this rule doesn't directly check for it.
This `a` element has a `link` role, which does not have [presentational children][]. To have a "focusable element within a focusable element" like this is a bad practice, but this rule doesn't directly check for it.

```html
<a href="https://w3.org"><span tabindex="0">W3C Website</span></a>
Expand Down
18 changes: 9 additions & 9 deletions _rules/visible-label-in-accessible-name-2ee8b8.md
Original file line number Diff line number Diff line change
Expand Up @@ -254,15 +254,15 @@ This button has [visible inner text][] that is only partially contained within t

#### Failed Example 3

This button has [visible inner text][] that is fully contained within the [accessible name][] when viewed as a character-by-character substring. But that does not satisfy the [label in name algorithm][], which works on full words. So this fails the rule.
This button has [visible inner text][] that is fully contained within the [accessible name][] when viewed as a character-by-character substring. But that does not satisfy the [label in name algorithm][], which works on full words.

```html
<a href="#" aria-label="Discover Italy">Discover It</a>
```

#### Failed Example 4

This link's [accessible name][] contains two tokens (according to the[label in name algorithm][]) and the [visible inner text][] contains one token. So it fails the rule.
This link's [accessible name][] contains two tokens (according to the[label in name algorithm][]) and the [visible inner text][] contains one token.

```html
<a aria-label="just ice" href="#">justice</a>
Expand Down Expand Up @@ -294,23 +294,23 @@ This rule has no special handling for converting mathematical symbols into words

#### Failed Example 8

This button's accessible name contains the same tokens that are in the visible label. But they aren't in the same order, so it fails the [contiguous subsequence][] check part of the [label in name algorithm][], and so it fails the rule.
This button's accessible name contains the same tokens that are in the visible label. But they aren't in the same order, so it fails the [contiguous subsequence][] check part of the [label in name algorithm][].

```html
<button aria-label="how are you"><span>you</span><span>how</span><span>are</span></button>
```

#### Failed Example 9

This button's accessible name contains the word "the" in the middle of it, which causes the [contiguous subsequence][] check of the [label in name algorithm][] (in particular: the "contiguous" requirement) to fail. So it fails the rule.
This button's accessible name contains the word "the" in the middle of it, which causes the [contiguous subsequence][] check of the [label in name algorithm][] (in particular: the "contiguous" requirement) to fail.

```html
<button aria-label="Download the specification">Download specification</button>
```

#### Failed Example 10

This link's accessible name contains the same digits that are in the visible label, and in the same order. But they have different spaces and punctuation between them, so they are considered separate tokens. So this fails the rule.
This link's accessible name contains the same digits that are in the visible label, and in the same order. But they have different spaces and punctuation between them, so they are considered separate tokens.

```html
<a aria-label="1 2 3. 5 5 5. 0 1 2 3" href="tel:1235550123">123.555.0123</a>
Expand Down Expand Up @@ -350,15 +350,15 @@ This rule has no special handling for converting digits into words, or vice vers

#### Failed Example 15

The [label in name algorithm][] works on full words. That is: it requires that each full word in the visible label ("1" in this case) is equal to a full word in the accessible name ("1a" in this case). Those two words - "1" and "1a" - are not equal, so this element fails the rule.
The [label in name algorithm][] works on full words. That is: it requires that each full word in the visible label ("1" in this case) is equal to a full word in the accessible name ("1a" in this case). Those two words - "1" and "1a" - are not equal.

```html
<a aria-label="1a" href="#">1</a>
```

#### Failed Example 16

The definition of [visible inner text][] doesn't treat text any differently if it's excluded from the accessibility tree with aria-hidden. So this rule effectively ignores aria-hidden. So this element fails the rule.
The definition of [visible inner text][] doesn't treat text any differently if it's excluded from the accessibility tree with aria-hidden. This rule effectively ignores aria-hidden.

```html
<a aria-label="Download specification" href="#">Download <span aria-hidden="true">gizmo</span> specification</a>
Expand Down Expand Up @@ -403,15 +403,15 @@ This link has no [visible text content][].

#### Inapplicable Example 5

This link's label contains an abbreviation, so it is not applicable.
This link's label contains an abbreviation.

```html
<a aria-label="University Avenue" href="#">University Ave.</a>
```

#### Inapplicable Example 6

This word - non-standard / nonstandard - appears in both the element's accessible name and its visible label, using different hyphenation. So it's not applicable.
This word - non-standard / nonstandard - appears in both the element's accessible name and its visible label, using different hyphenation.

```html
<a href="#" aria-label="non-standard">nonstandard</a>
Expand Down