Grow your CSS skills. Land your dream job.

Which fonts are best to use for heading tags?

  • # January 22, 2009 at 6:38 pm

    Hi Guys I have always been concerned that I might be using font styles that are not suitable for heading tags i.e. <h1> <h2> <h3> <h4>.

    What do you all use?

    Is there rule like using serif or sans serif etc

    Be great to know what people think as I think that typography is very important in web design.

    Simon

    # January 23, 2009 at 2:29 am
    "bancom" wrote:
    Hi Guys I have always been concerned that I might be using font styles that are not suitable for heading tags i.e. <h1> <h2> <h3> <h4>.

    What do you all use?

    Is there rule like using serif or sans serif etc

    Be great to know what people think as I think that typography is very important in web design.

    Simon

    My general rule is, use lots cause you don’t know what other may have on their system, but do it in the order you want them to be seen.

    but it is totally u to you on how you want your titles to look

    # January 23, 2009 at 3:16 am

    It really depends on where you use them. It also depends on if you use <h1> as your link to index in your header (which would remain constant throughout the site) or if you use it to name each page.

    I use <h1> as the link back to index (just like this site does).

    My <h2> I use as the title of the page. I generally have <h2> and <h3> sans-serif, nice and bold, the <h3> being slightly smaller in size than the <h2>

    For my <h4> I usually go with a serif like Georgia (love Georgia). I use this for little tag lines or dates. Usually the same size as the main text, if not a touch bigger.

    Does that answer your question? I wasn’t quite sure where you were going with it haha.

    Rob
    # January 23, 2009 at 6:14 am

    I would put my site header in <h1> then my news posts in <h2> – I rarely use much else.

    SEO wise, its good to use them in this way as google (other search engines are avalible) will be looking at it like that.

    Heres a good guide…

    http://www.seomoz.org/blog/the-web-deve … heat-sheet

    Fonts wise – if my Header tag is isnt turned into an image, then I like a clean font that is in one of the recomended families :) – other than that its down to your creative ideas…

    # January 26, 2009 at 11:21 am

    Personally I prefer to make my headings easy to read and simple, if I want them to look cool/eye catching I will use a graphic. For simple text I use simple cleans fonts usually, Calibri,Arial,Helvetica,Sans-Serif; I find this gives a nice outcome. It does vary on the content of the page though…

    # January 27, 2009 at 12:35 am

    Personally, I like to use Garamond with a normal font-weight for h# tags, but unfortunately it’s not a universal font.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".