Slicing Images

CarbonTerry · #1 03-02-2006, 06:23 AM

My index page is somewhat slow in loading because of heavy graphics that I want to keep. In ImageReady I slice my graphic into many slices that enabled me to actually delete a lot of blank info to increase speed. I save the slices as HTML and images (folder)
I put this folder into a clean BV folder on a different hard drive:
E/My Documents/Blue Voda (this is an example)
I load the HTML into a BV page and preview.
I can see all of the slices but no image(s) appear. (lots of red x's)
How do I get the images to appear?
If I click on the HTML page/icon in the folder I get a good preview in IE.
Complicated, I know, but this will significantly increase the speed of the page opening.
Thanks

navaldesign · #2 03-02-2006, 08:48 AM

Quote:

Originally Posted by CarbonTerry

My index page is somewhat slow in loading because of heavy graphics that I want to keep. In ImageReady I slice my graphic into many slices that enabled me to actually delete a lot of blank info to increase speed. I save the slices as HTML and images (folder)
I put this folder into a clean BV folder on a different hard drive:
E/My Documents/Blue Voda (this is an example)
I load the HTML into a BV page and preview.
I can see all of the slices but no image(s) appear. (lots of red x's)
How do I get the images to appear?
If I click on the HTML page/icon in the folder I get a good preview in IE.
Complicated, I know, but this will significantly increase the speed of the page opening.
Thanks

This is because the html of the saved as html slices include also the path to the folder where the slice images are saved, so previewing the html of the slices you can see them. In the BV page, the html doesn't include the correct path. To correct this, you must enter the BV page, and for every single slice image, you must double click to edit it, and then give the correct path for the sliced images. However, unless you have lots of blank spaces, this will not save you much, and it will increase your work. I suppose that if you can slice your graphics, this means you don't need to have the images in it as separate (to link them, f.e.) So If your page isn't too high , consider having the whole graphics background as one image, and use pixresizer to take it down to a resolution that will be the best compromise between quality and loading speed. Please also note that if the background is made from many pictures that overlay each other, then using them all means that IE has to download all the image files, icluding
that part of the images that in the final screen are covered by other images, and this increases a lot the time for download. You could instead create the background in a graphics program, and then save it as a single .jpg image, resize it in PIXresizer, and then insert it in BV. This way only the actually used part of every image will be passed in the final image, thus saving a lot of filesize.

CarbonTerry · #3 03-02-2006, 10:33 AM

Thanks for the reply. I edit all images in PhotoShop CS and "Save for the Web" to the smallest file size possible and still retain decent resolution. When I "slice" the image I save both files (html & images) to the normal BV file. From there on I have a difficult time figuring it out.
I thought that once I add the html to a BV page and the images are in the Image file that it would work. Apparently not.
I appreciate your time as always. Thank you.

CarbonTerry · #4 03-02-2006, 10:39 AM

What I did do to reduce file size was to re-edit the index page by putting individual elements in instead of one big image. By doing this, I was able to eliminate dead space in my image and reduce file size that way. Also I was able to reduce some components more than others and reduce file size again. (I thought that's what i could do with "slices" also) I did reduce the loading time from 23sec to 16sec.
This is a slower loading time than it was before BV but my customers don't have to make as many clicks to navigate and buy product and I can make changes daily if i need/want.
Thanks BV & Navaldesign

navaldesign · #5 03-02-2006, 10:40 AM

Quote:

Originally Posted by CarbonTerry

Thanks for the reply. I edit all images in PhotoShop CS and "Save for the Web" to the smallest file size possible and still retain decent resolution. When I "slice" the image I save both files (html & images) to the normal BV file. From there on I have a difficult time figuring it out.
I thought that once I add the html to a BV page and the images are in the Image file that it would work. Apparently not.
I appreciate your time as always. Thank you.

Upload the URL of the page as you have already published it and it is slow. I'll take a look and let you know

CarbonTerry · #6 03-02-2006, 06:34 PM

http://redhawk-archery.com/

navaldesign · #7 03-02-2006, 06:48 PM

The only image that's large is the text image. All the other are ok , max 6 - 8 Kb. It's the text that cause you some problems. On DSL, it takes 6 secs, 4 of which for the text image. That's more than acceptable in my opinion.

CarbonTerry · #8 03-03-2006, 03:56 PM

Thanks for the help. There are 3 text images, three graphic images, 12 rollover images and a text link.

CarbonTerry · #9 03-17-2006, 07:39 AM

FYI, I have reduced images and improved load time significantly. (50%)

navaldesign · #10 03-17-2006, 07:59 AM

Good!

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)