Website Loading HELP!

[[Dr. V]]

Hey guys...this is my second help thread in a row, so bare with me here

Anyhow...first, to understand what I'm saying, head on over to my latest project, www.Edge Music.ca.

Now...see the way it loads?

Obviously they're divided into slices and each individual slice is visible during loading - and to be frank - it looks pretty bad.

I'm pretty positive that there is a way to make the site load a lot smoother. Either make sure that the entire thing is loaded THEN display the whole site at once, or load top-to-bottom smoothly. Thing is it's sliced for a reason - links.

Basically, I need the links to stay EXACTLY how they are and everything to stay the same, but make the loading look cleaner/smoother.

Thanks in advance guys, hope a web design expert can help out

P.S. They're all GIF files sliced through Photoshop.

[Yellowhello]

I can't even load the page... the connection times out.

[[Dr. V]]

Originally Posted by yellowhello

I can't even load the page... the connection times out.

Seems odd...can anyone else confirm that?

I just clicked the link 5 times over and got the page perfectly fine..

Thanks.

[Phosphorous]

When you saved the files in ImageReady, did you do a "Save As Optimized"?

[Yellowhello]

Oh wait, I just got in. Maybe it's 'cause you have a BUNCH on pics; a lot to load...

[halutzparilla]

it have too much to load, if someone with low bandwidth or poor isp this will take forever to load... and this bunch of pIX, public library computer they mostly block this stuff...
well i hope someone here can help you...

great music sample...

[gvblake22]

Save the images as interlaced and it will load a really basic pixellated version almost immediately and save the "space" of the image so it isn't a blank white spot with a picture icon. Your other option (that I would suggest) is to reduce the number of images and use some text or something. maybe have a single background image with all the designs and stuff, then put text in a table over the background image.

[Telexen]

You definitely can cut down on the images. It's easy to say that, it's another thing to know where to do it. Every one of those pages is mostly images. You can make the site look the exact same but cut out most of the waste with images. It's just far too large size-wise.

Here are a few things I caught without looking at the source:

1) make the CD and quoted text image smaller, maybe use it as a background to a cell in the table rather than an image all by itself.

2) It's nice to be able to use images for buttons where you want text prettier than most people have as fonts on their computer, but not all text on a page can be that way. If you *have* to, use image buttons for the main navigation (side) ... the top and bottom can be text though.

3) Do do these you'll need to find a font you think is good looking that most users will have and use it for all your main text - create a stylesheet to handle it.

4) You're using images for whitespace in a lot of areas. Don't make an image as large as you need the whitespace to be. Make them 1x1 pixels, and use the <img> tag to size them the way you need.

5) You've got some fairly advanced work with tables done there - but it's extremely misguided. The loading in "slices" thing just isn't good web design.

[insomnia]

Yeah you need to decide what text you want in Photoshop because making the whole website in Photoshop and importing it into dreamweaver/frontpage as is, thats not going to give you fast loading speeds *as you have already found out*. this is what I do. Open your website unsliced in Photoshop and make a JPEG of the whole thing and then go into Dreamweaver and go to modify>page prop.>tracking image. Then browse for your JPEG of your site and hit ok. Once you do that you have a guide to make tables for your images. Now go into Photoshop and slice it all up but only slice the stuff you will need like a group of text and real images/pictures. Your trying to not get so much of the black BG color. Once you do that you save as optimized. Basically you need to know exactly what size all your slices are so you can make the tables correctly. It can be tricky, it took me a while to figure it out. Use the Draw Layer tool under Layout on the top bar with the tracking image in the back to use as a guide so you can make the tables, and if the table isn't exactly the right dimension's then put the correct image size in the boxes on the table's properties on the bottom left. Thats if you're using Dreamweaver. Hopefully you could follow that :-/ I'm getting tired so I wont finish.

If you want me to explain the rest just IM/PM me w/e.
.
*lol I still couldn't explain it right...

[[Dr. V]]

Here's the thing.

I made the whole site in Photoshop, sliced out the images that need linking (and left everything else alone), applied my links, and saved as Optimized (gave me GIF files) and an HTML file (which is auto-coded for the site) and I altered the HTML code somewhat.

Thus, the crappy loading.

I'm about to try blake's suggestion to see how that works.

In terms of the last two, they seem kinda lengthy and I've spent so much time on this site that I need to leave it the way it is and find a way to re-save it - there is no way anything is being redone here.

I'll post back soon. Thanks!

P.S. I appreciate the time you guys took to type those long messages, and it isn't for nothing because not only will others be helped, but I'll carry many things over to my next website.

Thanks!