| Ever
Wondered What Does $$$ Going
Down the Drain Sound Like?
How many users is your web
site losing each day? By displaying
a spinning, churning, cranking,
"loading ... please wait"
message, it could be plenty.
According to study by Zona
Research, '$25 billion is
lost each year due to slow-loading
Websites, one third of
online shoppers waiting for
web pages to download will
"bailout" after
only eight seconds.'
Those
are pretty serious numbers
people!
Weighing
the Web Pages / Time for a
Diet?
I am sure you've been
counting your calories, so
why not count your bytes too...
The only way you can do that
is by weighing your website.
For a quick page tune-up visit
WebSiteGarage,
which will compute total page
weight and check how fast
your page loads under six
modem speeds. Do remember
that page weight includes
all files that make up a page
(HTML, images, Scripts, CSS,
flash etc).
Ideal
Web Page Standards:
So now you know that your
homepage weighs say x number
of kilobytes, then what? How
do you know whether you need
to knock off the flabs or
live with it?
Jupiter Media Metrix, a well-known
web research firm, recommends
that webpages should weigh
no more than 40KB to 50KB,
which take about 8 to 10 seconds
for your page to appear over
a 56-kbps modem connection
and -- about the limit of
most people's patience.
Coolhomepages
recommends about 75K max.
(Users with too much time
on their hands will note that
CHP's home page is about 95K
- but our users are mostly
very web-savvy folks with
higher speed connections than
most, so we tell ourselves
that its not a terrible thing...)
Any slower, and you risk losing
customers, as they give up
in disgust and click away
to another site before yours
has even finished loading.
You might know it's "worth
it" to wait...your visitors
don't - and they usually don't
care.
Add
to that, the fact that an
increasing number of people
are browsing the Web using
very low-bandwidth connections,
and you've got an even more
urgent need to keep your web
pages small and lightweight.
Set
Your Own Standards:
The first step to reducing
page weight is to analyze
the size and necessity of
all elements on the page.
So don't let the 'Standards'
hold you back.
You
are the designer and the best
judge so, don't just ask yourself
"How fast should your
web page load?" but ask
"How fast does this page
need to be?" The best
way to set reasonable guidelines
is by comparing your website
to that of your competitors
and other like-sites.
And
once you are done with that,
set your own standards and
'Stick To It' (a li'l bi(y)te
here and there is ok, we all
cheat on our diets...).
Losing
customers to competitors /
Customer Bailout - Prevention:
According to Donna Auguste,
Freshwater Software's CEO
and President, consistency,
uptime, trust and speed are
the most important qualities
for the success of an e-Business
website.
- Consistency:
Site consistency breeds
consumer consistency as
it instills a degree of
comfort and a feeling of
experience in navigation.
- Uptime:
Web sites must be up and
running 24 x 7.
- Trust:
Trust is the basis of any
successful business - or
e-Business - relationship.
Trust results from a combination
of consistency, 24 x 7 uptime,
proper security methods,
adequate customer service,
and prompt product delivery
time. Once customers trust
a site, they are likely
to return and refer friends
and family to the site throughout
the year.
- Speed:
A fast site retains the
consumer and it also helps
companies develop a strong
brand image. Users typically
don't notice if a site loads
quickly, but they nearly
always notice when a site
loads slowly.
One
sure way to prevent 'Customer
Bailout' is designing a lightweight
site, or at least, homepage.
Graphics:
- Remove
unnecessary graphics.
- Optimize
and compress all images.
Creating light graphics
using web palette and optimizing
images
- Reduce
the dimensions (height and
width) of images.
- Reuse
graphics. This will reduce
load time since the image
is only downloaded from
the server once and then
pulled from cache each additional
time it is displayed on
the site.
- Preloading
images is a good way to
insure the smooth functionality
of mouseover effects. It
minimizes that awkward delay
that viewers might otherwise
experience while waiting
for necessary images to
load. An easy way to preload
images is with Javascript.
- Optimize
GIF Animations.
Clean
up your HTML
- If
you use a visual HTML editor,
remove any extraneous code.
- Remove
unnecessary comments.
- Minimize
the size of the HEAD section.
- Even
text can add up, so keep
pages reasonably short.
- Crunch
your pages with an HTML
optimizer / Html code cleaners
like the Absolute HTML Compressor,
a free product available
at http://www.serpik.com/ahc/.
- When
you create a page with tables,
keep in mind that the more
tables that are within tables,
the slower the page will
load, a table with multiple
rows loads more quickly
than if you write each row
as a separate table.
-
Frames, by their very nature,
take a bit more time for
the browser to load. Especially
the first time the frameset
is loaded. If you use a
framed site, then make sure
that each frame in the frameset
is small and loads quickly.
Top 6 ways to remove unnecessary
functionality:
- Scripting
should be viewed with the
same degree of scrutiny
as graphics.
- Avoid
using Java applets as they
take quite some time to
load.
- Evaluate
all scripts and remove any
that are unnecessary for
functionality and any feature
that could be just as easily
accomplished with plain
old HTML.
-
Whenever possible, delay
script loads until after
the page loads.
- Evaluate
the use of audio and multimedia
and eliminate whenever possible.
- Optimize
Flash.
- Evaluate
the speed and necessity
of banner or news feeds.
Either eliminate the wait
or make your pages worth it.
Avoid
"splash" pages if
possible.
Don't make your visitors jump
through hurdles to get to
your information but if you
feel you can't live with out
a splash page, make it a visually
appealing at the same time
interesting and fast loading.
A good site for inspiration
and ideas for Splash Pages
is http://splash.firmlist.com/
has a collection of splash
pages submitted by various
designers.
Flash
and Preloaders - information
while the movie loads
The preloader can be finely
tuned to engage the visitor,
bringing him/her smoothly
into the main movie. This
can be accomplished in any
number of ways:
- Progress
bar - let the user know
how close they are to seeing
your page
- Design
- if your website uses a
particular theme, utilize
a version of the same in
your preloader.
- Color
and Font - similar color
and font choices tie things
together.
-
Sound - sound files
must be very small in order
to keep things simple. One
way of doing this is keeping
preload sound quality low,
saving higher quality for
later. Use tiny files; convert
stereo to mono.
The
Bottom Line:
For
every tick of the clock over
a certain point, you're losing
a segment of your potential
visitors.
Try to keep image and file
size to a minimum in order
to speed download time. A
page should be designed (whenever
possible) to display in stages
so that something appears
almost immediately to engage
your site visitor and encourage
them to wait for more. Each
element on the page should
have a purpose. When a large
graphic is unavoidable, let
your visitors know.
A page should weigh as little
as possible while still achieving
its purpose. In your efforts
to make your pages as small
as possible, don't forget
that visual appeal is also
a consideration. Text is quick
to load and necessary for
content but few linger on
a text-only site. So strive
to find the happy medium.
|
|
Helpful
sites:
WebSiteGarage
|
