Checklist for solving problems in broken URL and missing images

Posted on Jan 19, 2011


Imagine this: You’re new to web design and you’ve got a web hosting account with Doteasy. You’ve decided to custom build your website using an html editor and then you’ve uploaded the files to the server via FTP. At this point, you’re feeling pretty good because the website is done, you loaded up your web browser to do the final checking and………

  • 404 – Page Not Found
  • broken URL links
  • some images are missing from the page

How would you feel at that moment? Panic? Puzzled? Frustrated?

Is the above scenario familiar to you? Most of the time, the issue was caused due to some simple mistakes and it can be
corrected fairly easily (if you know where to look for them that is).

Here’s a mini-checklist which may help solve those issues:

1) Put the files in the root folder

Most hosting server will have a specific location for files to upload. For the newer Doteasy hosting client, that would be the ‘public_html’ folder. So if you uploaded files but didn’t place it inside that folder, the server will not read it properly and your web pages will not display in the Internet.

2) First page/homepage has to be called ‘index’

When a visitor goes to your website, the very first page the hosting server will load is the ‘index’ file (index.htm, index.html, index.php, etc.). If you do not have a page named ‘index’ in your website, your visitor will see an error page.

3) Folder/file names are case sensitive

In the hosting server point of view, ‘image.JPG’ and ‘image.jpg’ are considered two different names (even if the beginning part is the same). So when you are inputting an URL, please make sure the URL matches exactly as the name on the server – both folder name and file name.

To keep it simple, usually it’s best to leave everything lower case.

4) Spaces/special characters in folder/file name

Generally, it is best not to use spaces/special characters in URL. This is because URL can only display characters that are within the ASCII character-set. If there are any other characters, the URL encoding will replace the unsafe ASCII characters with “%” followed by two digits to correspond that character. For example, the code for space is ‘%20’, so if you have a file named ‘contact us.htm’, the URL encoding will change it to ‘contact%20us.htm’.

Although the URL WILL work with spaces/special characters, reading an URL with those ‘%’ is very difficult and it leaves room for error. If you want to separate words between folder/file name, it is much better to use an underscore ‘ _ ‘ as the underscore is a character within ASCII character-set.

5) Check source URL

This last point ties in with 3) & 4); when you are creating links or setting up an image, the source (in html code – src=” “) URL has to be correctly match with the folder/file name and location. For example, if you have an image ‘home.jpg’ within a folder ‘image’, the image source URL should to be ‘/image/home.jpg’ . If anything is modified (eg. changed file name, moved the file, changed folder, etc.), you will have to adjust the source URL accordingly or else it will become a broken link (indicated as the red ‘x’ in Internet Explore)

We hope the above mini-checklist will help you new web designers and relieve some of the frustration from not able to see the website.

Comments

comments