Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML How to Make a Website Creating HTML Content Organize with Unordered Lists

Robert Davey
Robert Davey
503 Points

Ah, but I have added an image tag. Haven't I?

Every time I get to step two of the challenge following How to Make a Website...the section wherein he gets the list of 5 images and adds captions... I get an incorrect and the suggestion that I haven't added image tags. I think I have, though. Certainly it displays correctly.

Is there something wrong with my code? Some glitch? Something I am missing?

Thanks in advance.

index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Nick Pettit</title>
  </head>
  <body>
    <header>
      <a href="index.html">
        <h1>Nick Pettit</h1>
        <h2>Designer</h2>
      </a>
      <nav>
        <ul>
          <li><a href="index.html">Portfolio</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>
    <section>
      <ul>
        <li>
          <a href="img/numbers-01.jpg">
            <img src="img/numbers-01.jpg" alt="">
          </a>
         </li>
        <li>
          <a href="img/numbers-02.jpg">
            <img src="img/numbers-02.jpg" alt="">
          </a>  
        </li>
        <li>
          <a href="img/numbers-06.jpg">
            <img src="img/numbers-06.jpg" alt="">
          </a>
        </li>
      </ul>
    </section>
    <footer>
      <p>&copy; 2013 Nick Pettit.</p>
    </footer>
  </body>
</html>

2 Answers

The issue was with the links surrounding the images that shouldn't be there. Removing the anchor elements passes the challenge. Alt attributes do not require content in the tags in order to validate, anyways; they only have to exist in the img element, although it is a very good idea to actually put text into these for accessibility purposes such as screen readers.

    <section>
      <ul>
        <li>
           <!-- notice there are no a elements -->
           <img src="img/numbers-01.jpg" alt="">
        </li>
        <li>
           <img src="img/numbers-02.jpg" alt="">
        </li>
        <li>
           <img src="img/numbers-06.jpg" alt="">
        </li>
      </ul>
    </section>
Robert Davey
Robert Davey
503 Points

That did it, thanks! I thought I had gotten rid of those before to see if it worked, but I just did it and the completionist in me is happy. Thanks again.

Excellent! :) You may have missed the ending </a> tags or something, but nonetheless, awesomesauce!

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,252 Points

Looks okay structurally. But all images really should have something in their alt attributes. Try putting something in those. :-)

And just to be on the safe side, self closing your image tags like this

<img src=""  alt="alt tag" />
Robert Davey
Robert Davey
503 Points

Thanks for taking the time! The teacher does have us leaving those blank in the code we write so far, and it said in the test to leave them blank, but I tried it. No luck. I would honestly be tempted to say the test it glitched if it didn't sound too much like a noob calling out a pro as a hacker in an fps. :) Not the only one with the problem:

https://teamtreehouse.com/forum/in-how-to-make-a-website-i-added-3-images-and-when-i-preview-it-shows-that-i-added-three-images-but-i-cant-go-on

Thing to do may be to move on to the next lesson...the completionist balks...