Re: [css-d] FF3 FOUC
Francois Jordaan wrote: Hi, On some sites, including one I'm working on, I've noticed a Flash of Unstyled Content (FOUC) in FF3, which doesn't occur in any other browser. (This is where the page content displays unstyled for a split second before the CSS kicks in.) The site I'm working on is not yet public, but here's another example: http://www.worthing.gov.uk/visiting-worthing/ Does anyone know what causes it? francois Hi Francois, When I moved your three style sheets above your javascript block, this seemed to fix the fouc in ff3. Probably, only the content style sheet needs to be moved (and maybe sidebar), but in keeping your source code relatively consistent, I moved all three and it seemed to work fine. Hope it helps. Bill -- /** * Bill Brown * TheHolierGrail.com MacNimble.com * From dot concept...to dot com...since 1999. ***/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] FF3 FOUC
Francois Jordaan wrote: Hi, On some sites, including one I'm working on, I've noticed a Flash of Unstyled Content (FOUC) in FF3, which doesn't occur in any other browser. (This is where the page content displays unstyled for a split second before the CSS kicks in.) The site I'm working on is not yet public, but here's another example: http://www.worthing.gov.uk/visiting-worthing/ Does anyone know what causes it? francois Get it on your page in Mac Safari, Camino, as well as FF/3. Try validating the CSS; and, put all the script calls /beneath/ the last conditional comment. Interesting article about FOUC: http://webkit.org/blog/66/the-fouc-problem/ -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] FF3 FOUC
On Jun 30, 2008, at 8:13 PM, Francois Jordaan wrote: On some sites, including one I'm working on, I've noticed a Flash of Unstyled Content (FOUC) in FF3, which doesn't occur in any other browser. (This is where the page content displays unstyled for a split second before the CSS kicks in.) The site I'm working on is not yet public, but here's another example: http://www.worthing.gov.uk/visiting-worthing/ Does anyone know what causes it? Safari 3 and WebKit nightly builds also show that FOUC. I guess, as Bill Brown suggest, that moving the block of stylesheets before the block of links for the js in the source code will help. Note that it takes a loong time before that site start displaying something. I waited at least 6 seconds staring at a blank screen (both Gecko and WebKit) – and that is on fast 'net connection. Philippe --- Philippe Wittenbergh http://l-c-n.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] FF3 FOUC
On Jun 30, 2008, at 5:30 AM, Philippe Wittenbergh wrote: On Jun 30, 2008, at 8:13 PM, Francois Jordaan wrote: On some sites, including one I'm working on, I've noticed a Flash of Unstyled Content (FOUC) in FF3, which doesn't occur in any other browser. (This is where the page content displays unstyled for a split second before the CSS kicks in.) The site I'm working on is not yet public, but here's another example: http://www.worthing.gov.uk/visiting-worthing/ Does anyone know what causes it? Safari 3 and WebKit nightly builds also show that FOUC. I guess, as Bill Brown suggest, that moving the block of stylesheets before the block of links for the js in the source code will help. Note that it takes a loong time before that site start displaying something. I waited at least 6 seconds staring at a blank screen (both Gecko and WebKit) – and that is on fast 'net connection. This is because there are 13(!) javascript files being loaded before anything else. I recommend merging them all and putting them at the bottom of the page. In fact, I recommend merging all the stylesheets too. This should increase performance too. http://developer.yahoo.com/performance/ Ryan Doherty [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] FF3 FOUC
On Mon, 30 Jun 2008 12:13:46 +0100, Francois Jordaan wrote: Hi, On some sites, including one I'm working on, I've noticed a Flash of Unstyled Content (FOUC) in FF3, which doesn't occur in any other browser. (This is where the page content displays unstyled for a split second before the CSS kicks in.) The site I'm working on is not yet public, but here's another example: http://www.worthing.gov.uk/visiting-worthing/ Re: the delays people are reporting-- put the CSS high in the HEAD, the JS low in the BODY. It would also help to gzip the CSS and JS on account of the huge quantity of it. More you can do to improve response here: http://developer.yahoo.com/performance/rules.html Cordially, David -- __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
