client asked why site loads in pieces

[wfcentral]

okay - I'm not a newbie... so, I know that sites designed with tables will load all at once - where as a site designed with css and divs will "load as it goes" - this is not really a bug, it's supposed to be an improvement so the user sees "something" happening while they wait for the site to load...

However, I have wondered how long it would be before a client mentioned the way Xara seems to slowly assemble the webpages.

Is there a way to optimize this or is everyone dealing with this...

You can see the site in question here - http://new.wfpcnet.com (still in work, proofing marks and goofy content all over)

[mwenz]

Hello wfcentral,

You have approximately 1.53 megabytes of images, 22 of which return a 404 (cannot find) error. First off, I would heartily recommend using FireFox with both the YSlow and PageSpeed plugins to examine your web site.

You can probably gain some performance by optimizing the images that should be there and figuring out why all the 404 errors are present. FireFox and those plugins will aid this process.

Take care, Mike

[pauland]

okay - I'm not a newbie... so, I know that sites designed with tables will load all at once

Absolutely wrong. Tables just structure the site differrently and may affect the order of loading graphics, but they do not load "all at once".

- where as a site designed with css and divs will "load as it goes"

All you are seeing is a differrent loading order, because the graphics are sequenced differrently to a table based approach.

- this is not really a bug

Correct - it's not.

it's supposed to be an improvement so the user sees "something" happening while they wait for the site to load...

There's no improvement, it's just differrent and not intentional either.

However, I have wondered how long it would be before a client mentioned the way Xara seems to slowly assemble the webpages.

This is usually down to a combination of inexperience and graphics-heavy, un-optimised designs by the web developer using Xara software.

Xara takes away the hard work of writing HTML, but many Xara users seem to think it means that designs can be made without a care in the world about download speeds and graphic sizes. Xara does a great job of building pages, but it doesn't have a miracle answer for a huge amount of graphics to be downloaded at finite download speeds.

Taking care to minimise graphic sizes will greatly reduce and possibly eradicate any perception of piecemeal building of the page.

That said, Xaras web pages are "heavier" in terms of downloads because unlike CSS savvy design, all visible graphic elements are translated to graphics, while CSS savvy designers would use CSS to replace graphics downloads (it takes skill to do that).

I guess the good news is that even unoptimised, once those images get into the browser cache, the slow page build will go.

[bjornkn]

You have a lot of layered, big 32bit PNG files there that takes a long time to load, and which also causes some flickering (header etc).
Grouping the header (and making it a jpeg?) would help a lot.
Same with that grey background with lot of texture that compresses badly with PNG.
You could in fact make the entire background as a narrow image, like 5x3000px and make it repeat horizontally (Select it in bitmap gallery and click "Background")
There's a lot of other images that would benefit greatly by forcing them to be jpegs too, speedwise and flickerwise.

[wfcentral]

Hello wfcentral,

You have approximately 1.53 megabytes of images, 22 of which return a 404 (cannot find) error. First off, I would heartily recommend using FireFox with both the YSlow and PageSpeed plugins to examine your web site.

You can probably gain some performance by optimizing the images that should be there and figuring out why all the 404 errors are present. FireFox and those plugins will aid this process.

Take care, Mike

I found YSlow, but do not see PageSpeed... (edit: found it)

Based on what you're saying: I'm sure a lot of the issues are from my initial process of starting a new build folder every time I made a major revision. It wasn't until after I read through some post on the forum that I found you definitely DO NOT want to do that.

[maxtrac]

I've also placed the large background shapes in a separate layer which I call “blackboard” and is the first one to load from the bottom, after the background layers. This seems to alleviate the distraction since the background loads first, and then everything else on top of it (in most cases).

[pauland]

I'm sure a lot of the issues are from my initial process of starting a new build folder every time I made a major revision. It wasn't until after I read through some post on the forum that I found you definitely DO NOT want to do that.

I think the build folder advice is more related to the time it takes to upload new revisions. I don't think it directly impacts on the end-users experience, unless there's something else going on. The usual culprit for 404 errors besides not transferring assets to the remote server, are caching issues for pages that have frequent revisions.

All that said, you're quite right about not switching build folders all the time.

[champ]

okay - I'm not a newbie... so, I know that sites designed with tables will load all at once - where as a site designed with css and divs will "load as it goes" - this is not really a bug, it's supposed to be an improvement so the user sees "something" happening while they wait for the site to load...

However, I have wondered how long it would be before a client mentioned the way Xara seems to slowly assemble the webpages.

Is there a way to optimize this or is everyone dealing with this...

You can see the site in question here - http://new.wfpcnet.com (still in work, proofing marks and goofy content all over)

How did you create that slide show of images within xara web designer?

[pauland]

The site has a lot of javascript/jQuery code, so it's not "vanilla" XWD.

[Maus]

- no gzip compression
- no image optimization
- no keep-alive
etc
for more information test your site with http://siteloadtest.com or similar