Our Collection Of Articles
Optimizing Your Web Site To Load Faster
Written By: Dave Tan
Is your website taking forever to load because of all the
heavy graphics you're using? How long does it takes for a modest
DIALUP user to wait patiently for a website to completely
load up on his/her browser? 60 seconds? 30 seconds?
While 30 seconds is statistically tolerable, practically every
users (especially 56K or slower modem users) don't have that much
patience online and will just click off your website if it does
NOT load within 20 seconds or less!
If you're using a lot of HEFTY web images and flash
files on your website (especially on the homepage), you could
be in a very disadvantageous and dangerous position! You might
risk losing potential customers with slower connection and quite
frankly, wouldn't that spoil the buying mood of your visitors?
A lot of people are still surfing the internet for information
using a simple modem. Unless you're running a website that focuses
a lot on graphics like game review websites or if graphics are an
important part of your product, avoid using huge graphics.
If you really have to use HUGE and HEAVY graphics,
try SLICING them into smaller images or converting them in
an optimized format.
Here are two popular formats that's widely used on the net
to display images:
GIF (Graphics Interchange Format) is highly suitable
for images with less than 256 colors - usually for flat graphics
that is simple like your company logo, navigation buttons, etc.
JPEG (Joint Photographic Expert Group) is the best format
for images with photographic elements - graphics like scenery, a car,
a person face, etc.
If you optimize your graphics accordingly, you could actually cut
down your loading time to as high as 50-70 percent! If your previous
loading time is 30 seconds, you could actually end up with only 15
seconds! Isn't that great for your visitors?
Of course, there's a trade-off between quality and size when you
optimize your web graphics. The smaller the size, the lower the
quality and vice versa. The key to web graphics optimization is to
get the best quality with a reasonable file size.
How about TEXT? Is one of your pages using too much text
and the loading time is somehow impossible to complete within 20
seconds? What do you do? Separate them into smaller web pages? Well,
how about using tables?
That's right, try designing your website in tables! Put each
chunk of text into a different table (not table within table),
it's easier to manage this way and your web page will load so much
FASTER!
Your website will be displayed progressively from the first table
to the last one remaining thus giving your visitors something to
look at while waiting for your website to load up completely.
Here's a sample of the code:
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
HTMLHEAD
TITLEUsing Tables For Faster Loading Time/TITLE
meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"style
type="text/css"
!--
body {
background-color: #CCCC99;
}
--
/style/HEAD
BODY
strong!--Here's Table #1--/strong
table width="510" border="0" cellpadding="0" cellspacing="0" class="normal"
tr
td valign="top" class="chapterCenter"h1A
Sample website Using Tables To Progressively
Load Contents Or Text/h1
p /p/td
/tr
/table
strong!--Here's Table #2--/strong
table width="510" border="0" cellpadding="0" cellspacing="0" class="normal"
tr
td valign="top" class="chapterCenter"pThis
table (table 2) will load right
after the headline which resides in table 1 "A Sample website Using
Tables
To Progressively Load Contents Or Text"/p
p /p/td
/tr
/table
strong!--Here's Table #3--/strong
table width="510" border="0" cellpadding="0" cellspacing="0" class="normal"
tr
td valign="top" class="chapterCenter"pThis
table (table 3) will load right after
table 2 above. /p
p /p/td
/tr
/table
strong!--Here's Table #4--/strong
table width="510" border="0" cellpadding="0" cellspacing="0" class="normal"
tr
td valign="top" class="chapterCenter"This table
(table 4) will load last because
it's the last table on this web page before the closing tags </BODY></HTML>/td
/tr
/table
/BODY/HTML
Here's a preview of the website using the HTML code above:
img src="images/progressive_sample.gif" border="0" width="460" height="232" alt="A sample website using tables to progressively load contents or text."
This will allow your web page to load and display
progressively (firstly from table 1, then table 2, then table 3 and
lastly table 4), giving your visitors something to read
WITHOUT having to WAIT for the entire web page to load up
completely!
Note: Do NOT use nested tables (table within table)
though because it will not have the same effect and will definitely
load slower because the browser needs to completely load the main table
before loading the any tables within it. Nested tables are HARD
to manage too!
That's all for this article, have fun optimizing your website
loading speed!
Best Regards,
Dave Tan
eBookOK.com
------------------------------------------------------------
Get fresh, weekly, up-to-date Internet Marketing Power Tips
and Exclusive eBooks that will give you an unfair edge over
your competitors here:
http://www.ebookok.com/
------------------------------------------------------------
|