Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

Not a major problem, but I would like to understand more about how some websites can serve different pages to a navigating user, such that the browser doesn't visibly pass through a blank white page. Whereas some sites cause the browser to display the white page for up to a few seconds.

I can imagine this is partly due to network latency, but are there any other factors? Can I cause the background image / color not to flash white?

share|improve this question
add comment

2 Answers

up vote 5 down vote accepted

The 'White Flash' your referring to is the browser drawing the webpage. There was a great question about how to track how long it takes different browsers to draw your website (latency aside).

Another good question to refer to is how to speed up your site through various tools and techniques.

But what I think you're looking for is AJAX. Asyncronous JavaScript And XML; this will allow you to reload page content without reloading the page, thereby completely avoiding the 'White Flash.'


EDIT: I just realized a technique that you could use that is extremely simple. You could use iframes! I didn't think of it because it's kind of an outdated technique. I haven't used it since high school, but using iframes you should be able to get the desired results.

share|improve this answer
    
Thanks Christopher, I will check out those questions. However, I am mainly interested in techniques that prevent the white flash, without using AJAX techniques. For example, when navigating different pages of a typical corporate website that has common backgrounds, header, main menu bars, etc. At the moment my site is based on Dreamweaver's template feature. Not really keeping up with the times, I know. –  gus Mar 22 '12 at 13:55
    
What you're looking for is beyond the reaches of just code without AJAX. When you click a link in your browser, it will connect and handshake with your server. Then it will ask for the file (about.html, etc.). The server looks at the file, execute any server-side code, and send the file to your computer via Hyper-Text Transfer Protocol (HTTP). Once your browser gets the code, it will begin to 'draw' the elements inside of your window. The 'White-Flash' is the time inbetween the browser requests the page and 'draws' it inside of the window. This deals with applications, not code entirely. –  Christopher Mar 23 '12 at 7:52
    
If this has answered your question, could you please mark this as the correct answer? Unless, that is, you require more information. –  Christopher Mar 26 '12 at 7:30
    
If I understand you correctly, you confirm that it is presently impossible to avoid the "white flash" using non-AJAX-like methods. Yes? –  gus Mar 26 '12 at 11:39
    
As a webmaster with no control over what browser people use to view your website, yes. –  Christopher Mar 26 '12 at 12:54
show 1 more comment

It's best not to rely on iframes or other unnecessary structural, non-semantic complication just to avoid a variable/cosmetic issue. AJAXy methods can avoid some of those redraw issues, but if you're not willing to undertake the architectural complexity and accessibility concerns of AJAXing in large chunks of your site, then your attention is best focused on slimming down page weight via CSS optimization, minimizing file download sizes and number of HTTP connections required to get page resources, and so on.

share|improve this answer
    
webpagetest.org is great if you are looking for a fairly detailed breakdown of load "performance" and what can be slimmed –  Dallas Oct 16 '12 at 3:52
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.