Where should i put the alt

HTML-CSS
#1

Tell us what’s happening:
Im confused where to put the alt

Your code so far


<img src=http://bit.ly/fcc-relaxing-cat



><h2>CatPhotoApp</h2>
<main>
  
  
  <p>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>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
</main>

Your browser information:

User Agent is: Mozilla/5.0 (Linux; Android 5.1.1; SM-J120ZN Build/LMY47X) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.91 Mobile Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/add-images-to-your-website

#2

Alt is an attribute. Attributes go inside tags so

<img src="" alt="" />

(also you need to move up you > and use some quotes around your link.)

1 Like
#3

Should i place it at the end or the start

#4

Order of attributes generally doesn’t matter, although traditionally src goes before alt

1 Like
#5

What should i put in the Alt

#6

A short description of what the image shows. There is no “right” answer here. The alt attribute is used by screen-readers to help those, who can not see, understand what the image is conveying.

1 Like
#7

Actually there is a right answer as far as accessibility is concerned.

if you have text in the image, you should put that text in the Alt. If you don’t you have a choice. If you want someone who uses a screen reader to “see’ the image, you need to describe the image in the alt. If you don’t you can leave the blank by just using alt=”" . the screen reader will then skip over the image.

You should always include the Alt though. if you don’t a screen reader will read the code and/or url to the user making for a bad experience.

1 Like
#8