Web Design: Food for Thought

Inline Images...

   Inline images are, obviously, a very good way to express an idea. Unfortunately, most images are very large when compared to the source code. You should carefully consider which images should be included in your page. You should, also, make sure that most or all of your images stay under 30 KB. You should add the entire size of your page to see if it is a suitable size. You can find the entire page size by adding the sizes of each unique file. If an image is used in several places on that page then it would only be counted once. Avoid animated images anywhere possible. They can be easily overused and very distracting. They are, also, much larger than normal images. You can estimate the 14.4kbps (The most common Internet connection speed) download time of a page by multiplying the number of kb by 1 second. (e.g. 14kb * 1 second = 14 seconds) 2 Some professional HTML editors such as Microsoft Front Page 97 will estimate the 28.8kbps download time for you and display it in the status bar of its window.

   Always set the height, width, and alt attributes in your HTML source code for an image. Text loads faster with image height and width set. The browser will insert a place holder an image if it can pre-determine the height and width. This way the page is not constantly recalculating itself to make room for the images. Make the alt text something that describes the image. If the image is fancy text. Put exactly what the texts reads as the alt text. Don't put "fancy text banner" or "must have image capability" as alt text. This is really annoying to many viewers. They know it is an image. Lynx, for example, inserts <INLINE: alt text> in place of the image. Those with image capable browsers whom have turned off their images to enhance loading speed have to get inside of their browser and fiddle with settings to figure out what you are saying.[See: Browser settings]

   Do not waste precious time and disk space with a separate text-only page. You have a problem if you need to do this. You should address the problem rather than providing a link to another page. Every provision is made in HTML to allow a text-only browser to view a properly designed page that is full of images.

   Image file size can be reduced, easily. There are many techniques, beyond the scope of this page, to reduce file size without harming the image. Check back in the future as I will attempt to link to a few good tutorials on reducing image size.

   Do not use copyright material in your pages without express permission of the owner. Don't take an image from someone else's page and place it on yours. Contrary to popular Internet belief, It is illegal to steal images off of the Internet and use them without permission. Depending on what graphics software you have, you may be able to access the copyright info on an image. There are header files at the beginning of each image. These header files are supposed to contain the copyright info. If it does not contain a Header then I would contact the author of the page before using it. It is safer to simply not use the image if it is without a header. If it does contain header info then it may tell you how to go about legally using it in your page. For instance, many authors will state in the header, "You may freely use this image as long as it is not modified in any way and visible credit is given to John Q. Smith, johnnyboy @ smithvalley.com somewhere on the page this image resides or a separate page within one link from the page that the image resides". I try to make a separate credits page if I have many sources for page components. If there are few sources then a simple statement at the bottom of that page would be appropriate. Let good judgement be your guide.