Preloader for Supersites?

[Acorn]

I am pleased that Xara has still got the word Designer in its application titles.
We should all be trying to design our websites and ensure the assets are rendered in the best fashion.
Part of a site's design is understanding the concept of a waterline; the place below which a viewer has to navigate / scroll to from the opening position.
Most of your animations and large images should be under the waterline with the hard design part being on you having to maintain the viewers interest for long enough for your other assets to load.
Images should all be given a filename so once loaded into the local cache, they are available for re-use on other pages with as many tricks as you can get away with.

A preloader page with hidden assets is one way to achieve this. The use of code and timers has too many limitations.

Acorn

[Egg Bramhill]

As a matter of interest Acorn, do you know what position is below the fold/waterline? Obviously it varies greatly depending on the visitors platform. But Google Webmaster tools often give a warning on this issue.

[Acorn]

As a matter of interest Acorn, do you know what position is below the fold/waterline? Obviously it varies greatly depending on the visitors platform. But Google Webmaster tools often give a warning on this issue.

Banners are usually 20% of the height. pages are usually twice the height of the browser window, so as little as 30% of your page might be above the waterline.
To overcome reluctant viewers, tricks include having an image that goes below the waterline forcing a scroll but only if it is interesting.
I try and present shorter pages will just enough content to invite navigation unless it is a small Variant where a long thin page is less of a problem as scrolling is easier when swiping.

Acorn

[hoja]

Well I believe in Supersites the above the fold thing doesn't apply. Everything (whether above or beneath the fold) needs to be downloaded
to local computers before the site displays properly. In my particular example there's not even a waterline:
My pages are all fullscreen slides – I used the supersite feature to get swiping to work on mobile devices as well as subtle page blending and
to yield a "shrink to fit browser" behavior.

The by far bigest issues, I find are build into Xara and they are undocumented.
1) One would of course like to serve users of Hires capable devices a "Retina" version. Checking that box however results in huge additional
downloads (the 192dpi versions of all images) which all have to have completed before the site displays properly. Needless to say that these
downloads stubbornly take place entirely regardless of the device's capabilties. A first generation 480x320 Smartphone needs to download all
there is stored on the Server, even if it can't handle it.

2) Xara doesn't resample images at (website) export time. I honestly had a hard time to realize that something so obviously neccesary does
not take place! When I set up a website with my beefy computer and lots of RAM I of course only import all images in large enough pixel extends
that I can freely play around with them: Use them as a thumbnail or set them as a fullscreen backdrop.
In Indesign where assets are usually just referenced externally I might hook up GB's of data but can be sure that the program does the desired
resampling operations when outputting a pdf. Xara just pumps up the unaltered resources to the webspace, regardless of their effective size on page.

[Acorn]

The point of the concept of a waterline is still relevant for a Supersite - while the viewer is reading / scanning the first page, the other assets are downloading silently and not distracting the viewer.
Which is why I would never use a Supersite with Variants.
Sorry, Xara applications do resample.

Acorn

[hoja]

The point of the concept of a waterline is still relevant for a Supersite - while the viewer is reading / scanning the first page, the other assets are downloading silently and not distracting the viewer.

Even the first page doesn't display correctly, when content is still downloading. In my case
the frontpage images are displayed but offset towards the bottom of the page. See [1] and [2]...

Sorry, Xara applications do resample.

I know that there's the slider for image quality which hints resampling taking place – but I definedly ran into scenarios where this didn't work
(with version 10). At that time I even complained @ support. They answered:

You do have to manually optimize the images, we don't do this automatically in case you were printing the file out on a larger scale,
or didn't want the photos to lose their quality. To optimize your images simply go to Utilities > Optimize all images > optimize.

Now testing in V12 I see resampling taking place.

[Egg Bramhill]

Banners are usually 20% of the height. pages are usually twice the height of the browser window, so as little as 30% of your page might be above the waterline.

You've lost me here Acorn!

Banners are usually 20% of the height.

The height of what?

pages are usually twice the height of the browser window

Which is dependant on the visitors display resolution .... no?

Still puzzled.

[hoja]

Hi Egg,
I believe Acorn referred to percentages of the overall page length or browser width.
If an image has the information attached to use 30% of the browser hight it will do so,
regardless of the aspect ratio of the screen/browser window or the display resolution.

[Acorn]

A waterline is just a notion where people get bored with reading down your page; keep the interesting bits at the top.
Use that time to load in the slower parts.
Just a design concept.

Acorn

[Egg Bramhill]

Hi Hoja/Acorn,
I have no problem understanding above/below the fold as a concept. My issue is checkng my sites with Google which often informs me to place certain assests below the fold. Often these may be HighSlide code, JS Scripts or CCS that Xara creates, much of which I have no control over as Xara is creating the html file. Google must have some algorithm which determines the fold ?