How To Place an Image Into Your Page
Images, if proplerly used, can really make your page look nice. If they aren't used right they can make your page difficult to load,hard to read, and just plain annoying. Here are the "a-b-cs" of images on the web. These are things that must be true if you want a nice webpage, enjoyable, relatively quick loading page.
- The file must be in the GIF or JPG format. If it is the filename for the file should look like "filename.GIF" or "filename.JPG". Some other common image formats are PICT, TIFF and RIFF. Note: Just by changing the file extension, the letters after the period, you are not changing the format. All you will have done is have a picture in the original format that is incorrectly labled.
- Make sure that the image isn't too big either visually or in the filesize itself. No image should take up more than a third of the screen width-wise (and even that is excessive) and you shouldn't have to scroll too far down to see the whole thing. IF you do want to have a large picture up make a very small "thumbnail" of the image that a person can click on to bring up a seperate page with the image on it. As to file s ize, keep it as small as possible for quick loading. Anything over 200K is probably excessive.
- If it is a background image, be sure that the colors are sublte and the image itself isn't so defined that you can't read text against it. A rule of thumb is if you have to strain to read it, even a little, then the background isn't a good one.
Examples of Image Tags:
The HTML code to place a background image looks like this:
<BODY BACKGROUND="filename.jpg">
You place this tag right after the <HTML> tag at the top of the document. A background image does not have to be large, they usually look something like this:
The browser will then tile these images to fit the screen, just like wallpaper on your desktop on your computer.
To Place A Regular Image:The HTML code to place a regular image looks like this:
<img src ="filename.jpg">
You can also "align" the image in relation to the text on the screen. It can be aligned to the left, right and into the center of the text. An image tag with an alignment command added to it looks like this:
<img align = left src = "filename.jpg">
Place your cursor where you want your image to be. Then type the HTML code for an image. This will put an image in that spot.