OT: WWW site - quick loading or better quality images

[Ed Marks]

Hi,

I have a question for you. What's more important on a woodworking web site, good quality images or quick loading? I'm usually not too impressed by pictures of someone's creation in wood when the image is so distorted you can't see any details. On the other hand, high quality pictures can take a long time to load unless you're a broadband speed-deamon like me.

The reason for the question is that I've been working on a new personal WWW site and have see some long load times on the initial page as well as some of the "picture gallery" pages. Part of the issue is that it's currently hosted in my attic and my ISP caps my upstream speed at ~60-80K. Eventually I'll move it to a real server and that will fix that up. (Some testing on my ISPs server shows that a decent server takes care of the load times just fine.) However, the problem will not go away for the people still stuck on dial-ups no matter how fast the server is.

So, what's more important, quality or wait time?

TIA,
Ed

PS: As soon as I finish filling in the multitude of 404's and finding all the dead links I'll update the URL in my profile.

[John Miliunas]

Ed, this is just my humble opinion: I think I would go for the quicker load times. Unfortunately, not all our brethren here have broadband and, from what I've seen of the Telco's and cable companies, that may be the norm for many folks for years to come. There are quite a few of us out "in the sticks" where that just won't be a reality for a long time, if ever. Personally, I've been fortunate, because I do a lot of research and troubleshooting on-line from home, so my department sprung for satellite powered broadband (downstream only). Not everyone will have that option. Further, you can still keep pretty good quality, but byte size down, by reducing the size of the picture. Granted, viewers would miss on some of the detail that way, as well, but if the general idea of the picture was there, maybe those folks could email you for more explicit shots to send them by email. Just my $00.02. :cool:

[Jim Becker]

Ed, you really don't need to totally sacrifice load time or good quality for web site work!

Firstly, use a good photo editing program that has the ability to create JPG images with you in control of the compression ratio. You can then test to see what works best from a quality standpoint as you dial in the compression. I generally use a compression factor of 10 to 1 and am pleased with the results. I also use my application's "sharpen image" capability after resizing something smaller to recover detail.

Secondly, consider placing smaller images in your pages for casual viewing that a visitor can click on to load a larger image at their own option. I often use 200-250 pixel wide images within the text if it's a highlighted shot or even 100 pixel wide "thumbnails" where the picture is used as an accent or within a pictorial. Most of my 600-640 pixel wide "big images" are not over about 60-80K max and many are even smaller. Even the very large image at the top of my site is only 48K!

It's just a matter of image manipulation! :cool:

[Jason Roehl]

I have to agree with Jim on this. Typically, a 50K jpeg is plenty large to show detail, without chaining a dial-up subscriber to their chair. And, putting smaller versions (thumbnails or slightly larger, say 5-10k) on the main info page as clickable links to the larger images will greatly speed the load time of the page. Pics should generally fit onto an 800x600 screen, maybe even 640x480, because there are still plenty of users out there with 15" screens at a lower resolution.

Jason

[Jim Becker]

I've found that most pictures don't ever need to be larger than 640x480 pixels for web display and that's for when you pop them up "special" when requested to do so.

For folks who find all the software manipulation challenging, keep in mind that your digital camera more than likely defaults to a much larger size than that. If you are taking some pictures specifically for the web...say, of a project or some aspect of your shop...change the camera setting to 640x480 pixels for that session. It will reduce a step or three once you get the photos onto your computer. Unless you are going to the printer, super-high resolution pics are not necessary. They also take up a lot of room in your camera--a disadvantage with the small size of the original memory device that ships with many cameras.

[Dave Arbuckle]

If you are taking some pictures specifically for the web...say, of a project or some aspect of your shop...change the camera setting to 640x480 pixels for that session.

Just for a contrary viewpoint. I leave mine on "highest" when taking shop shots. This gives me space to crop and retain the full desired size without software enlargement. It also allows me to pick out a detail picture if needed.

I don't find memory capacity much of a problem, since the shop and computer are pretty close to each other. I do certainly agree that 640x480 is a decent size for general web use.

Dave

[Daniel Rabinovitz]

Ed
I am in total agreement with all the fellows.
I hold all the photos use on my website to:
LESS THAN
350 pixels by X or
X by 350 pixels
and under 10K insize - I hope.
I may have the worlds slowest internet connection and yet run a large website.:cool:

[Jim Stastny]

Without a doubt I vote for quick load times. As one with a dial-up modem I will abort looking at something if it takes too long to load.

[Ted Shrader]

Ed -

I like quick load times. If nothing shows up in a few (<10) seconds, I move on to another site. I will, however, wait for an high detail image that I am interested in i.e. have chosen to download.

The discussion in the thread already said ways to maximize picture quality and reduce loading time due to image size. Use smaller images as thumbnails and set the cursor for an "On Hover" message about a better quality image here.

