question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Question mark in value of alt-attribute leads to failed test

See original GitHub issue

Challenge Add Images to your Website has an issue. User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.82 Safari/537.36.

The third testing-spec, Your image element must have an alt attribute. of this Challenge breaks, as soon as the user puts a question-mark into the value of the alt-attribute. Removing the question mark leads to a instant pass.

My 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="Can i haz webpagez?">

<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>

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:13 (8 by maintainers)

github_iconTop GitHub Comments

2reactions
dhcodescommented, Aug 1, 2016

@Locheed @LodeScreen42 I changed the Regex to accept any character so it should be good to go once my PR gets merged and posted.

1reaction
dhcodescommented, Jul 28, 2016

I’ll fix this one.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Accessibility: Image Alt text best practices - Siteimprove Support
The following image contains a link that leads to Siteimprove's webpage and is shown without any other link text. It has the alternative...
Read more >
5566 – ALT attribute value sometimes not displayed when ...
If I have an IMG tag with a none empty ALT attribute, then the text is not displayed if the image is missing....
Read more >
What does this warning message mean? 'img elements must ...
It means when you create an image in your HTML, you should include an alt attribute for the benefit of screen readers and...
Read more >
Images must have alternate text | Axe Rules - Deque University
Ensure all informative <img> elements have short, descriptive alternate text and all decorative <img> elements have empty alt attributes (e.g. alt="" ).
Read more >
HTML img alt Attribute - W3Schools
Attribute Values. Value, Description. text, Specifies an alternate text for an image. Guidelines for the alt text: The ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found