They say the typography of a website matters big time. Today we’re gonna present you the most essential typography tutorials and tools to put up a great font combination and special effects using HTML5/CSS3. Most importantly, controlling the typography for responsive web design, we got that covered. They’re not just about the typography itself but more than combining them with the page/column layout to get a great result.
You May Also Like:
- 21 Step-by-Step HTML5 Tutorials to Quickly Get Started
- 15 Useful jQuery Parallax Plugins and Tutorials to Create a WOW Factor
- Top 14 Excellent Free Wireframe Tools Designers/Developers Must Try
The Basic Web Typography Guidelines and Tools
The following two are more like a technical guide but you can easily get the idea, why not start off with the baseline/grid in mind. This can help you build a great typography that fits the layout and acceptable by majority of viewers.
Typography Effects Tutorials with HTML5/CSS3
Control Typography in Responsive Design
Tools for Responsive Typography and Effects
SlabText splits headlines into rows before resizing each row to fill the available horizontal space. The ideal number of characters to set on each row is calculated by dividing the available width by the CSS font-size – the script then uses this ideal character count to split the headline into word combinations that are displayed as separate rows of text.
Arctext.js is a jQuery plugin that let’s you do exactly that. Based on Lettering.js, it calculates the right rotation of each letter and distributes the letters equally across the imaginary arc of the given radius.
Kerning enables you to manipulate singe letters in a word, in many different ways.
☺Medley Web Design Blog☺