homepage Welcome to WebmasterWorld Guest from 54.243.23.129
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Subscribe to WebmasterWorld

Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / Site Graphics and Multimedia Design
Forum Library, Charter, Moderator: open

Site Graphics and Multimedia Design Forum

    
Compressing images for load time ...
without losing too much detail
Liane




msg:861442
 10:13 am on Sep 26, 2001 (gmt 0)

How do you compress an image (like a map) without losing too much of the detail? The images are about 523 X 290 pixels.

 

TallTroll




msg:861443
 10:22 am on Sep 26, 2001 (gmt 0)

Most images on the web are already compressed. Both JPEG and GIF files are compressed formats. There is also a new standard, PNG which I don't know too much about, but I assume that it is based on a new compression algorithm.

You will get different quality/size ratios from the different file formats. Try taking your raw image, and saving it at different qualities, and in different formats, until you get a combination you are happy with.

Quality image software like Adobe Photoshop or something often has a "Save for Web" option, and a choice of file types

Depending on whether your map is quite colourful and detailed, or lots of lines and monochrome, you will get different results. GIF usually works best for low colour/line type images, JPEG for photo type images

tedster




msg:861444
 10:35 am on Sep 26, 2001 (gmt 0)

There is a decent free utility available online from Spinwave [spinwave.com] for "crunching" both gifs and jpgs down to a small file size. Before I coughed up the bucks for PhotoShop, this was a haven for me.

bufferzone




msg:861445
 10:46 am on Sep 26, 2001 (gmt 0)

You can open the image in photoshop, then save for web. Now you can play around with the different settings, to create the smallest possible image in an acceptable quality. Try in gif, jpg and png, with different colordepth

Regards
Kim

bill




msg:861446
 10:58 am on Sep 26, 2001 (gmt 0)

...and for those of us who might not have the PhotoShop budget...ULEAD's SmartSaver [ulead.com] has done a great job for me over the years. However, a lot of the newer graphic packages do have similar features built in nowadays.

caine




msg:861447
 11:14 am on Sep 26, 2001 (gmt 0)

Liane,

From the MM school Fireworks is a great piece of software for optimizing pics for the web.

How big is the map, what size do you want it to be: both in k's and resolution, if it is small, but very complexe then high level >80 + jpg's, if it is large but simple then =<60 jpg or look at gifs, i'm not to sure about the mysteries around png's, i thought their were fireworks own extension.

Eric_Jarvis




msg:861448
 11:44 am on Sep 26, 2001 (gmt 0)

Xat's Image Optimizer does a great job...it allows you to compress different areas of the image by different amounts

worth learning to use

Liane




msg:861449
 2:15 pm on Sep 26, 2001 (gmt 0)

Hi Caine,

The maps have all been designed to be between 520 to 525 pixels wide and vary in height. If you go to bareboats bvi dot com slash bvi underscore map dot html (put together of course) you can see an example of one of the maps. The individual maps of the 4 major islands will be similar in size but with a lot more detail.

I'm embarassed to tell you that all I have is the basic photoshop package that came with my imac two and a half years ago so there are not a lot of options. I design all images in Appleworks, copy and paste to photoshop to make into a jpeg.

O.K. ... so I am challenged in many ways, but it seems to work to a certain extent!

DiAl




msg:861450
 4:06 pm on Sep 26, 2001 (gmt 0)

If you download the HVS opimisation Photoshop plugin tool from [digfrontiers.com...] you will do well for optimising images to the smallest file size without loss of quality.

ggrot




msg:861451
 6:07 pm on Sep 26, 2001 (gmt 0)

I suspect that if all you are doing is an after the fact lossy compression, you can probably find something out there that is free. I've seen websites where you upload the picture and it shows you different compression options. I think linux has a built in graphics editor that can do this. There are probably other tools as well. Check out download dot com and see what can be found. If that's all you need the software to do, there is little reason to burn $100 on a brand new PSP or $400(or whatever ghastly price its at now) for photoshop.

Marcia




msg:861452
 6:21 pm on Sep 26, 2001 (gmt 0)

Surprising that Irfanview [irfanview.com]is still free. It's a graphics viewer, but also has an excellent compression feature for jpeg files.

angiolo




msg:861453
 7:49 am on Sep 27, 2001 (gmt 0)

I use Photoshop 6.0 to better edit the image. Usually to compress a little bit more the files I reduce a little bit the contrast; I don't know why, but reducing the contrast you reduce the size in the optimized image.

After having saved the file for the Web, I use Image Ready (Included in Photoshop) to optimize it.

4eyes




msg:861454
 8:05 am on Sep 27, 2001 (gmt 0)

Liane,

That map can be best saved as a GIF file, with colour set to 16 colours.

This reduces the size to less than 10K

Liane




msg:861455
 10:34 am on Sep 27, 2001 (gmt 0)

Thanks everyone. I suppose my terminology was incorrect ... (she says red faced) but 4eyes somehow understood what I needed to do and *WOW* what a difference in load time! That map went from 95K to 27K and loads super fast now. I have very bad eyesight and can still read it so it must be o.k.

