How do I explain this - HTML page did not show image because server was started at wrong folder level


This is a very basic query. I created two folders - html and img at same level inside a folder.

I have an html page with an img element and I started a simple python server on port 4700 to show the page at localhost:4700 at the level of the html folder. However, the image was not shown because the server was started inside the html folder and the image inside image folder was not shown.

How do I explain this in a better way?

Hello @anantakrroy.

  • It seems like from your explanation that you have your image in a different directory.
  • What you can do is if it’s in the same directory as the html file, you can add the directory name infront ex:
//if directory name is Images
<img src="/Images/image.jpg">
  • If it is one directory before you can use .../directory-name, ex:
//If it is in a folder before the HTML
// Desktop -> Images, HTML -> index.html
<img src=".../Images/image.jpg">
<img src="directory-you-copied">
1 Like

This was a very poorly framed question by me I realised after reading the solution that you provided. I wanted to know which files and folders does a server have access to when started? Its clear that the server does not access files and folders outside of where its started. What decides this and any resources regarding this? Thank you for the detailed explanation!

Hey @anantakrroy,

Sorry for the late reply, this only applies for HTML. The server will only use the files where the main HTML file is. So if your image is in a folder in the same directory as your HTML, the server will carry out that image. Here’s what it looks like image

1 Like