Your website tells a lot about you and your product so if your website is poorly design you are sure to loose your entire investment as you will be loosing sales by
minute. In this article I have outlined some of
common problems common to website.In
age we are today, things change fast in
Internet and so if you are to keep up with your customers and to make maximise profits as a webmaster, you must be able to design and re-design your website to reflect
message you pass to your customers.
Sometimes waiting for your website designers take ages to effect this changes which you could have been able to do quietly from your home or office without having to pay lots of money to web designers and wait on
queue to get to your turn before
change can be effect. These delays result in loss of sales most of
time.
There is no way I will ever buy anything from a web site that has missing images or broken links. I mean, if this webmaster doesn't care about his web site, he probably could care less about his customers.
Getting your web site to look good can sometimes be a hair-pulling experience. Even for me, and I have been making web sites for over 5 years. I can only imagine how frustrated many newbies can get.
Let me share with you some of
common problems in designing a well-functioning web site. If you haven't made these mistakes yet - trust me: you will! Keep this troubleshooting guide handy for when you need it (and save some of your hair, too!)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 1. MISSING IMAGES ON THE PAGE 2. IMAGE LOADS VERY SLOWLY 3. IMAGE LOOKS DISTORTED 4. BROKEN LINKS 5. TEXT IS MISSING ON THE PAGE 6. VISITORS CAN'T SEE YOUR FANCY FONTS 7. TOO MUCH HORIZONTAL SCROLLING REQUIRED 8. THE TABLE IS WIDER THAN SPECIFIED 9. WEB PAGE DISPLAYS OLD LINKS AND IMAGES 10. BACKGROUND DOESN'T SHOW 11. CAN'T ACCESS YOUR HOME PAGE ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ PROBLEM 1: MISSING IMAGES ON THE PAGE
SOLUTION: There are three things that might cause this problem. You have either forgotten to upload
image to your web server, didn't link to it correctly, or
graphic is in invalid format.
1) Remember, you need to upload all
graphics that you are using on your web page, just like any other file. So if you have a "services.html" page that contains "staff.jpg" graphic, you need to upload both "services.html" and "staff.jpg" to your web server.
2) You also need to reference that image correctly. For this, you need to understand a little bit about files, folders, and directories. Basically, a file is a document. A folder (or a directory) is a collection of files.
You might have a directory on your web site called "images". Inside it you might have
"staff.jpg", "logo.jpg", and other files. Now, here is
trick: if your HTML file is located in
same folder with
graphic it contains, then here is how you refer to that image:
So far, simple, right? But let's say that your HTML file is located in
main directory, while
graphic file is located in
sub-directory. For example, "services.html" is located in
root directory of your web site so that if you type www.yoursite.com/services.html in your browser location bar, you will see it.
And let's say that you placed a graphic used on that page into a sub-directory called "images", so that when you type www.yoursite.com/images/graphic.jpg into your browser location bar, you will see that image. So how do you refer to that graphic from your "services.html" page? Here is how:
All I did was put
sub-directory (or folder) name followed by a forward slash before
graphic name.
Finally, what if you put an HTML page into a sub- directory, but leave
image in
main (root) directory? For example, your "services.html" is located in a sub-directory called "pages". And
graphic used on it, "staff.jpg", is placed in
main directory, so that when you type this address into your browser location bar, you will see it: www.yoursite.com/staff.jpg How do you refer to this graphic on your "services.html" page? You use
"previous directory" notation like this:
The browser will then know, that in order to find that graphic it needs to look in one directory below. If you are having trouble understanding
above notation, use absolute image references. For example:
Make sure you know where you placed your graphic (which folder) and refer to it as if you were accessing it from your web browser. That's it!
3) And finally, if you are not using graphics with
"JPG" or "GIF" extension, they will not appear on your web page. Use PaintShop Pro or any other graphic editor download.com) to convert your graphic from any format to "JPG" or "GIF". Broken images may also happen even if they don't have
right extension. That's because they have been created in a not-for-web format. When a graphic artist designs your logo, remind her to save it as "RGB" (which stands for "red-green-blue") or "Indexed Color" and not any other color mode (such as "CMYK"). For more information, see "Choosing
right format for your images" at http:/ ech.irt.org/articles/js206/index.htm PROBLEM 2: IMAGE LOADS VERY SLOWLY
SOLUTION: You must do your best to reduce
graphic to its minimum good-looking format. Use GIFBot to do this: http://www.netmechanic.com/GIFBot/optimize-graphic.htm Some new webmasters use a large graphic and specify a smaller size in
HTML code. That is absolutely unnecessary and will slow down your web page three times or more! For example, if you have a graphic that is 200x200 in size (pixels), and insert it into your web page like this:
...you are actually doing yourself disservice. Why not reduce
graphic in your image editor first, then place it on your web site? Doing this will speed up your site and will not distort your graphic. PROBLEM 3: IMAGE LOOKS DISTORTED SOLUTION: You probably specified incorrect size of this graphic on your web page. To find out
correct size of a graphic, right-click on it and choose "Properties" from
menu. You should see
image size (something like 110 x 200) then put
same numbers in
IMG tag:
PROBLEM 4: BROKEN LINK SOLUTION: You must fix your link so it takes your visitors to a page that exists. Links can be relative or absolute. Here is an example of a relative link (remember, I am omitting
tag brackets so you could see
actual code):