Correct responsive typography with FlowType.JS

According to the rules of typography, the page content is well read, if the line is from 45 to 75 characters. When developing an adaptive design, it is difficult to implement it only with the help of Media Queries. There was a jQuery plugin FlowType , which helps to achieve this ratio for any screen size and window width.

FlowType changes the font size and line spacing according to the width of the content block. In addition, you can set the parameters of the plugin, for example, the maximum and minimum width of the window at which FlowType will work.
')

$('body').flowtype({ minimum : 500, maximum : 1200 }); 

As well as the limits of font sizes on the page:

 $('body').flowtype({ minFont : 12, maxFont : 40 }); 

Due to the fact that all fonts are different, it is sometimes advisable to set a certain factor that will scale the font and line spacing on the page for better readability:

 $('body').flowtype({ fontRatio : 30, lineRatio : 1.45 }); 

FlowType is an open source project ( page on GitHub ), distributed under the MIT license . Demonstration where all content is scaled by the plugin.