I have strategically placed a splash page with valued content, articles, and information about our internal store using headings nicely. h1 is resized to size 8 and uses our keywords immediately before our logo: Example: Widgets by: (logo). Then the categories are in h2 tags. all other subsequent info is in h3 tags with much content in the h3 tags in articles with xselling to our products in our store.
The site looks very professional and rivals (in my opinion) the look of a major corporations website and functionality.
However I have a HUUUUUUUUGE problem, literally!
All the tags resize perfectly the way I want them to. However when the browser first loads - I notice that my heading2 (h2) tags do not resize until the page is completely loaded. Tags prior to and after all are resized right on browser initial hit on the website, it's only the h2 tags that resize. When you are on a dialup connection waiting for the one lone jpg to load, these h2 tags make my site look like someone who read the book 'how to design websites in 7 days'. Any suggestions as to why this is happening. I've never had this problem before with headings - and just recently can not figure this out or recreate using different headings in teh same table etc.
Sounds like a case of "FOUC", or "Flash of Unstyled Content". The definitive guide is over here [bluerobot.com]. The basic solution is to have a <script> element placed before your imported stylesheet in the source code.
I would say: don't put "all other subsequent info" in h3 tags. It doesn't make sense to have a page composed of nothing but headings. That might make a difference or it might not. Personally, I wouldn't worry about it, I think people are getting used to this phenomenon.
Its not an entire page of h3 tags. The site structure is like this
H1 tag (8pxs)with my main keyword as a 3 word phrase, Logo H2 tags (10pxs)with main categories.(links) Two small jpgs and the sites main splash jpg end of table - 1 px border well fitting site. Style - information ¦ contact us etc etc H3 tags (12pxs)- our entire catalog(links) H3 tags - articles of interest(links) H4 tags (10pxs) - The about us Style - (10pxs)The about us statement approximately 250 words.
Thanks for the info about that missing style tag..maybe tahts what it is. I use dreamshatter to do all my pages and hop back and forth from codeview to design. It LOVES to add additional styles whenever you accidently click somewhere instead of adding it directly to the stylesheet you define. lame.