

How to Improve Typography In Your Designs - kivivi
http://www.smashingmagazine.com/2009/04/03/8-simple-ways-to-improve-typography-in-your-designs/

======
daleharvey
smashing magazine lists are usually pretty bland but I liked this one, some
common sense but non obvious tips.

Laying out a good grid is fundamental to good design, you dont have to know
how to make fancy illustrations et but you can make a solid professional
design with just a little consideration about the grid.

It saves people like me who value design but are terrible at coming up with
creative aesthetics.

------
sh1mmer
This is some good advice.

However, I would say you need to use something like YUI-Fonts
(<http://developer.yahoo.com/yui/fonts>) before you go mucking about with font
sizing in browsers. This is because it varies across browsers.

------
celoyd
This is partly very good advice, but think again before trying what it says
about blockquotes, emphasis, and good rag.

Blockquotes: because there are no guarantees about fonts and sizes, the pixel
outdent you find may be annoyingly wrong for the reader. (Also, blockquotes
shouldn’t be quoted.)

Emphasis: use em or i. Specializing span like that will give you unwanted
italics whenever people (correctly) use span to carry things like classes.

Good rag: again, you simply do not know how text will be rendered on the other
end. It will vary with font selection, font size preference, UI scale, window
size, rendering engine, text rendering engine ... this kind of pixel-tuning is
wasted effort in CSS. If it really matters, use PDF, Flash, TeX, or paper.

~~~
quizbiz
Is there a difference between <em> and <i>?

~~~
dangrover
<i> indicates that something is italic in its presentation. <em> indicates
that something is emphasized and nothing more -- it may or may not be
italicized in its presentation.

The trend for HTML/XHTML is away from markup that denotes the presentation of
something and toward markup that denotes the meaning. In i/em matters it's a
pedantic discussion, but in recent standards, tags like <font> and <center>
are removed entirely.

~~~
quizbiz
So <em> can be refined through css?

~~~
pmjordan
Either can, technically. Redefining the "italics" tag to be rendered as, say,
smallcaps, is, however, not especially sensible. What you mean to be doing is
placing an emphasis, however you may want to style that.

------
brandonkm
I've found the 'The Elements of Typographic Style Applied to the Web' to be
immensely useful. <http://webtypography.net/toc/>

