Principles of Typography
recommended reading: rhythm in web typography
Rules of Thumb:
- chunk text (analyze the text)
- organize text for visual hierarchy, create difference and repetition
- organize for rhythm and tension (explore what baseline rhythm is)
- choose 1-2 fonts (make differences with weight, size, style, color)
- create difference in text areas (contrast, proportion, space)
- keep line length to 45-90 characters per line or 10-15 words
- use padding on text boxes with borders
- for text body, use CSS rules: “line-height: 1.5;” and “text-align: left”
- create strong lines of continuance (verticals, rule lines, borders, gutters and alignment)
- avoid underline and bold for emphasis ( italic is best)
- repeat styles for similar semantic elements to create repetition
Typography Example, by Natalie Hendren
————————————————
Typography Tools & Resources:
- Lorem ipsum
- Entity Code – A Clear and Quick Reference to HTML Entities Codes
- practicaltypography.com
- how-to-pick-the-nicest-font-for-your-site?
- five-simple-steps-to-designing-grid-systems
Working with Fonts
———————————–
Build Recipe HTML
To fix iOS viewport reset, place this meta tag in <head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">