Sometimes the web feels like a typewriter or, perhaps more fittingly, like Microsoft Word. It feels as if we don’t have the level of control we enjoyed in the days of layout for print using InDesign.
But browsers are catching up, and in places where they're still too far behind, people are building tools with JavaScript (called 'polyfills') to give us what we need. Here are a couple of fun polyfills for typography enthusiasts that are well worth checking out...
01. Lettering.js
If you are the type of person who itches to tinker with every letter in a headline, then Lettering.js is the perfect tool for you.
It's a JavaScript tool that takes a string of text and wraps each letter with a uniquely classed <span> element. Using CSS you can manipulate each span (and thereby each letter) in the headline to your heart's content. Imagine how content your heart will be!
- Discover the secrets of great web typography
This isn't the type of thing you want to do on an entire page of text. Remember, JavaScript is injecting spans around every single letter, so if you hand it Tolstoy, JavaScript will just take its toys and go home. However, what Lettering.js can be is a fantastic tool for art-directing a headline or two.
02. slabText
Taking this idea even further, slabText splits headlines into multiple rows that can fill space in a very clever manner.
You can specify important text or text that you want to be a bit larger than others to get a wood type poster effect that is pretty slick. For the right kind of design, this polyfill is just perfect.
Words: Brian Warren
This article originally appeared in net magazine issue 241
Liked this? Read these!
- Our favourite web fonts - and they don't cost a penny
- Illustrator tutorials: amazing ideas to try today!
- The ultimate guide to logo design
Know of a typographic trick for the web? Share it in the comments!
