id | name | rule_type | description | accessibility_requirements | input_aspects | acknowledgments | |||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
0va7u6 |
HTML graphics contain no text |
atomic |
This rule checks that images of text are not used
|
|
|
|
This rule applies to any rendered image resources in a web page.
For each test target, at least one of the following is true:
- essential: the visible pixels of the test target contain text for which its presentation is essential; or
- language: the visible pixels of the test target do not contain text expressing anything in a human language; or
- significant: the visible pixels of the test target contain text and the text is not a significant part of the visible pixels of the test target; or
- decoration: the embedded image the test target belongs to is purely decorative.
- There is no mechanism to change the rendered text in the image resource. Otherwise, the rule might fail while SC 1.4.5 Images of Text and SC 1.4.9 Images of Text (No Exception) might be satisfied.
- The specific presentation of the text rendered in the image resource can be achieved through formatted text. Otherwise, the rule might fail while SC 1.4.5 Images of Text and SC 1.4.9 Images of Text (No Exception) might be satisfied.
No accessibility support issues known.
This rule is designed specifically for SC 1.4.5 Images of Text which includes exceptions to the images it applies to that are not part of SC 1.4.9 Images of Text (No Exception). Therefore, some images that are inapplicable for this rule can be applicable to SC 1.4.9 Images of Text (No Exception).
- Understanding Success Criterion 1.4.5: Images of Text
- Understanding Success Criterion 1.4.9: Images of Text (No Exception)
This image resource referenced by the img
element does not contain text.
<img src="/test-assets/shared/fireworks.jpg" alt="fireworks going off behind the Eiffel tower at night" />
This image resource referenced by the input
element does not contain text.
<input type="image" src="/test-assets/shared/file.svg" alt="New file" />
This image resource referenced by the svg
element does not contain text.
<svg width="2in" height="3in" xmlns="http://www.w3.org/2000/svg">
<image x="20" y="20" width="200px" height="100px" href="/test-assets/shared/fireworks.jpg">
<title>Fireworks in Paris</title>
</image>
</svg>
This image resource referenced by the object
element contains text, but it is not the most significant content.
<object data="/test-assets/0va7u6/times_square.jpg" title="Picture of Times Square, New York"></object>
This image resource referenced by the img
element contains text, but its presentation is essential to convey the information.
<p>
The following image is a close up of the cover of a Classic Comics book titled "Ivanhoe" illustrating a font that
looks like an old Gothic style font.
</p>
<img
src="/test-assets/0va7u6/ivanhoe.png"
alt="The word Ivanhoe written in a style that resembles old medieval letters. The letter I is colored to resemble copper. The remaining letters are black. The background is yellow."
/>
This image resource referenced by the background-image
property of the div
element contains a logo with text. Logotypes are considered an essential exception.
<div
role="img"
aria-label="W3C logo"
style="
width: 100px;
height: 100px;
background-image: url(/test-assets/shared/w3c-logo.png);
background-repeat: no-repeat;
"
></div>
This image resource referenced by the img
element is an image of text (the book covers), but it is just meant to decorate the webpage of a book store, therefore it is purely decorative.
<img src="/test-assets/0va7u6/books.jpg" alt="" />
<p>Welcome to my book store</p>
These image resources referenced by the input
elements are images of text (the letter "A"), but they are not expressing anything in a human language. The image is only used to indicate how the font size can be controlled.
<input
type="image"
src="/test-assets/0va7u6/smallA.png"
style="border: 1px solid black;"
width="50px"
height="50px"
alt="Decrease text size"
/>
<input
type="image"
src="/test-assets/0va7u6/bigA.png"
style="border: 1px solid black;"
width="50px"
height="50px"
alt="Increase text size"
/>
This image resource referenced by the img
element contains text for which the particular presentation is not essential.
<img
src="/test-assets/0va7u6/textimage.jpg"
alt="The Accessibility Conformance Testing (ACT) Rules Format 1.0 defines a format for writing accessibility test rules."
/>
This image resource referenced by the input
element in the Image Button contains text for which the particular presentation is not essential.
<input type="image" src="/test-assets/0va7u6/button.jpg" alt="Press me" />
This image resource referenced by the background-image
property of the div
element contains text for which the particular presentation is not essential.
<div style="background-image: url(/test-assets/0va7u6/textimage.jpg); width: 500px; height: 200px;" />
This image resource referenced by the img
element contains text that provides redundant information, but it still is information, therefore it is not purely decorative.
<img src="/test-assets/0va7u6/welcome.png" alt="" />
<p>Welcome to our website</p>
The resource referenced by the object
element does not have visible pixels.
<object date="/test-assets/0va7u6/textimage.jpg" style="display: none"></object>
This svg
element does not have image
element descendants.
<svg xmlns="http://www.w3.org/2000/svg">
<text x="20" y="35">My</text>
<text x="45" y="35">cat</text>
<text x="55" y="55">is</text>
<text x="70" y="55">Grumpy!</text>
</svg>