Many, many thanks!

fonzerelli 79




msg:861456
 3:19 pm on Oct 4, 2001 (gmt 0)


You should try

[webservices.adobe.com...]

You can convert gifs to jpegs and lower the file size.

You can also compare all options.

Cheers

IanKelley




msg:861457
 10:28 pm on Oct 4, 2001 (gmt 0)

Regardless of which compression software you use (from my experience ULead's is the best) the first thing you should do is use your image editing program to progressively lower the color depth (we're talking about .gifs here) before saving.

I say progressively because this causes less quality loss (i.e. first to 256, then 128, then 64, then 48, etc...) Just keep going until you see a major loss of visual quality. Doing this and THEN using an image compressor will do amazing things for your graphics.

Keep in mind that the most popular screen resolution right now is 800x600. This means if your resolution is set at over 1024x768 (and why wouldn't it be?) then you'll want to check for visual quality loss at 2x because that's closer to how the image will appear for most people.

kapow




msg:861458
 10:39 am on Oct 5, 2001 (gmt 0)

Hi Liane

It seems as though you have achieved what you want. But I just thought it might be fun for the forum if you provide a url for the original source image. Then some of us might like to post up urls of our best attempts of optimising your image for you. We would all get to see the results. This would speak volumes about the best approach.

Who's game? :)

Liane




msg:861459
 12:49 pm on Oct 5, 2001 (gmt 0)

Actually, I drew the map myself after scanning a rather poor map from an old atlas. (I didn't want to be accused of stealing anyone's images).

I can upload it to a page if you like. Just let me know when and I'll give you the url.

I'd love to see what those who know what they are doing can do with it! I drew it using Appleworks and then copied and pasted it to Adobe Photo Shop (very basic) which came wih my 2 1/2 year old imac.

keyplyr




msg:861460
 8:12 am on Oct 6, 2001 (gmt 0)

Another free web based image optimizer is NetMechanic:
[netmechanic.com...]
...does either .gif or .jpg and even switches file types. Also has an HTML toolbox for checking page load time, HTML syntax, browser support and link validity.

If you keep your cookies cleared, you can keep using it indefinitely.

D C

4eyes




msg:861461
 9:25 am on Oct 6, 2001 (gmt 0)

Liane

Give us the link to the image, let us have a little fun!

kapow




msg:861462
 12:02 pm on Oct 6, 2001 (gmt 0)

Liane
Perhaps it would be good to start a new thread (since this one is quite long) inviting all to have a go at your image. <gauntlet> I, will be extolling the virtues of MM Fireworks with my attempt.</gauntlet> :)

mivox




msg:861463
 7:05 am on Oct 7, 2001 (gmt 0)

Hang on a bit... I'm checking out options for handling this in the most straight forward manner possible. Such a "competition" could become a nightmare freelancer-self-promotion-a-thon, and while I would LOVE to see the results, I need to figure out the best way to handle it.

Thanks for your patience everyone!

kapow




msg:861464
 11:14 am on Oct 8, 2001 (gmt 0)

I see your point Mivox. Is there a way this can be done with some rules? e.g.
- All sample images to be posted on an otherwise blank webpage.

Sorry - I am not very aware of what the sensitivities are with such issues. I don't mind conforming to any rules. It would just be great if there was a way that we all could see what different software (and people) can do.

mivox




msg:861465
 5:16 pm on Oct 8, 2001 (gmt 0)

I'm waiting to get an original file from Liane... here's my plan:

I'll put the original uncompressed image on my web server space, and post the URL in a new thread...

Then, anyone interested in "competing" can download the file, have their way with it, and stickymail me with the URL of their compressed image, what program & settings they used to compress it, etc...

Then I'll upload the "finished" images to my server as well, and post links to each image, along with who did it and how they pulled it off...

Keep your eyes open for the new thread. (This is interesting enough to me, if Liane decides not to allow use of her map, I'll come up with another "original" image with roughly the same specs to use...)

kapow




msg:861466
 6:06 pm on Oct 8, 2001 (gmt 0)

Sounds good to me Mivox.
Lets have some fun (and learn something):)

Liane




msg:861467
 1:39 am on Oct 9, 2001 (gmt 0)

Hi everyone,

Sorry I was so long in responding. Have had a few dragons to slay in the past few days. I have uploaded one of the original images to one of my pages and trashed the compressed image. I've sticky mailed Mivox with the url.

I'm really looking forward to seeing what you folks can do!

mivox




msg:861468
 5:24 pm on Oct 9, 2001 (gmt 0)

THE RACE [webmasterworld.com] IS ON!

mivox




msg:861469
 6:38 pm on Oct 9, 2001 (gmt 0)

I'm going to lock this thread down... Everyone's results will be posted on Saturday, with links to their graphics and an brief explanation of what software and settings they used. :)

I'm sure we're all very curious to see what everyone is coming up with... but patience is a virtue. ;)

I may post an occasional update in the contest thread [webmasterworld.com] so everyone has a general idea how things are going...

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / Site Graphics and Multimedia Design
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved