|Chopping up an image |
Is there an easy way ?
I have a large Jpeg image that I need to chop up, is there an easy way to do it? I'm sure the graphics gurus here have a quick solution :)
I have Paintshop Pro.
Thanks in advance as always.
Why do you need to chop it up? Image slicing usually works best with gif images, where you can ensure that the compression & colors along the edge of each adjoining slice are the same.
There may be an alternative to slicing the image, if you can give us "graphics gurus" a little more info... ;)
I think I have found a way around it :)
But the original problem was it was a large (Kb and Physical) JPEG and I wanted to split it up and put it in differetnt cells to enable faster page loading.
I am still interested in any ideas/methods.
The best way I know how to do it is, add guides then select each section and copy and paste into a new canvas. I think with PSP that when you create a new canvas it will make it the size of whats been copied to the clip board. Try to get areas that only have a few colors so you can create gifs with those. Also try to get areas that are all the same color so you can just set the background color of the cell or div. Try not to chop too much or you'll have code bloat that will slow down the page just as much if not more than the original picture.
Personally, I'm not convinced that image slicing is enough of a speed improvement to be worth the extra code needed to hold the pieces together anyhow...
For a JPG, try saving it as a 'progressive' file, so a super-low res version will display first, and slowly resolve to the full res image, and make sure you enter height/width attributes in your HTML, so the rest of the page loading doesn't 'hang' while waiting to figure out the image info.
Also, if you are on Windows, I've heard great things about the ability of Pegasus JPEG Wizard to compress photos much smaller than either PSP or Photoshop, while still keeping them looking good... It's available as a photoshop plug-in, which I believe will work with PSP as well.
Actually, breaking up the pieces, if only in two, helps to speed the download because a 12k piece of data will slide through the data pipe easier than a 24k chunk.
It's not that much more code to place a picture in two td's than it is to put it into one (like about 2-4 extra lines of code?).
Of course, it's always a good idea to first optimize an image to whatever format (gif or jpeg) is suitable.
There is a function in Paintshop Pro 7 under Image export to do ths splitting. It can also set the links for different pieces, and do image swapping.
I have second thoughts about my previous comment about splitting up a td for two halves of a picture. You can stick them into one td and the default browser alignment squishes them to the left.
In photoshop (and I assume in Paintshop Pro), you select one half of the picture. Then edit-copy. Then file-new-paste-then save for the web. Return to the original picture. Go to your selection menu and select Inverse (Voila!), you have the other half perfectly selected. Now edit-copy etc.
Boom! You're done. The inverse selection is your friend.
|Actually, breaking up the pieces, if only in two, helps to speed the download because a 12k piece of data will slide through the data pipe easier than a 24k chunk. |
Yes, on average a 12k chunk of data will arrive in half the time it takes a 24k chunk to arrive, which, when you do the maths, means that your net gain is zero. The data pipe is only one factor in the equation; the client has to take all the data packets and reassemble them into two different files where before there was only one.
But that assumes that chopping a 24k image into two bits results in two 12k images. It doesn't -- try it. Even if the data representing the image data itself was exactly half that of the original (which it seldom is), each image file has its own header, thus increasing the total number of bytes to download. Added to that is the fact that the client has to send a separate request to the server for each image, further adding to traffic and slowing the whole process down.