bolder/lighter defintion

In the past we've discussed how to define bolder/lighter unambiguously. 
Andrey Mikhalev brought this up recently in his CSS21 pity mail:

http://lists.w3.org/Archives/Public/www-style/2009May/0030.html

Regarding bolder, he wrote:

> the weight metric is independent from font[family].
>       as value of independent metric, 'bolder' SHOULD result next numerical
>       value.

This is not actually correct, all previous definitions ([1], [2], [3])
have defined bolder/lighter in a way that makes the calculation for
bolder/lighter dependent upon the weights available within a given
family.  Which family to use, in turn, is a function of the text
contained within an element, and it can vary as depending upon the exact
set of characters used.  In short, this simple attribute becomes very
confusing to understand and implement.

The solution to this problem I proposed at the last F2F was to replace
the bolder/lighter definitions with a simple mapping that's independent
of the font family in use.  It's equivalent to running the existing font
matching algorithm using a family with weights 100, 400, 700 and 900.

This is my proposed wording:

>
> Values of 'bolder' and 'lighter' indicate values relative to the weight
> of the parent element.  Based on the inherited weight value, the weight
> used is calculated using the chart below.  Child elements inherit the
> calculated weight, not a value of 'bolder' or 'lighter'.
> 
>   Inherited value   bolder  lighter
>   100               400     100
>   200               400     100
>   300               400     100
>   400               700     100
>   500               700     100
>   600               900     400
>   700               900     400
>   800               900     700
>   900               900     700
>   
> The table above is equivalent to selecting the next relative bolder or
> lighter face, given a font family containing normal and bold faces along
> with a thin and a heavy face. Authors who desire finer control over the
> exact weight values used for a given element should use numerical values
> instead of relative weights.
>

For situations where only two weights exist, normal and bold, this will
lead to the same behavior as the previous definitions, with the exception
of the behavior in complicated nested elements that we've discussed
before.  It results in a computed weight that is a valid weight.  For
fonts with several weights it separates those into clearly distinct
levels, ones with a perceivable difference in weight (e.g. jumping from
normal to medium isn't as clear as normal to bold).

Regards,

John Daggett
Mozilla Japan

Previous definitions of bolder/lighter:

[1] CSS2 (12 May 1998)
http://www.w3.org/TR/1998/REC-CSS2-19980512/fonts.html#font-styling

> bolder
>     Specifies the next weight that is assigned to a font that is darker
>     than the inherited one. If there is no such weight, it simply
>     results in the next darker numerical value (and the font remains
>     unchanged), unless the inherited value was '900', in which case the
>     resulting weight is also '900'. 
> 
> lighter
>     Specifies the next weight that is assigned to a font that is lighter
>     than the inherited one. If there is no such weight, it simply
>     results in the next lighter numerical value (and the font remains
>     unchanged), unless the inherited value was '100', in which case the
>     resulting weight is also '100'. 
    
[2] CSS 2.1 Fonts (19 July 2007)
http://www.w3.org/TR/2007/CR-CSS21-20070719/fonts.html

> Since the intent of the relative keywords 'bolder' and 'lighter' is to
> darken or lighten the face within the family and because a family may
> not have faces aligned with all the symbolic weight values, the matching
> of 'bolder' is to the next darker face available on the client within
> the family and the matching of 'lighter' is to the next lighter face
> within the family. To be precise, the meaning of the relative keywords
> 'bolder' and 'lighter' is as follows:
> 
>     * 'bolder' selects the next weight that is assigned to a font that
>       is darker than the inherited one. If there is no such weight, it
>       simply results in the next darker numerical value (and the font
>       remains unchanged), unless the inherited value was '900' in which
>       case the resulting weight is also '900'.
>       
>     * 'lighter' is similar, but works in the opposite direction: it
>       selects the next lighter keyword with a different font from the
>       inherited one, unless there is no such font, in which case it
>       selects the next lighter numerical value (and keeps the font
>       unchanged).
> 
> There is no guarantee that there will be a darker face for each of the
> 'font-weight' values; for example, some fonts may have only a normal and
> a bold face, while others may have eight face weights. There is no
> guarantee on how a UA will map font faces within a family to weight
> values. The only guarantee is that a face of a given value will be no
> less dark than the faces of lighter values.
> 
> The computed value of "font-weight" is either:
> 
>     * one of the legal number values, or
>     * one of the legal number values combined with one or more of the
>       relative values (bolder or lighter). This type of computed values is
>       necessary to use when the font in question does not have all weight
>       variations that are needed.
> 
> CSS 2.1 does not specify how the computed value of font-weight is
> represented internally or externally.

[3] CSS 2.1 Fonts (23 April 2009)
http://www.w3.org/TR/2009/CR-CSS2-20090423/fonts.html

> Since the intent of the relative keywords 'bolder' and 'lighter' is to
> darken or lighten the face within the family and because a family may
> not have faces aligned with all the symbolic weight values, the matching
> of 'bolder' is to the next darker face available on the client within
> the family and the matching of 'lighter' is to the next lighter face
> within the family. To be precise, the meaning of the relative keywords
> 'bolder' and 'lighter' is as follows:
> 
>     * 'bolder' selects the next weight that is assigned to a font that
>       is darker than the inherited one.
> 
>     * 'lighter' is similar, but works in the opposite direction: it
>       selects the next lighter keyword with a different font from the
>       inherited one.
> 
> There is no guarantee that there will be a darker face for each of the
> 'font-weight' values; for example, some fonts may have only a normal and
> a bold face, while others may have eight face weights. There is no
> guarantee on how a UA will map font faces within a family to weight
> values. The only guarantee is that a face of a given value will be no
> less dark than the faces of lighter values.
> 
> Note: A set of nested elements that mix 'bolder' and 'lighter' will give
> unpredictable results depending on the UA, OS, and font availability.
> This behavior will be more precisely defined in CSS3.
> 
> CSS 2.1 does not specify how the computed value of font-weight is
> represented internally or externally.

Received on Monday, 18 May 2009 14:01:04 UTC