HTML Help

[Stoney]

Gents,

I'm putting a very simple website together--basically just a place holder page that shows my company logo and has a link to email my work address.  Anyway, I can't for the life of me figure out how to make the logo image appear.  I set the initial portions of the page up in Open Office using their html editor.  I put the logo into a folder labled "images".  This is the HTML source that's currently showing"

<P ALIGN=CENTER><IMG SRC="images/Website%20Logo.tif" NAME="graphics1" ALIGN=MIDDLE WIDTH=768 HEIGHT=480 BORDER=0><BR><BR><BR><BR>
</P>

The image box shows, but the link to the image itself doesn't work.  If anyone either has a remedy or can point me to a simple tutorial online I can use, I'd appreciate it.  I looked for some tutorials earlier and couldn't find anything that specifically addressed my issue.  I am, unfortunately, but a noob when it comes to HTML... 

[ghostdancer]

You have two problems.

First it is not good to have spaces or strange characters in a file name. Best practice is to either camel case the file name, or replace the space with a dash or underscore.

e.g. Website_Logo.tif

However, if your web host is on IIS (Microsoft) you are fine and that would not stop the image from showing.

The real issue is your image file is a .TIF. Web browsers do not support showing TIFs via the img tag.

Supported graphical formats are:

.png
.jpg
.gif
.bmp

A note in regards to the PNG. All modern browsers support both PNG-8 and PNG-24. PNG-24 allows for partial transparency, meaning you can make an area of your image say 25% transparent while other parts are not transparent. There are various reasons people use this (to long to get into here). However, IE6 has a problem with PNG-24 and will not show any transparency with them and instead show the transparent areas as full color.

Also while the graphical format BMP is supported not many people use it. Realistically when doing web design you use the PNG, JPG, and GIF file formats for the img tag.

Switch to one of those and that should fix your problem.

[ghostdancer]

If you want to link to a TIF file (not show the image on the page in the browser) then you just need to do a standard HREF:

<a href="images/Website%20Logo.tif">Image Name Here[/url]

And when a person clicks on it they will get prompted on whether they want to save or open the file.

[Stoney]

Thanks GD.  Drone PM'd me with a suggestion to change file formats which worked.  Now I just have to fix my "horrible image quality after the conversion to .gif problem"...  

[Shuffler]

Convert your original image to png. It'll look better.

[Stoney]

Thanks guys...I think I have it sorted now.

[ghostdancer]

Yep .. a PNG (8 bit) is 256 colors. Do a PNG (24 bit) and will pick up all the color from the TIF.

Or do a JPG. Problem with JPG is that its compression is mathematical .. so the less the image quality the smaller the file size but you start to see noticeable distortions along hard edge or high contrast areas. Try a quality of 60% on that .. you can go higher and get a better image quality (like 70%) but it will increase the file size.