I am using ASP.NET 3.5 with JQuery, JS files, CSS files and lots of images for my background. For some reason when you first load your page everything is out of wack until you have finished loading everything on the page.
Thanks in advanced!
The reason is that CSS styles, scripts and images have not been fully downloaded. The browser shows HTML without styles and this is why you get the weird look. Once everything is downloaded and interpreted, everything suddenly falls into place.
You should somehow reduce the size of your dependencies ideally. Or use faster connection for your server, but the latter can be quite expensive.
There are some things you can do to reduce the download time to minimise this problem.
You can minify your javascripts:
reduce the amount of resources being downloaded by combining javascripts. You can also combine CSS files if possible.
The ySlow firefox plugin can analyse your site for you and give suggestions on some of the things you can do:
http://developer.yahoo.com/yslow/
You may also want to look at turning on GZIP compression if it is not already:
The CSS styles are not being applied soon enough. If you refer to this post on google groups it advises to add the styles manually:
<ul class="ui-tabs-nav"> ... </ul>
<div class="ui-tabs-panel"> ... </div>
One method I have seen before is to embed the main content of the page in a div, which is initially set to be invisible
<div id="mainPageDiv" style="display:none;">
<form id="form1" runat="server">
... Your content here...
</form>
</div>
Then, on the page load event in javascript, you set the main div to be visible.
<body onload="document.getElementById('mainPageDiv').style.display='block';">
I am not sure exactly effective this would be though. One drawback would be the users would be present with a totally white screen for a short-while, possibly leading them to think there was a problem.