Speed
by Stephen Beveridge
Speed!
The problem with the web is that it's too slow. Pictures take too
long to appear. This is the most often expressed complaint about
my website. I have all the newest optimizers and compression tools.
I have squashed the file sizes yet they load too slowly. It's no
good if the only ones taking the time to look at your work are your
closest friends and family.
When I look at my website on my own computer it loads quickly so
what's the problem?. That's 'cause it's cached. The cache is a file
your browser created to store images from the web. After the first
viewing your computer keeps a copy on hand so it doesn't have to
suck it through those tiny phone wires again. You can adjust how
much room to allow in this file through the preferences as well
as dump what's in there to speed things up.
Try going to the library or a friends computer
and call up your website. How long does it take to load the images?
If it loads too slowly, if you get tired of waiting for the images
something must be done. While your at it how does the layout look?
Does it behave the same as it does at home? It's important before
publishing to the web that you check how it looks and loads on at
least the top two browsers, Netscape and Microsoft. Use a different
browser and make sure everything looks good. This is where it helps
to know a little about writing HTML.
What can be done with those too slow images? For one thing make
the picture smaller. Reducing the physical size of the image even
a quarter of an inch can make a big difference. Make sure you have
set the resolution of the image properly. To print an image you
may need to save it at 300 dpi but to view it on a computer screen
it only needs to be 96 dpi. PC's standard screen resolution is 96dpi
Macs are 72dpi. Actually that's 72PPi. Pixels per inch which is
how things are measured here in cyber land.
There are more than a few variables in monitor
size ,screen resolution, and browser toolbar occupancy. Those dang
toolbars with their funny icons can take up all kinds of room. Current
design space after averaging and fighting and checking is 600 pixels
by 300 pixels. If you want most folks to see your page as a whole
make it that size. You can put information trailing lower but folks
don't like to scroll sideways.
Another problem with different systems is that things generally
look darker on PC's
If you must have a large file to show off your work link to it from
a smaller one with a note telling the size of the large image so
the viewer can first see if he wants to take the time then go walk
the dog or something while it downloads
Photoshop has options for jpegs to reduce the size with a minimum
of deterioration to the image. There are also third party plug ins
which can be downloaded which improve on this. I'm looking for a
balance between image quality and speed. I need to know what the
image is going to look like before I save it in a compressed state
that's why I use
ProJPEG.
ProJPEG is an easy to use, tool for preparing JPEG images for the
Web. It is a file format plug-in for Adobe Photoshop 3.0 and greater.
ProJPEG allows you to see just what the picture will look like as
you squash the hell out of it with a slider. It is available for
Mac and Windows at
http://www.boxtopsoft.com
In fact you can find a whole host of page slimming gadgets at this
page.
http://www.digfrontiers.com/
is another website to check out. These guys do the same kind of
thing so you choose.
http://www.killersites.com/1-design/jpeg.html
has pictures that have been compressed showing what you save
and what you lose.
http://www.webreference.com/services/graphics/jw/
This page has an actual compression tool. You send your image it
compresses it and sends it back. Way cool.
Do an internet search for "compression+jpeg".
Don't use gifs for your art as the colors change.
Gifs are for special text, icons, and logos.
That's another thing how did the color look
at the library? Before you start getting real picky about the images
remember everyone's computer is probably looking a little different
anyway. If someone wants to buy the art send them a slide or a good
print. Your website may tell a lot about a painting but it's a low
resolution copy of a photograph of a painting just the same.
What's your screen resolution. Mine's set at 1024 x 268 yours could
be 640 by 480. If that was the case what looks to me on my computer
like a small painting in the middle of the screen could fill your
screen and beyond. Make sure you check your website out in the lowest
resolution screen setting. If you can't figure out how to do this
it's probably set at the lowest resolution any way so don't worry
about it. In fact don't worry about any technical details at all.
That's right just do your best and get the thing started. Even after
you create the page and upload it no one will know where it is until
you tell them so you have plenty of time to sort out the details
by trial and error.
Another method of faster downloading of larger pictures is to use
'progressive rendering'. With this option the image appears in it
entirety almost immediately, but in a low, resolution. As time passes
more of the image is downloaded, the resolution gets better until
eventually it has rendered completely. It gives the viewer something
to look at which coalesces into your image. Some folks like this
others hate it.
Progressive rendering has to be introduced to the original file
being saved and depends on having the right program to encode as
well as decode it. If the viewers browser has the decoder this can
be a quicker way of loading images.
For more info go here-
http://www.cis.ohio-state.edu/hypertext/faq/usenet/jpeg-faq/part1/faq-doc-11.html
Most browsers now have this software. Here's a short list.
Netscape 2.0b1 (Unix/X, Windows, Mac, OS/2): full implementation
Microsoft Internet Explorer 2.0 (Windows): no incremental display
(there are rumors that MSIE 5 will finally do progressive display
properly)
Microsoft Internet Explorer 2.0 (Mac): full implementation
AOL 3.0 (Windows, Mac): full implementation
For more browsers go here-http://www.cis.ohio-state.edu/hypertext/faq/usenet/jpeg-faq/part2/faq-doc-16.html
For tons of info about JPEG's go here
http://www.cis.ohio-state.edu/hypertext/faq/usenet/jpeg-faq/top.html
Image manipulation is a major factor in art websites. It's something
you must know about so learn.
- Here are a couple of good sites
- Bandwidth Conservation Society
http://www.infohiway.com/faster/
- Web Page Design for Designers - Graphics
http://www.wpdfd.com/wpdgraph.htm
This place is filled with well explained technical information
explaining the difference between GIF and jpeg as well as going
into system palettes and other confusing stuff.
- http://photo.net/wtr/thebook/images.html
This page documents a method for building an image library and
presenting it to each Web user in the best way for that particular
person.
Here is what you might learn from this page:
Photographs are valuable content, as distinct from graphics which
are generally a waste of your money and the user's downloading
time. You can read here why photos look so great on the screen.
Always scan from an original negative or slide, never from
a print. Think seriously about the fact that
you are building an image library and whether the Kodak PhotoCD
system can help you. I use Kodak Photo CD's. I get a two
dollar scan of a slide and will always have the cd to take
the image off of without filling up my hard drive. They are
perfect for the web.
- Build a structured database of information
about your images that you can use for automatic conversion to
JPEG format, file naming, and captioned HTML code generation.
Use WIDTH and HEIGHT tags in your IMGs so that the text on pages
with in-line images doesn't take longer to load.
Stopping other people from using your creative work probably won't
increase your ability to sell that creative work and will cost
a tremendous amount of time and money; it is usually better to
build a hall of shame and devote yourself to creating new works.
People have said to me I should put watermarks on my images and
copyright them before publishing to the web. I know people who
are so afraid someone will steal the images that they won't build
a web page. My images are low resolution compressed digital reproductions
of photographs of my paintings. I sell the paintings. If I wanted
to make prints and sell them they would have to be high resolution
scans of art or direct photos. If someone wants to use my image
as wallpaper/desktop picture go for it. Maybe after looking at
it long enough they might want to buy the original.
http://www.servtech.com/~dougg/graphics/
The purpose of this web site is to help artists and graphic designers
make informed and intelligent choices regarding which image file
format to use (GIF or JPEG), and how to optimize their graphics
specifically for publishing on the World Wide Web. This site balances
theory with practical examples. The goal is to create the fastest-loading
image of the most reasonable quality.
Stephen Beveridge is
a New York-based artist. He also designs and maintains websites
for artists and art-related businesses
He is also available for
consultations. For information contact Stephen Beveridge at
(212) 928-8351.
Email:
His website is located at www.scotstyle.com/scotstyle
for
artists, by artists
