Alt attribute in img not recognized

Challenge Name

Add Images to your Website

Issue Description

Tests do not recognize the alt attribute in the img element (see code below). I think it has something to do with the hyphen? Seems to work fine with an alt that doesn’t have it.

Browser Information

• Browser Name, Version: Chrome 61.0.3163.100
• Operating System: Windows 10
• Mobile, Desktop, or Tablet: Desktop

Your Code

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>

<img src="https://bit.ly/fcc-relaxing-cat" alt="Cute upside-down kitten. ">

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Screenshot

[username1001]

@thefifthisa I did some more digging because I had the same questions as you after reading your issue. It seems that alt attributes should not use hyphens, and the reason behind this is SEO i.e. someone isn’t going to do a search for ‘cat-image’, rather they’ll search ‘cat image’.

I think it should still pass the test, so you’re right, the issue may be with FCC; though, I’m not an expert and would love to hear someone else’s explanation.

[raisedadead]

@angelfeliz

Thanks for your interest in fixing. I think we do not need italicizing here.

Lets keep it like so;

All img elements must have an alt attribute. The text inside an alt attribute is used for screen readers to improve accessibility and is displayed if the image fails to load.

Ideally the alt attribute should not contain special chars unless needed.

That said, you would also have to work on the tests that are failing for special chars.

Happy coding!