HTML HTML Basics Going Further with HTML Working on a Website Project Locally

Katelyn Ferreira
Katelyn Ferreira
1,524 Points

Can anyone tell me why none of the images will load even when I add the ../../ or just ../ or / Thanks in advance!

It also wont connect the articles page when I alter the text so if I click on "read more" it doesn't take me to the article page. I get a 404.

2 Answers

John Johnson
John Johnson
10,579 Points

A few things to remember, forward slash will always cause the reference to start in the root folder (in this case, the project folder). Also, the "../" simply means to go back one directory from the current working directory, so depending on what directory you're in, you may not need it.

So my question is, are you working in the home page (index.html) or the articles page?

If you're working on the home page (index.html), the path to the articles.html page would simply be "articles/2017/article.html" with no / or ../ needed.

Likewise, images used on the home page (index.html) should have a reference of "img/[image file name]"

Katelyn Ferreira
Katelyn Ferreira
1,524 Points

I worked in both pages, with correct usage of no slash for index.html, and i worked in article with ../ no images would load on either page. I could not get any links to connect from the index page to the article page, so I tried different combos of /, ../, and ../../ to see if my directory just wasn't registering the steps back properly, but to no avail. I ended up giving up on this lesson and moving forward, but if I cant fix this issue in the future with atom, I'm going to have problems going forward after this.

Matthew Holguin
Matthew Holguin
1,832 Points

I just encountered this issue as well and went through many of the questions/answers but have now come to the conclusion that you need to extract the files from the zip folder and then upload it to Atom for proper execution. Once you do this the changes you make in your index.html or article.html will finally work.

I hope this helps anyone at this stage!