Responsive typography extends naturally from the idea of responsive design, a term first appropriated to the field of graphic design by Ethan Marcotte, which he took from his observations in a different field, responsive architecture. The main idea is simple: a single webpage being displayed on multiple devices, each with a different-sized viewport, must adapt to function in its different environments. The previous answer to the question was to maintain a separate mobile friendly site, possibly further distinguishing it with a .mobi domain. (I can’t think of anyone offhand who presently does this.)
- Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.
- Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.
- Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam, gravida non, commodo a, sodales sit amet, nisi.
- Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.
The current method uses CSS media queries to get a sense for how large a screen the site visitor is seeing. If it’s large, the code styles the page to show everything you’d expect browsing the web with a desktop computer. If it’s small, the styling changes the body text to take up the full column and sizes it to be readable on the small screen. It likely also pares back the user interface to its essential or most useful elements given the context.
Such a set of media queries only takes into account the size (and perhaps tangentially, the resolution or orientation) of the screen, but as new thought on the subject is pointing out, there are a number of other factors to which screen media can and indeed ought to respond. Nick Sherman gave one example, the distance from the reader’s face to the reading surface, in a talk last week at ATypI. The proof of concept was done by Marko Dugonjić. Also, the way a layout or composition responds to its environment or viewing conditions is something still completely underexplored. We’ll pick up this discussion next week, and I’ll get a into the practice of how responsive typography is done. That’s it for now. Using Type continues here Thursday. Thanks to Alda for setting the title.