
"Image of Ellen Ochoa, Astronaut" redundantly describes the image as an image. Her mode of dress further conveys that she is an astronaut-which is meaningful, given her achievements.īased on this, we recommend alt="Astronaut Ellen Ochoa". In the example above, the image content informs the user that this is Ellen Ochoa. If the image's content is presented within the surrounding text, then alt="" may be all that's needed. In this case, the image does not have a function.Īssessing and summarizing an image's content can be more difficult. An image only has a function if it is linked (or has an within a ), or if it's in a. "Ellen Ochoa, the first Hispanic woman to go into space"įirst, consider its content and function.What would you choose as alt text for the image in Example 1? Thus, alternative text is about more than just the alt attribute.Įvery image should have an alt attribute, even if it's alt="" (sometimes called "null" alternative text).
within visible body text near the image, or when the text equivalent cannot be presented succinctly, alternative text can be presented on a separate page, linked from either the image or a text link adjacent to the image. within the alt attribute of the element. Web page authors must provide alternative text that represents the content and function of their images.Īlternative text can be presented in two ways: A maple leaf might represent Canada, or it might just illustrate the leaf of a tree.
Search engines use alternative text and factor it into their assessment of the page purpose and content.Īlthough technology is getting better at recognizing what an image depicts, algorithms alone cannot understand what an image means within the context of the overall page. If an image fails to load or the user has blocked images, the browser will present the alternative text visually in place of the image. Screen readers announce alternative text in place of images, helping users with visual or certain cognitive disabilities perceive the content and function of the images. This article is focused on images, but its principles also apply to multimedia and other non-text content.Īlternative text serves several functions: Be very careful not to orphan words in blank spaces, or interfere with readability.Alternative text is a textual substitute for non-text content in web pages. On some keyboards, you may be able to use ALT, CTRL, or other modifier keys to move the image in tinier increments. Fine-tune the placement using the ARROWS on the keyboard. You won’t be able to read the text behind the graphic.Īfter setting the Wrap style, drag the image to the desired location. IN FRONT OF TEXT forces the image to float on top of the content. Be careful to maintain legibility using font styles and colors.
BEHIND TEXT layers the text and image so that the image appears in back of the text. TOP AND BOTTOM confines the text to appearing above and below the graphic. #How to put image behind text word online full
To see the full effect, you may need to edit the Wrap points (see below). THROUGH allows text to flow into the white space of a graphic.This looks great for curved images, and graphics with transparent backgrounds.
TIGHT wraps the text around the shape of clip art and cut out graphics.SQUARE wraps the text around all four sides of the graphic.Moving the image is just like moving text. Its size spreads out the lines of text, creating a gap. The graphic acts like a giant alphabet letter.