indicação de site TIPOGRAFIA
Autor: .: | Publicado: 2014-05-03T11:01:00-07:00



Typography in ten minutes






This is a bold claim, but I stand be­hind it: if you learn and fol­low these five ty­pog­ra­phy rules, you will be a bet­ter ty­pog­ra­ph­er than 95% of pro­fes­sion­al writ­ers and 70% of pro­fes­sion­al de­sign­ers. (The rest of this book will raise you to the 99th per­centile in both&nbsp;categories.)All it takes is ten min­utes—five min­utes to read these rules once, then five min­utes to read them&nbsp;again.


Note to new vis­i­tors: This book isn’t sup­port­ed by ban­ner ads. It’s sup­port­ed by read­ers like you. If you find this tu­to­r­i­al valu­able, see&nbsp;how to pay for this book.And of course, don’t over­look the oth­er ma­te­r­i­al—see&nbsp;the&nbsp;ta­ble of con­tents.



Ready?&nbsp;Go.


The ty­po­graph­ic qual­i­ty of your doc­u­ment is de­ter­mined large­ly by how the&nbsp;body text&nbsp;looks. Why? Be­cause there’s more body text than any­thing else. So start every project by mak­ing the body text look good, then wor­ry about the&nbsp;rest.

In turn, the ap­pear­ance of the body text is de­ter­mined pri­mar­i­ly by these four ty­po­graph­ic&nbsp;choices:


point size&nbsp;is the size of the let­ters. In print, the most com­fort­able range for body text is&nbsp;10–12 point. On the web, the range is&nbsp;15–25 pix­els. Not every font ap­pears equal­ly large at a giv­en point size, so be pre­pared to ad­just as&nbsp;necessary.


line spac­ing&nbsp;is the ver­ti­cal dis­tance be­tween lines. It should be&nbsp;120–145%&nbsp;of the point size. In word proces­sors, use the “Ex­act” line-spac­ing op­tion to achieve this. The de­fault sin­gle-line op­tion is too tight; the 1½-line op­tion is too loose. In CSS, use&nbsp;line-height.


line length&nbsp;is the hor­i­zon­tal width of the text block. Line length should be an av­er­age of&nbsp;45–90 char­ac­ters&nbsp;per line (use your word-count func­tion) or&nbsp;2–3 low­er­case al­pha­bets, like&nbsp;so:

abcde­fghijklmnopqrstu­vwxyz­abcde­fghijklmnopqrstu­vwxyz­abcd

In a print­ed doc­u­ment, this usu­al­ly means&nbsp;page mar­ginslarg­er than the tra­di­tion­al one inch. On a web page, it usu­al­ly means not al­low­ing the text to flow to the edges of the brows­erwindow.


And fi­nal­ly, font choice. The fastest, eas­i­est, and most vis­i­ble im­prove­ment you can make to your ty­pog­ra­phy is to ig­nore the fonts that came free with your com­put­er (known as&nbsp;sys­tem fonts) and buy a pro­fes­sion­al font (like my fonts&nbsp;eq­ui­tyand&nbsp;con­course, or oth­ers found in&nbsp;font rec­om­men­da­tions). A pro­fes­sion­al font gives you the ben­e­fit of a pro­fes­sion­al de­sign­er’s skills with­out hav­ing to hire&nbsp;one.

If that’s im­pos­si­ble, you can still make good ty­pog­ra­phy with sys­tem fonts. But choose wise­ly. And nev­er choose&nbsp;times new ro­man&nbsp;or Ar­i­al, as those fonts are fa­vored only by the ap­a­thet­ic and slop­py. Not by ty­pog­ra­phers. Not by&nbsp;you.



That’s it. As you put these five rules to work, you’ll no­tice your doc­u­ments start­ing to look more like pro­fes­sion­al­ly pub­lished&nbsp;material.

Then, if you’re ready for a lit­tle more, try the&nbsp;sum­ma­ry of key rules.



If you’re ready for a lot more, start at the&nbsp;fore­word&nbsp;and&nbsp;keep reading.&nbsp;TIPOGRAFIA&nbsp;(fonte)