The Vision Spark

Introducing Responsive Web Typography With FlowType.JS

It’s our great pleasure to support active members of the Web design and development community. Today, we’re proud to presentFlowType.JS that allows a perfect character count per line at any screen width. This article is yet another special of our series of various tools, libraries and techniques that we’ve published here on Smashing Magazine: LiveStylePrefixFreeFoundationSisyphus.js,GuideGuideGridpakJS BinCSSComb and Jelly Navigation Menu. — Ed.

 

While working on an image-heavy site for Simple Focus, a couple of our designers, John Wilson and Casey Zumwalt, noticed how images always scaled perfectly. Pull the corner of the browser window and the images expand to fill the space. Push back the corner, they shrink and fall into place. The line length of hypertext, on the other hand, changes based on its parent element’s width, which has a negative effect on readability.