Page 54

97

Designing for the Web ~ Typography

98

Style and weight Typeface weights are the different styles within a typeface family. It can be confusing, as the term ‘weight’ does not mean ‘more bold’, or ‘heavier’. Many typefaces have a core set of weights: Roman, (normal weight), Italic, Bold, Bold Italic and Small caps. There are many variations to this, and many typefaces have a huge range of weights, from Thin, through to Extra Bold, from Ornamentals to Ligatures. Typeface weight, and the choice of weight, is perhaps one area of typography that to most designers is simply a matter of choice—they are presented with an entire family of weights within a typeface to choose from. That choice is often dictated by answering a design problem that is aesthetically or content—motivated. Maybe a designer wants to set some headlines in ALL CAPS just for some variation; all he has to do is choose that weight from a dropdown or to define it in their CSS. What many designers do not realise is that there are rules which should govern the choice of weight, (a typographic pecking order), which when followed, aid the designer’s typesetting and can produce stunning results.

Solving the design problem Let’s start by addressing the root of the decision to set type in different weights to solve a design problem. I mentioned that this problem stems from two main concerns: ß An aesthetic problem. The designer sets type in a certain weight to add style or solve some kind of visual or compositional issue. ß A content problem. The designer needs to set a different weight because the content dictates it. The main reasons are that the language of the content may dictate special typographic treatment, the tone of voice may be different, it may be a quote, or it may be a structural device such as an unordered list. There may be other reasons as well, but I believe these are the main cause. licensed to Denis (1 user license)

Profile for anh7

Five simple steps designing for the web  

Designing for the web

Five simple steps designing for the web  

Designing for the web

Profile for anh7