Pls can anyone help me on how to improve accessibility of image added and how to add alt attribute to the text "five cats looking around a field"

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**

<html>
<body>
  <h1>CatPhotoApp</h1>
  <main>
    <section>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
      <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
    </section>
    <section>
      <h2>Cat Lists</h2>
      <h3>Things cats love:</h3>
      <ul>
        <li>cat nip</li>
        <li>laser pointers</li>
        <li>lasagna</li>
      </ul>
      <figure>
        <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
        <figcaption>Cats <em>love</em> lasagna.</figcaption>  
      </figure>
      <h3>Top 3 things cats hate:</h3>
      <ol>
        <li>flea treatment</li>
        <li>thunder</li>
        <li>other cats</li>
      </ol>
   <figure>
        <figure><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field"</figure>
      </figure>
    </section>
  </main>
</body>
</html>
  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.67 Safari/537.36

Challenge: Step 29

Link to the challenge:

"… add an alt attribute with the text Five cats looking around a field"

There is an example of how to add an alt attribute in the other two images you added earlier.

I have done that still not giving me the code…pls help me detail it…tnx

<img alt="Five cats looking around a field."
          src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg"> 

I guess it wants you to put the alt first

lmao I posted the pic but put the alt attribute first then the src

You have an extra figure element you have to delete that, You also forgot to close the img element.

Hi @EyeAmStrange !

Welcome to the forum!

The tests aren’t that picky.
You can place the alt attribute wherever in the img tag. :slight_smile:

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

1 Like

it def had me put it first and it submitted it

I tried putting the attribute at the end and it didn’t work numerous times

works on my end

Perhaps there is a typo on your end?

I appreciate the feedback! I didn’t think it mattered but it was def picky with me. I tried putting the Alt last and it wouldn’t submit for me

Are you sure your syntax is correct, the alt as the last attribute does work for me, have you tried in a different browser.

1 Like

don’t think it would have went through if there was a typo. idk the way I put it in works though

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