Small Images: Download Faster-Save on Bandwidth Usage

Need technical advice on coding your web pages? Covers HTML, JavaScript, CSS, and some server side technologies. Also the issue of some webpages not displayed well.

Moderator: Don_HH2K

Small Images: Download Faster-Save on Bandwidth Usage

Postby FrankoSport » Thu 23 Dec, 2004 7:25 am

Greetings ...

One of the other threads in the Web Page Design-Coding Forum is Web Page Alignment, where the person was seeking advice about his web-page, a 4-h club site

When I went to the 4-H link for the first time, I immediately noted how fast the 1st picture loaded, then how slow the 2nd picture loaded. I found that the first picture is a natural 401-W by 301-H (pixels) image file. However, the 2nd picture is a 1600-W by 1200-W (pixels) image file. To make the 2nd picture fit neatly withing the web-page's margins, the author used a standard HTML protocol to reduce the image pixel dimensions to 401-W by 301-H.

There's nothing really wrong here, in so far as the reduction technique helps make the picture display nicely. But the reality is this - It's still the same large image file of 1600x1200 pixels. Because it's larger than the smaller 1st image file, the 2nd file takes longer to download. Also, the 2nd file's longer download time translates into usage of valuable bandwidth allotment.

If you plan on making a web-site, where SEVERAL very large image files will be used for displays, you will chew up bandwidth allotment very quickly, making the site costlier to maintain.

The solution - Do not use an HTML protocol. Instead, get an image file viewing program that creates re-sized copies of your original image files.

I use an image viewer called Irfanview. It has the resize image feature. It gives you 2 options: (1) Re-Size by altering specific width and/or height information. .. (2) Re-Size by percentage of original.

Please note this - Irfanview's "Save" and "Save As" options are different from other programs. "Save" saves to an external program or device. "Save As" is waht saves your file as a file. When saving, be careful of the file type (BMP GIF JPG) you want, plus use a filename different from the original.
UserAgent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.5) Gecko/20041107 Firefox/1.0
FrankoSport
super member
super member
 
Posts: 138
Joined: Sun 05 Jan, 2003 12:04 pm

End of Solution Dialog

Postby FrankoSport » Thu 23 Dec, 2004 8:23 am

Greetings - and cntinuing from above ...

Of Course, any re-sized file can then be loaded onto the web-site. The larger originals can stay on your computer.

Good Luck and Happy Holidays from Frank-0-Sport

BONUS: Happy Holidays Banner Image
UserAgent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.5) Gecko/20041107 Firefox/1.0
FrankoSport
super member
super member
 
Posts: 138
Joined: Sun 05 Jan, 2003 12:04 pm

Postby Andrew T. » Thu 23 Dec, 2004 2:45 pm

Thanks for posting that valuable information, Frank-O-Sport.

Another important bit to remember is that due to their loading times, needlessly large images are disadvantageous to those viewing a site with slower dial-up Internet connections.
UserAgent: Mozilla/5.0 (Windows; U; Win95; en-US; rv:1.7.5) Gecko/20041107 Firefox/1.0
User avatar
Andrew T.
diamond member
diamond member
 
Posts: 1228
Joined: Fri 14 Mar, 2003 11:37 pm
Location: Somewhere beyond the sea

Postby keith » Thu 20 Jan, 2005 6:06 pm

Yes. Thank-you. That information will prove to be very usefull for me

Keith
UserAgent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322)
KEITH
User avatar
keith
gold member
gold member
 
Posts: 687
Joined: Mon 02 Feb, 2004 11:49 am
Location: Alberta, Canada


Return to Web Design and Page Coding

Who is online

Registered users: Google [Bot]

cron