Problem Statement
What is the primary purpose of the alt attribute in an img tag?
Explanation
The alt attribute provides alternative text that describes the image. This text serves multiple important purposes. First, it is displayed if the image fails to load due to a broken link, slow connection, or missing file. Second, screen readers use alt text to describe images to visually impaired users, making your website accessible. Third, search engines use alt text to understand image content, which helps with search engine optimization. The alt attribute is required for valid HTML and should always be included with img tags. Even if an image is purely decorative and does not convey information, you should include an empty alt attribute like alt equals empty quotes. This tells screen readers to skip the image. Writing good alt text is important. It should be descriptive and concise, typically under 125 characters. Describe what the image shows, not just its name.
Code Solution
SolutionRead Only
<!-- Descriptive alt text --> <img src="sunset.jpg" alt="Orange sunset over the ocean with palm trees"> <!-- Product image --> <img src="laptop.jpg" alt="Silver laptop with 15-inch screen"> <!-- Logo --> <img src="logo.png" alt="Acme Corporation logo"> <!-- Decorative image (empty alt) --> <img src="decoration.png" alt="">