I have broadband at work and home.

Ted

[Rob Sandow]

Limit the pics on the main page to 50-60KB, but put a link underneath them to a larger size pic. I like to see the big pictures since they really do offer much better detail, especially for "shop tour" and furniture pics. My camera takes 1600x1200 pixel shots that tend to come in around 500KB, and they really do provide excellent detail. If someone wants to see that, let them click on a link to it, but keep it off the main page.

Rob

[Rod Peterson]

<br>
My personal pet peeve right now is web designers who test their creations locally and have blazing page loads, then test it online through their T1 connect, and wonder why people on dial-up don't spend any time visiting their bloated site.

I have several rules I apply to my page writing, some of which have already been addressed:<ul><li><b>Always use thumbnails</b>. Give the viewer the choice of whether they want to download a graphic of unknown (to them) size. I always size mine at 100 pixels in the largest dimension
<li>My main pictures (called by the thumbnails) are no greater than 500 pixels high or 735 pixels wide. In my browsers and monitor that allows a picture to be displayed without any scroll bars.
<li>My camera produces images of 1200x1600. I prefer to work from there to form my images to the size parameters above. You can always make a digital image smaller, you cannot make one larger. Of 110 images on my main page, more than half are smaller than 50K, and more than 90 are smaller than 80K.
<li>The &lt;ALT&gt; attribute in the &lt;IMG&gt; tag lets you make descriptive language available for mouse roll-over and also if the following technique is used...
<li>I <b>Always</b> include the &lt;HEIGHT&gt; and &lt;WIDTH&gt; attributes in the &lt;IMG&gt; tag of the thumbnail. That permits the browser to allocate space for graphics and display the text without waiting for the graphics to load.
<li>Call me picky, and this has nothing to do with speed, just personal aesthetics, but I also set border="0" in my &lt;IMG&gt; tags.</ul>
These techniques (except for the border) allow maximum transfer speed to graphics content ratio and still not give up useful visual enhancement.

[Bob Reilly]

I also vote for the quick load time.

[Jim Izat]

I think that the beauty of the web is choice and that's what web site owners and designers should give their users. There's no reason why you can't give users a broadband and a dial up option on every image you post from a thumbnail. That way people who use dial up can see the less detailed pictures and those who pay more for high speed access can see more. Heck there will be plenty of folks out there who use dial up that'll be willing to see high quality images if they're really interested in your stuff. You should give them the option and let them decide!

Jim Izat

(within the next five years or so dial-up will be gone any way and you won't have to worry. There's all kind of new bandwidth delivery options coming down the pike that everybody can access.)

[Ed Marks]

I sort of suspected that the result would be speed over quality, at least to start. I was surprised to hear that folks would sit through a reasonable load time to see the "detailed" image that sat behnd a thumb.

I've been working on a script that can display a larger picture (say 640x480) in a pop-up frame and give the user a choice of closing the frame or displaying an even more detailed view of the same image that might be closer to what the camera image was. My intention has been to use this as the action if one clicks on the thumbs.

I did find a lot of my issue had to do with the way my ISP provisions my cable modem. The upload speed has been capped at 64Kbit (used to be 128Kbit). The bad news is that's pretty slow. The good news is it caused me to notice what a dial-up user would see on a good day. I never planned on hosting the server here anyway, but it is easier to use a local server for development and then push it to a production site when it's all debugged ... and yes, it is quite zippy on a 100Mbit LAN, but I prefer it to be that way during development. :D

[Rod Peterson]

<br>
Ed said:

> <i><font color="blue">The good news is it caused me to notice what a dial-up user would see on a good day. </font></i>

Would that all developers could/would try that.

> <i><font color="blue">...it is easier to use a local server for development and then push it to a production site when it's all debugged </font></i>

No question. In my case, <i>local server</i> just means the hard drive in my computer where the entire structure of my website is mirrored.

> <i><font color="blue">... and yes, it is quite zippy on a 100Mbit LAN, but I prefer it to be that way during development. </font></i>

Absolutely; wouldn't want to do it any other way.

[Dave Arbuckle]

I've been working on a script that can display a larger picture (say 640x480) in a pop-up frame and give the user a choice of closing the frame or displaying an even more detailed view of the same image that might be closer to what the camera image was.

Henredon ( www.henredon.com ) has a feature that's similar to this, but a step beyond. They allow the user to select what part of the picture they zoom in on, keeping the overall size of the image the same size. It's very neat, I think.

Amen to Rod's "Would that" comment. I was at the "Mini Cooper" site earlier trying to look up a price for a friend. That site obviously states "if you have dialup internet, you are NOT a potential customer of ours".

Dave
Coming to you at 45.2kbps, according to Windows.