Typograpy is a tool to the higher goal of connecting the content to the user.
Responsive designs often have the correct typography with big layouts but don't react appropriately to small layouts.
In print you pick a point and it doesn't change. In web you define a range of acceptable parameters.
Visual pixel defined by W3C as the visual angle of 0.0213 degrees. Currently we can only guess by the size of the screen. Could make a better guess by using facial recognition.
font-size: 100%; line-height: 1.5; margin-bottom: 1.5em; max-width: 38em;
40-50 characters is good for multi-column text. Doesn't work for a very narrow viewport. Put
* every X characters to see how your line length fits with a width of X characters.
Em based media queries will take account of the base font size of the browser.
Shorter line lengths need less spacing between lines and v.v. It's too tight when
ds start touching between lines. Can use a background image with a linear gradient to check vertical rhythm. Molten leading is a JS solution.
Three spaces in a text: letter space, word space, line space.
word-spacing can be used in a high dpi media query.
Use a typographic scale - 16, 18, 21, 24, 36, 48, 60, 72, ... http://www.modularscale.com
Style options: All caps, small caps, italic, bold.
Whenever there is space, people will fill it. We can balance this by creating typographic interest.
- less information: style variation, indents, white space
- more info: typographic scale, block paras, graphic elements
Web fonts are now designed for the screen - still readable at small sizes. Print has already done this for poor quality paper. You can get sub-weights for different quality of reproduction. Can vary the web font using media queries.
Sub pixel rendering changes with orientation as sub-pixels are vertical bands.
Line length changes as orientation changes. We can use different width fonts to work with this set by media queries.
Screen aspect ratio
All aspect ratios are possible - you are on your own!
This can all be a bit complicated, from time to time we need to detach and relax.