HTML alt attribute Last Updated : 03 Feb, 2025 Comments Improve Suggest changes Like Article Like Report The alt attribute in HTML provides alternative text for images, aiding accessibility and providing context for screen readers.Syntax:<img src=" " alt=" " > HTML <html> <body> <h1>GeeksforGeeks Logo</h1> <img src="https://media.geeksforgeeks.org/wp-content/uploads/20190506164011/logo3.png" alt="GeeksforGeeks Logo"> </body> </html> The alt attribute in the <img> tag provides descriptive text ("GeeksforGeeks Logo") that displays if the image fails to load, enhancing accessibility.Supported tags:Name Descriptionarea<area>'s alt provides alternative text for image map areas.image<img> alt offers alternative text for image accessibility.inputspecify the alternative text for an image when the image attribute is not displayed.<applet>used to specify the alternate text for an applet element.Attribute Values:value Descriptiontextis used to specify the alternative text for the supported element if the image is not displaying.More Example of HTML alt attribute Image Input with alt Attribute HTML <html> <body> <form action="/submit" method="post"> <label for="username">Username:</label> <input type="text" id="username" name="username"><br><br> <input type="image" src="https://media.geeksforgeeks.org/wp-content/uploads/gfg-40.png" alt="Submit" width="48" height="48"> </form> </body> </html> In this Example:The <input type="image"> element creates a submit button with an image.The alt attribute provides alternative text ("Submit") for the image button, ensuring functionality and accessibility if the image fails to load.Image Map with alt Attributes HTML <html> <body> <img src="https://media.geeksforgeeks.org/wp-content/uploads/20190227165729/area11.png" alt="Geometric Shapes" width="300" height="119" usemap="#shapemap"> <map name="shapemap"> <area shape="poly" coords="59,31,28,83,91,83" href="#triangle" alt="Triangle"> <area shape="circle" coords="155,56,26" href="#circle" alt="Circle"> <area shape="rect" coords="224,30,276,82" href="#square" alt="Square"> </map> </body> </html> In this example:The <img> tag displays an image of geometric shapes and uses the usemap attribute to define an image map.Each <area> tag within the <map> element defines a clickable region with a corresponding alt attribute, providing descriptive text for each shape.Best Practices for HTML alt AttributeBe Descriptive and Concise: Provide clear, brief descriptions that convey the image's content or function, aiding users and search engines in understanding its relevance. Avoid Redundancy: Refrain from using phrases like "image of" or "picture of," as screen readers already announce the presence of an image. Use Empty alt for Decorative Images: For images that don't convey meaningful information, set alt="" to allow screen readers to skip them, enhancing accessibility. Comment More infoAdvertise with us Next Article HTML async Attribute V Vijay Sirra Follow Improve Article Tags : Web Technologies HTML HTML-Attributes Similar Reads HTML accept Attribute HTML accept Attribute specifies the type of file that the server accepts. This attribute can be used with <input> element only. This attribute is not used for validation tools because file uploads should be validated on the Server.Syntax:<input accept = "file_extension"> Note: This attri 3 min read HTML accept-charset Attribute The accept-charset attribute is used to define the character encoding and is used for form submission. The default value of the accept-charset attribute is "UNKNOWN" string which indicates the encoding equals to the encoding of the document containing the <form> element. Syntax:<form accept 2 min read HTML accesskey Attribute The HTML accesskey attribute defines a keyboard shortcut to activate or focus an element.It assigns a keyboard key combination to trigger an element (like a link or button).Browser support and specific key combinations vary (e.g., Alt + key on Windows, Ctrl + key on macOS).Use it sparingly and provi 3 min read HTML action Attribute The HTML action attribute is used to specify where the form data should be sent on submission. It allows the browser to send the data to the specified location, enabling server-side scripts to process the data and generate a response.Note: It can be used in the <form> element. Syntax:<form 3 min read HTML align Attribute In HTML, the align attribute is used to control the alignment of elements on a webpage. Whether it's for text, images, or tables, the align attribute helps to position content in relation to its surrounding elements.Syntax<element_name align="left | right | center | justify">Attribute ValuesAt 4 min read HTML alt attribute The alt attribute in HTML provides alternative text for images, aiding accessibility and providing context for screen readers.Syntax:<img src=" " alt=" " >HTML<html> <body> <h1>GeeksforGeeks Logo</h1> <img src="https://media.geeksforgeeks.org/wp-content/uploads/20190 3 min read HTML async Attribute The HTML <script> async attribute is used to load and execute external scripts without blocking the rest of the page from loading. This speeds up page load times. It only works with external scripts (when the src attribute is present).Syntax:<script src="path-to-script.js" async></scr 3 min read HTML autocomplete Attribute The HTML autocomplete Attribute is used to specify whether the input field autocompleted would be on or off. When the autocomplete attribute is set to on the browser will automatically complete the values based on what the user entered before. It works with input fields such as text, search, URL, em 3 min read HTML autoplay Attribute The HTML autoplay Attribute, a boolean attribute, enables audio or video elements to start playing automatically when the page loads, providing seamless playback without interruption.Syntax: <element autoplay> Supported ElementsIt can be used with <audio> and <video> elements. Elem 2 min read HTML autofocus Attribute The HTML autofocus attribute is a powerful tool that enhances user experience by automatically setting the focus to a specific element when a webpage loads. Syntax<input type="text" autofocus> Note: This attribute is boolean, meaning it can either be present or absent.Supported TagsElementPurp 2 min read Like