homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

GIANT <h1> tags reduced in stylesheet BUT..
resizing heading tags prior to complete browser load..

10+ Year Member

Msg#: 6006 posted 1:53 pm on Mar 18, 2005 (gmt 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.





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

Msg#: 6006 posted 1:59 pm on Mar 18, 2005 (gmt 0)

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.
Longhaired Genius

10+ Year Member

Msg#: 6006 posted 2:04 pm on Mar 18, 2005 (gmt 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.


10+ Year Member

Msg#: 6006 posted 2:24 pm on Mar 18, 2005 (gmt 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.


Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved