Font Sizes in Web Design

Discussion in 'HTML & Website Design' started by austin-G, Feb 26, 2009.

  1. #1
    Do you use a fixed font size (such as 14px) or a dynamic font size (such as 100%, 1em)?

    I used to use a fixed font size until I learned that it was a bad practice. I now use a dynamic font size.
     
    austin-G, Feb 26, 2009 IP
  2. GameSlim

    GameSlim Peon

    Messages:
    95
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Hmmm.. I used fixed font sizes in all of my sites and never thought it would be a problem. But now that you mentioned it, this post should be interesting.
     
    GameSlim, Feb 26, 2009 IP
  3. austin-G

    austin-G Peon

    Messages:
    435
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Here's an example of why you shouldn't use fixed:

    What if people older than you (and with old eyes) are viewing your site? They will have a higher default font size, because they can't see as well. You don't want to give them 14px font because they probably wouldn't be able to read it. Instead, you want to give them dynamic font so that it will be larger for them.
     
    austin-G, Feb 27, 2009 IP
  4. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #4
    While this was an issue in browsers that didn't allow font resizing when the font was set in px (IE), all current browsers do allow font resizing so setting in px does not prevent it. em can resume its job as allowing an element to maintain a relationship with other element sizes.
     
    drhowarddrfine, Feb 27, 2009 IP
  5. PHPGator

    PHPGator Banned

    Messages:
    4,437
    Likes Received:
    133
    Best Answers:
    0
    Trophy Points:
    260
    #5
    Your font should NEVER regardless of how old the person is and outside of blind people have a difficult time reading your website. The font here on DP is about the right size and is fixed. People want to go smaller and it causes problems such as the ones you are mentioning.

    The problem with font sizes that aren't fixed is that it can cause design problems.
     
    PHPGator, Feb 27, 2009 IP
    rebelagent likes this.
  6. austin-G

    austin-G Peon

    Messages:
    435
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    0
    #6
    A good design will be able to fit any font size.

    The only difference is that a dynamic font size will automatically scale to the user's default font size. A fixed font size will ignore the user's preference (but they can still scale the font manually).
     
    austin-G, Feb 27, 2009 IP
  7. rebelagent

    rebelagent Well-Known Member

    Messages:
    876
    Likes Received:
    46
    Best Answers:
    0
    Trophy Points:
    165
    #7
    Agreed. If you have site that has a font smaller than 12px you must really intend for the audience not to read it. 12px is the standard and the average internet user can read it. Personally I've never gone smaller than 10px. I used 10px when I was younger because it was a "cute" sized font that all my friend's used. Now I see the error of my ways and I only use 12px.

    Most modern day browsers will adjust the text size no matter how your font is set. I've even run into a program for the visually impared that will change the font family.

    I prefer to set my font instead of dynamically and always have because it messes with my design in the long run. I'm just too lazy to do it for my personal sites. Professionally I will do this if the site is intended for a visually impared audience but I've not yet run into that. Most of the sites I've done are for ecommerce and bands. They don't generally intend to cater to the visually impared. But I have my computer set at 150% magnification for my boss and all the sites actually enlarge. So there's no problem. I use IE7 and the latest FF and Opera.
     
    rebelagent, Feb 27, 2009 IP
  8. PHPGator

    PHPGator Banned

    Messages:
    4,437
    Likes Received:
    133
    Best Answers:
    0
    Trophy Points:
    260
    #8

    That's not necessarily true. Take the headers of the forum for example. Look at the post above mine that has this written: "Today, 1:50 pm" <- could be different depending on your time setup.

    If you were to take that and not have it as a fixed size that text would either go outside of the middle of that header, or it would cause that header to tile underneath itself giving a really jacked up look to it. There are ways that text size can break the way a design should be intended to look, no matter how great of a XHTML/CSS coder you are.
     
    PHPGator, Feb 27, 2009 IP
  9. austin-G

    austin-G Peon

    Messages:
    435
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    0
    #9
    Are you sure?

    [​IMG]

    Seems to look fine to me, I scaled the font.
     
    austin-G, Feb 27, 2009 IP
  10. Kurg

    Kurg Member

    Messages:
    260
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    33
    #10
    I specify a font size, I like 12px as a general rule. Todays browsers can over-ride that setting if the end user wants bigger and if they lower the browser size to 800px in width the text is HUGE anyway.

    Nobody has ever complained!
     
    Kurg, Feb 27, 2009 IP