Awesome Web Typography @SXSW
Richard Rutter of fontdeck.com taught a class about web typography at SXSW'13. He showed us some great examples of when and how to tweak your typography with HTML and CSS.
A few things I learned:
- adjusting auto-hyphenation
- responsive web design - adjusting for line length, line breaks, etc. when on different sized screens
- how to handle multiple columns
- proportional/tabular/lining/old style
- how to choose font faces for the web
- options for loading custom fonts so that the experience is good even on slow internet connections
My notes:
HTML5: Perks + Graceful Degradation
From Smashing Magazine, some of the lesser-known delights of HTML5:
- <a> is a block element
- placeholder text within forms (I’m very excited about this one!)
- improved method for defining page sections
My favorite update is that the W3C guidelines dedicates an entire section to compatibility and graceful degradation.
It’s time to celebrate the end of the myth of cross-browser consistency. Adaptive design used to be about designing for IE vs. Firefox and 800x600 vs. 1024x768. But that’s all changed with the new proliferation of devices such as mobile phones, tablets, high resolution monitors, dashboard displays, and web TV.
It’s not longer just the web developer’s challenge to make sure that everything looks exactly the same across all browsers and devices. The designer must work in tandem to ensure that the user experience adapts smoothly across the many devices through which we now live.
wordmark.it
Use your HTML5-compatible web browser to preview the fonts on your computer. It’s like FastFontPreview, but more awesome because there’s nothing to install.
From its creator:
Wordmark.it detects fonts with the aid of a flash script by Marko Dugonjić. It also uses Remy Sharp's font detection script.