Images & links

I have taken the HTML course because I was unable to discover why my images and links could never be found.

I have done the excercises on the website and they all work ok, but when I replicate the code in my own HTML documents, the links and images don’t work. Even the external reference to the codecademy jpg failed.

I have made sure that the HTML and image files are in the same folder on the same drive, but this still does not help.

Is there a way to determine where my browser is looking for these images?

How else can I determine why my images and links never work?

Thanks

Foggy

3 Likes

Could you send your code here(copy and paste)

2 Likes
<DOCTYPE HTML!>
<html>
<body>
<h1>The Brown Bear</h1>
  <h2>About Brown Bears</h2>
  <h3>Species</h3>
  <h3>Features</h3><div>
<p> Alan progressing </p>
<p>"The brown bear (Ursus arctos) is native to parts of northern Eurasia and North America. <br>Its conservation status is currently Least Concern. There are many subspecies within <br>the brown bear species, including the Atlas bear and the Himalayan brown bear."</p>
</div>
<div>
<ul>
<li>Arctos
<li>Collarus
<li>Horribilis
<li>Nelsoni (extinct)</ul>
<ol>
  <li>Preheat the oven to 350 degrees.</li>
  <li>Mix whole wheat flour, baking soda, and salt.</li>
  <li>Cream the butter, sugar in separate bowl.</li>
  <li>Add eggs and vanilla extract to bowl.</li>
</ol>
<p> Another DIV </p>
<img src=“https://s3.amazonaws.com/codecademy-content/courses/web-101/web101-image_brownbear.jpg” alt=“not here”/>
    <a href='https://developer.mozilla.org/en-US/docs/Web/HTML'>Mozilla
    Developer Network</a><br>
<a href=’shop-en.html'>Shop
    page</a>
</div>
</body>
<html>
1 Like

Well, first of all On the top It’s: <!DOCTYPE html>
You forgot to close html: </html>
And It can be codecademy but strings weren’t straight strings(you used “”, instead of "")
But I corrected these things and it works for me:
image

Here's the corrected code(just in case)
<!DOCTYPE html>
<html>
<body>
<h1>The Brown Bear</h1>
  <h2>About Brown Bears</h2>
  <h3>Species</h3>
  <h3>Features</h3><div>
<p> Alan progressing </p>
<p>"The brown bear (Ursus arctos) is native to parts of northern Eurasia and North America. <br>Its conservation status is currently Least Concern. There are many subspecies within <br>the brown bear species, including the Atlas bear and the Himalayan brown bear."</p>
</div>
<div>
<ul>
<li>Arctos
<li>Collarus
<li>Horribilis
<li>Nelsoni (extinct)
</ul>
<ol>
  <li>Preheat the oven to 350 degrees.</li>
  <li>Mix whole wheat flour, baking soda, and salt.</li>
  <li>Cream the butter, sugar in separate bowl.</li>
  <li>Add eggs and vanilla extract to bowl.</li>
</ol>
<p> Another DIV </p>
<img src="https://s3.amazonaws.com/codecademy-content/courses/web-101/web101-image_brownbear.jpg" alt="not here"/>
<a href='https://developer.mozilla.org/en-US/docs/Web/HTML'>Mozilla Developer Network</a><br>
<a href='shop-en.html'>Shop page</a>
</div>
</body>
</html>

Hope this helps :grinning:

2 Likes

Thanks for that. Your solution worked perfectly.

So I had:
(A) Got the format of the DOCTYPE command wrong
(B) Failed to close the HTML tag, and
© Used the wrong quotation marks, which is a BIG surprise. First of all I did not know that there were other quotation marks, and the ones I had used had worked in every other tag, but more importantly, my keyboard has no other quotation marks on it.

So, my questions are:

How does one know when HTML requires a character that is different from the one provided by a default keyboard.?
How does one find out exactly which characters are used in HTML tags?
How does one find out which characters are being generated by their keyboard by default?
How does one create the correct character for the tag to work?

These questions seem pretty fundamental to me but I have not seen any reference to them in any of my HTML browsing, but I have seen thousands of complaints about images not loading, many of which could have been caused by this quirk.

(less)Foggy

2 Likes

By taking the course, you find out all about the tags needed. HTML is simple is you know the basics. The beginning tag has no slash, bug the end one does for most tags. For example:
<p>Text</p>

Some people may have browser issues or mess up something with the tag. Or some images can’t be put on certain sites.

1 Like