Probably the most important thing to consider when using graphics on a WebBuild Express page is to keep the page size small. The more graphics you have and the larger they are, the longer it will take for your pages to appear for many users, especially those with slower connections to the Internet.
A rough rule of thumb is that 3,000 bytes will take about a second to load on a dial-up connection (which, unfortunately, many visitors to most sites still use). That means that a 21,000 byte photo would take approximately seven seconds to load. A page that has many such graphics may load so slowly that some visitors to your site give up before they see it as you intend them to.
Fortunately, WebBuild Express gives you a number of features you can use to create graphically-interesting pages without incurring huge download times. By making it easy to employ cell background colors, borders, and text formatting, WebBuild Express can help you create pages that have a very few small image files and that will consequently load quickly on most visitors' browsers.
The following are some tips and tricks for using graphics in a WebBuild Express page:
Use Graphics Utilities to Shrink File Size
There are a number of good graphics utility programs available at little or no cost that you can use to create graphics that load as quickly as possible.
A listing of free utilities can be found at:
http://graphicssoft.about.com/cs/freeimageeditpc/index.htm?once=true&
Although these graphic utility programs differ in their operation, in general there are two surefire ways to reduce file size:
1) Reduce the height and width of the graphic, and
2) Use compression.
If you use compression, you sacrifice clarity and resolution, but you get a graphic file that will load much faster. Consider the following four images:
Picture 1, the original, is 42 kilobytes in size, which could take 14 seconds to load on a slow Internet connection. This image is probably too big for most Web pages, especially if there are other graphics on the page.
Picture 2 is the same size, but has been saved with 10% compression. It is 10 kilobytes, a 76% reduction from the original. There is a slight, almost imperceptable loss of resolution.
Picture 3 is the same size, but compressed at 40%. It is now 7 kilobytes, an 83% reduction in file size. It is a little "fuzzier"; some clarity has been lost. Notice especially the sky, which in the first two pictures fades gradually from darker to lighter, now shows bands of color as the eye moves down the picture.
Picture 4 has been reduced in size to 150 x 230 pixels and compressed to 33%. Its size is now 5 kilobytes (an 88% reduction from the original), which should load very quickly. Its resolution is probably good enough for most purposes.
In general, you should try different compression ratios and sizes for each image on your Web page until you can find the best tradeoff of file size and clarity.
Use Cell Background Colors, Borders, and Text Formatting
WebBuild Express offers a number of features you can use to give a rich graphic appearance to your pages without using any image files.
Consider the following examples:
The graphic on the left was created almost entirely using WebBuild Express formatting techniques. There is a small image used as the cell background: , but otherwise, all the graphic effects are acheived through cell border and text formatting. As you can see, there is a considerable saving in the amount of data required for the two examples -- the example on the left will download more than twice as fast as the one on the right.
Another technique that can produce vibrant graphic effects is the use of overlaid cells (see "Overlaying Cells"). Effects like the following can be created using overlaid cells with virtually no effect on the time taken to download the page:
|
|
