Why do webpages sometimes appear as plain HTML before a refresh

this has started happening quite frequently since a week or so. It is far from a major problem, but more of a annoyance.

Sometime, when I go on a webpage, the page seems to load as plain HTML. Then, after a refresh, the rest of the page loads.

Why is that ? Any idea on what could cause this problem ? See screenshots.

Windows 7 64 bits, using Chrome, up to date.

EDIT: Thanks for the help and suggestions. To be more specific, this is happening at work. My connection is filtered, but that's all I know.

Before Refresh:

First time visit:

After refresh:

After Refresh:

JFFF

Posted 2011-12-14T19:30:42.563

Reputation: 285

What is your router model? I have experienced similar problems with certain Linksys routers which use their own dns cache. – iglvzx – 2011-12-14T19:32:43.300

If oyu are using mobile internet eg EDGE/3G it messes up the order things down, never heard of a router doing that.. unless it is really and truly corrupted firmware on it. Or you are using a proxy. PS does the same happen in Safari(webkit engine-like chrome)... then in IE(for comparison)? – Piotr Kula – 2011-12-14T20:30:36.303

@ppumkin Yes. The Linksys WRT160N was notorious for having DNS issues. The problem is solved if you do not use the router's IP address as a DNS. – iglvzx – 2011-12-14T20:43:02.160

Answers

This happens when the CSS (stylesheet) for that page is not loaded properly. Now, why that happens is a more complex issue. You'll need to do this to troubleshoot that issue:

Open Tools | Developer Tools from Chome menu.
Switch to Network tab there
Keep that window open, browse as usual. Once you see that phenomenon again, go to that Developer tools window, and see which file was not loaded properly and why.

It could be a DNS issue, or some transparent proxy acting up, or some other problem. My own company's CDN (content delivery network) provider had issues yesterday, and it manifested itself in a similar way to what you describe here.

Since you say the issue is transient, and goes away after a refresh, it's rather hard to troubleshoot.

haimg

Posted 2011-12-14T19:30:42.563

Reputation: 19 503

do browser not prioritise CSS before rendering DOM?? Usually broken things like that is very slow connection, or a proxy that compresses the HTML,CSS an JS into one thing and causes wierd behaviour like that-- especially if you are thethering via GPRS/EDGE/3G ... – Piotr Kula – 2011-12-14T20:27:52.627

1@ppumkin: CSS indeed is loaded before rendering. However if CSS cannot be loaded, the page is rendeded anyway... And yeah, your reasons are all valid, but they are not the only ones. – haimg – 2011-12-14T20:31:47.630

There is an old problem with .css files which appears on some browsers depending of how are loaded or declared the .css documents containing the style rules.

This is called the "Flash of unstyled content (FOUC)". This concept has even a dedicated Wikipedia page with links to additional sources of information.

According to your screenshot, this seems to be the problem that you are suffering. The problem can only be corrected doing the necessary changes in the page source, so you can't solve it.

jap1968

Posted 2011-12-14T19:30:42.563

Reputation: 827

I'm not 100% sure, but perhaps you're having issues downloading the javascript or CSS for the site. Sometimes (for big companies) the CSS & javascript are stored on a 3rd party "CDN" (content delivery network)... which frequently end up on "ad-blocking" lists by accident. Have you tried disabling ad-blocking software? Perhaps you have some nasty-bug on your machine... and it's redirecting web-traffic.

TheCompWiz

Posted 2011-12-14T19:30:42.563

Reputation: 9 161

Not sure who down voted you but your answer, in this context(as the OP did not specify anything) is viable. +1 , because i have seen that happen before. – Piotr Kula – 2011-12-14T20:29:25.450

I've had this problem also. I had a utility called Privacy Badger installed on Chrome. As soon as I disabled it, my pages loaded properly again.

Brian

Posted 2011-12-14T19:30:42.563

Reputation: 1

I had this issue with Chrome on a Windows 7 laptop. Some (many) websites would only display basic HTML, other showed normally. My Firefox browser displayed everything normally though. Following TheCompWiz' suggestion I checked my ad-blocker plugin (Adblock Plus). In its Settings -> Advanced menu I clicked 'Update Filter Lists' (hadn't been updated in a while). After updating all problematic websites display normally again.

Jeroen

Posted 2011-12-14T19:30:42.563

Reputation: 1

This usually happens when Chrome thinks that it has data in the cache that is not actually there (I experience this when I clear the browser cache in the OS instead of in Chrome, but it can also happen if the cache is flagged or not updated incorrectly).

Refreshing usually fixes it, but if not, then just clear the cache (Ctrl+Shift+Delete), then refresh.

Bobson

Posted 2011-12-14T19:30:42.563

Reputation: 709