[thelist] quicker page loads.

Joshua Hmielowski jhmielowski at comcast.net
Tue Jun 15 20:00:07 CDT 2004


Thanks Stuart.
It is really good to know the breakdown of how the browser reads your 
pages. That Url breakdown link is excellent.
I can move some things around for the priority of loading but in 
reality the amount and size of images being used here
is the real elephant. Sorry about the layers label, just a habit. it 
was actually hand coded.
Josh

On Tuesday, June 15, 2004, at 05:55  PM, Stuart Young wrote:

>
> ----------------------------
> better techniques for faster loading of pages with much image content.
> I am building a gallery for a photographer and I am using layers and
> onMouseOver show layers to present the images.
> Obviously in order to present the content well all images need to load
>
> "onLoad". This can severely slow the page loading
> with many images loading at the same time.
> ----------------------------
>
> If you are adding images to the page in hidden layers (divs) then there
> is surely no need to preload the images using <body onLoad>. The images
> will be loaded when the browser "gets to" the div code - no need to
> preload them first.
>
> The only reason to preload images using <body onLoad> is if you have
> rollover images - here the image that appears on mouseover is not part
> of the page so otherwise would not be loaded until the user mouse
> overs.
>
> If these are absolutely positioned layers (divs) then you can place the
> div code wherever you want in the source code (and they will still
> appear in the same place that you want on the actual webpage that the
> user sees). The browser will load the page from top to bottom - the
> nearer to the top of the code the divs are placed then their loading
> will be proritised.
>
> So, you could have the code for the layout, the text of the page and
> the background of the page come first, and then the code for the hidden
> layers - so the page would appear to load quickly, and then the extras
> will start to load. If there is one hidden layer that users are more
> likely to want to mouseover straight away then you could prioritise the
> loading of that one by placing the code for that one near the top. If
> there are hidden layers that the user is not likely to mouseover then
> these can be placed at the bottom.
>
> It would be a good idea to run the page through a tool that shows how
> the browser is loading each of the page elements in turn, such as:
> http://www.webperf.org/breakdown.html
> move the div code around a bit and see what the effect of the change is
> on that tool.
>
> I presume from the fact you call them "layers" that you are using
> Dreamweaver - if you don't want to go into code view you can still move
> the div code around the page in design view by moving the little layer
> icons (yellow with a C on them)  around the page - the actual layer 
> will
> still be in the same place.
>
> cheers
>
>
> Dr Stuart Young,       +64 (0)9-815 4321 Ex 8656
> <syoung at unitec.ac.nz>
> Lecturer, School of Computing and Information Technology,
> Unitec New Zealand, Auckland, New Zealand
> http://hyperdisc.unitec.ac.nz/staff/syoung.htm
> I would provide a URL for my official staffpage, but its too long and
> complex
> -- 
> * * Please support the community that supports you.  * *
> http://evolt.org/help_support_evolt/
>
> For unsubscribe and other options, including the Tip Harvester
> and archives of thelist go to: http://lists.evolt.org
> Workers of the Web, evolt !
>



More information about the thelist mailing list