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
3 changes: 3 additions & 0 deletions __tests__/spelling-ignore.yml
Original file line number Diff line number Diff line change
Expand Up @@ -295,3 +295,6 @@
- A-lum-min
- B-lum-max
- B-lum-min

#Browsers Internal Roles
- SvgRoot
17 changes: 4 additions & 13 deletions _rules/image-non-empty-accessible-name-23a2a8.md
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,7 @@ There are no assumptions.
- There are several popular browsers that do not treat images with an empty `alt` attribute (`alt=""`) as having a role of `presentation` but instead add the `img` element to the accessibility tree with a [semantic role][] of either `img` or `graphic`.
- Implementation of [Presentational Roles Conflict Resolution][] varies from one browser or assistive technology to another. Depending on this, some [semantic][semantic role] `img` elements can fail this rule with some technology but users of other technologies would not experience any accessibility issue.
- Images can have their role set to `presentation` through an empty `alt` attribute. [Presentational Roles Conflict Resolution][] does not specify what to do if such an image is [focusable][] (it only specifies what to do in case of explicit `role="none"` or `role="presentation"`). Some browsers expose these images and some don't. Thus, this rule may fail for technologies that expose these without creating an accessibility issue for users of other technologies.
- `svg` elements have an [implicit role][] of `graphics-document` in [svg-aam](https://www.w3.org/TR/svg-aam-1.0/#details-id-66). There are popular browsers that do not follow [svg-aam](https://www.w3.org/TR/svg-aam-1.0/#details-id-66) and instead expose SVG elements with a different [semantic role][], such as `image`, `generic` or `SvgRoot`.

### Bibliography

Expand Down Expand Up @@ -196,16 +197,6 @@ This `img` element has an [explicit role][] of `none`. However, it is [focusable

#### Inapplicable Example 1

This `svg` element has an [implicit role][] of `graphics-document`.

```html
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100">
<circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
```

#### Inapplicable Example 2

This [semantic][semantic role] `img` element is hidden with `aria-hidden` set to "true".

```html
Expand All @@ -216,15 +207,15 @@ This [semantic][semantic role] `img` element is hidden with `aria-hidden` set to
></div>
```

#### Inapplicable Example 3
#### Inapplicable Example 2

This `img` element is hidden with `aria-hidden` set to "true".

```html
<img src="/test-assets/shared/w3c-logo.png" aria-hidden="true" />
```

#### Inapplicable Example 4
#### Inapplicable Example 3

This `img` element is hidden because its parent has `display: none`.

Expand All @@ -234,7 +225,7 @@ This `img` element is hidden because its parent has `display: none`.
</div>
```

#### Inapplicable Example 5
#### Inapplicable Example 4

This `img` element is hidden with `visibility: hidden`.

Expand Down