Learn HTML by Building a Cat Photo App - Step 9

Tell us what’s happening:

Describe your issue in detail here .
Hello ?
I don’t understand what the alt attribute means . l keep trying but
I cannot understand what I missed.

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>See more cat photos in our gallery.</p>

<!-- User Editable Region -->

      <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg">
     
      <img src ="cat.jpg" "alt=A cute orange cat lying on its back"> 
      
      
      
      

<!-- User Editable Region -->

    </main>
  </body>
</html>

Your browser information:

User Agent is: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/118.0.0.0 Safari/537.36

Challenge Information:

Learn HTML by Building a Cat Photo App - Step 9

Welcome to the form.

There are just a few minor errors in your code.
image
First, you seem to have created two img elements. Second, the alt attribute is not quite right.

Alt attributes are used in image elements, in case there is a problem loading the picture into the browser. They provide a description of the image so the user can get some context, even if they cannot see the image.

The double quote needs to be move from the front of alt to after the equals sign.

eg. alt=“a sunny day”

From the second line delete <img src =“cat.jpg”
Move the second line onto the first line. You will need to delete the last angled bracket from the first img, until you have just one line of code.

Happy coding

3 Likes

Hello @awinjalucy.la !

Here is an article that explains the alt attribute and provides great examples.

Happy coding!

3 Likes

Thanks for the help​:open_mouth::smile:

2 Likes

Thanks for your help :smile::grin:

2 Likes

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.