Welcome to WebmasterWorld Guest from

Forum Moderators: not2easy

Message Too Old, No Replies

GIANT <h1> tags reduced in stylesheet BUT..

resizing heading tags prior to complete browser load..

1:53 pm on Mar 18, 2005 (gmt 0)

Junior Member

10+ Year Member

joined:Nov 20, 2004
votes: 0

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.



1:59 pm on Mar 18, 2005 (gmt 0)

Senior Member from CA 

WebmasterWorld Senior Member encyclo is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Aug 31, 2003
votes: 6

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
element placed before your imported stylesheet in the source code.
2:04 pm on Mar 18, 2005 (gmt 0)

Preferred Member

10+ Year Member

joined:Aug 28, 2002
votes: 0

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.
2:24 pm on Mar 18, 2005 (gmt 0)

Junior Member

10+ Year Member

joined:Nov 20, 2004
votes: 0

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,
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.