Home Basics of HTML Handling Text Handling Images HyperLinks The COOL! Stuff


Images are easily added to webpages. One important thing to remember is to upload your image with your webpage. For example: If you have a page with a picture on it, you must upload the page and the picture in order for it to work properly.

You should also know that the most common types of images that are on the Internet are either: GIF or JPG (JPEG). I suggest you use GIF format becuase they are typically smaller (file size) and will look the same on most computers. JPG's have their advantages too. For example, JPG's offer higher colors and high compression. It is up to you which you use. Here are some suggestions:

  • Common Webpage Graphics
  • Buttons
  • Low Resolution Photos
  • Low-color graphics (Less than 256 Colors)
  • High Resolution Photos
  • High-color graphics (More than 256 Colors)

For more about image design, click here.

Consider the following code.

Here is my favorite picture: <IMG SRC="images/mypicture.gif">

Here is what the line of code looks like.

Here is my favorite picture:

Thats all there is to it to adding an image to your webpage. Just enter the code: "<IMG SRC="mypicture.xxx">" Where 'mypicture.xxx' is the name of you picture file.

In order to make images, you need a graphics program. You can spend anywhere from a $1400 to $50 for a graphics program. I recommend Paint Shop Pro by JASC Software (http://www.jasc.com). Paint Shop Pro is shareware. I think it costs around $100 to purchase. I beleive it is well worth it.

So lets say you have a graphics program. There are a few things to keep in mind when you are designing graphics for your website:

  1. Watch files sizes. Everyone doesn't have a fast Internet connection.
  2. Try to keep make your pictures with less than 256 colors so people with older video cards can see your page as you do.
  3. If your page has a lot of pictuers, design a "Text-only" version of your site.