How to use the ‘alt’ attribute of the element in various situations – An alt Decision Tree
in Images Tutorial
This decision tree describes how to use the alt
attribute of the <img>
element in various situations. For some types of images, there are alternative approaches, such as using CSS background images for decorative images or web fonts instead of images of text. zaklady bukmacherskie duda trzaskowski
- Does the image contain text?
- Yes:
- … and the text is also present as real text nearby.Use an empty
alt
attribute. See Decorative Images. - … and the text is only shown for visual effects.Use an empty
alt
attribute. See Decorative Images. - … and the text has a specific function, for example is an icon. zakłady online pl Use the
alt
attribute to communicate the function of the image. See Functional Images. - … and the text in the image is not present otherwise.Use the
alt
attribute to include the text of the image. See Images of Text.
- … and the text is also present as real text nearby.Use an empty
- No:
- Continue.
- Yes:
- Is the image used in a link or a button, and would it be hard or impossible to understand what the link or the button does, if the image wasn’t there?
- Yes:
- Use the
alt
attribute to communicate the destination of the link or action taken. See Functional Images.
- Use the
- No:
- Continue.
- Yes:
- Does the image contribute meaning to the current page or context?
- Yes:
- … and it’s a simple graphic or photograph.Use a brief description of the image in a way that conveys that meaning in the
alt
attribute. See Informative Images. - … and it’s a graph or complex piece of information. fortuna zaklady online Include the information contained in the image elsewhere on the page. See Complex Images.
- … and it shows content that is redundant to real text nearby.Use an empty
alt
attribute. See (redundant) Functional Images.
- … and it’s a simple graphic or photograph.Use a brief description of the image in a way that conveys that meaning in the
- No:
- Continue.
- Yes:
- Is the image purely decorative or not intended for the user?
- Yes:
- Use an empty
alt
attribute. See Decorative Images.
- Use an empty
- No:
- Continue.
- Yes:
- Is the image’s use not listed above or it’s unclear what
alt
text to provide?- This decision tree does not cover all cases. For detailed information on the provision of text alternatives refer to the Image Concepts Page.