SitePoint Sponsor

User Tag List

Results 1 to 7 of 7

Thread: font-weight:100

  1. #1
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)

    font-weight:100

    I'm always looking to shave bites. Instead of saying normal I'm going to say 100 from now on. Extremely small detail. But a detail that has eluded me for 10 years.

  2. #2
    Mouse catcher silver trophy Stevie D's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    5,882
    Mentioned
    122 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by EricWatson View Post
    I'm always looking to shave bites. Instead of saying normal I'm going to say 100 from now on. Extremely small detail. But a detail that has eluded me for 10 years.
    Except that, technically speaking, font-weight:100; is not the same as font-weight:normal;. (Although in practical terms, it might as well be!)

    Font-weight has a scale from 100 to 900 (no idea why they didn't just use 1 to 9, as it only allows multiples of 100). A weight of 400 corresponds to 'normal' and a weight of 700 corresponds to 'bold'. Other numbers on the scale can be for varying degrees of light, book, semibold, extrabold etc.

    Where a font doesn't have those extra weights built in then browsers should use the nearest matching weight. I do have a handful of fonts that come in a variety of weights, but the computer doesn't recognise them as being variants of the same font, but different fonts, so the browser doesn't know that 'Gotham Book / 100' is actually 'Gotham Light', for example. I haven't yet seen an example of this working properly in practice, to give anything other than 'regular' and 'bold', except that some browsers will try to fake a semibold for weight:500, but just like when the OS tries to fake an italic or bold face for a font that doesn't have one, these look awful.

    So yes, by all means use font-weight:100;, but there is a one-in-a-billion chance that someone, somewhere, might see it in the wrong variant of the font. If you're worried about that one-in-a-billion chance, using font-weight:400; won't cost you an extra bytes.

  3. #3
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Stevie D View Post
    Except that, technically speaking, font-weight:100; is not the same as font-weight:normal;. (Although in practical terms, it might as well be!)

    Font-weight has a scale from 100 to 900 (no idea why they didn't just use 1 to 9, as it only allows multiples of 100). A weight of 400 corresponds to 'normal' and a weight of 700 corresponds to 'bold'. Other numbers on the scale can be for varying degrees of light, book, semibold, extrabold etc.

    Where a font doesn't have those extra weights built in then browsers should use the nearest matching weight. I do have a handful of fonts that come in a variety of weights, but the computer doesn't recognise them as being variants of the same font, but different fonts, so the browser doesn't know that 'Gotham Book / 100' is actually 'Gotham Light', for example. I haven't yet seen an example of this working properly in practice, to give anything other than 'regular' and 'bold', except that some browsers will try to fake a semibold for weight:500, but just like when the OS tries to fake an italic or bold face for a font that doesn't have one, these look awful.

    So yes, by all means use font-weight:100;, but there is a one-in-a-billion chance that someone, somewhere, might see it in the wrong variant of the font. If you're worried about that one-in-a-billion chance, using font-weight:400; won't cost you an extra bytes.
    True -true. I tested it. In FX at least the only size difference point is at 700 it goes to bold. So most likely in all browsers you could give a range from 100 - 600 for normal. But yes to be extra safe 400 is the most technically correct. Of course I could see some browser getting that wrong to in some inherited mess. They can't make it lighter than 400. So 100 could actually be the safest in a billion chance that one got it wrong. My backwards thinking maybe.

  4. #4
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,791
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    Actually Eric,

    The problem is you will be doing something that is technically wrong for the sake of shaving off a few characters from your code. the numbers in font-weight property actually refer to specific font weights of a font family, an attribute in a FONT FILE, so you are betting the accuracy of your design on an error of omission. Not only is this wrong in principle , but it could lead to headaches in future updates. If you ever decide to take full advantage of web fonts, you will have to back an fix all instances of the "shortcut" code. The other problem is that some users MAY have that font family installed ... however rare the case.. and these users will see some ultra light version of the font ( the one equivalent with the number used) and not erroneously, but because it what you code actually specified.

  5. #5
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    400 it is then. Problem solved

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,120
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    If you want to save on bytes, just use the font: shorthand. No need to specify font weight at all.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  7. #7
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    If you want to save on bytes, just use the font: shorthand. No need to specify font weight at all.
    Well the only time you have to say font weight normal is when your overwriting bold. So font shorthand would really not apply here.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •