What is Typography?

Typography is more than just the typefaces that are used and the whitespace around them. There are also some other things you should keep in mind when creating a good typographic system for any design:

Hyphenation: Hyphenation is the addition of a hyphen (-) at the end of lines to help prevent problems in readability or make justification look better. While commonly found in printed documents, most web designers ignore hyphenation and do not use it in their work because it is not something that is handled well automatically by web browsers.

Rag: The uneven vertical edge of a block of text is called the rag. When paying attention to typography, you should look at your text blocks as a whole to make sure that the rag is not impacting the design. If the rag is too jagged or uneven, it can affect the readability of the text block and make it distracting. This is something that is automatically handled by the browser in terms of how it raps type from line to line.

Widows and Orphans: A single word at the end of a column is a widow and if it's at the top of a new column it's an orphan. Widows and orphans look bad and can be hard to read.

Getting your lines of text to display perfectly in a web browser is a grueling proposition, especially when you have a responsive website and different displays for different screen sizes. Your goal should be to review the site at different sizes to try to create the best look possible, while accepting that in certain cases your content will have windows, orphans, or other less-than-ideal displays. Your goal should be to minimize these aspects of a type's design, while also being realistic in the fact that you cannot achieve perfection for every screen size and display.