Explore Your Web Font Options with Typecast

The web community is abuzz with developments in online typography; you’ve no doubt heard of groundbreaking tools like Typekit  and Google Web Fonts. Here on HOWID, we’ve covered the history of web typography and web type trends. If you’re still trying to unravel all the options for type on the web, then you’ll want to know about another design tool.

The challenge of web fonts

One of the most problematic aspects of designing type for the web is that what we design in Photoshop isn’t necessarily what we’ll get in a browser. And attempting to replicate those styles is a challenge in itself. The myriad of web based typefaces we can choose from adds more complexity. In short, it’s nearly impossible for a designer to access, test and design for all of these options.

One approach is to attempt to bring all of these typefaces into Photoshop. WebINK brings all of the web-based faces from Extensis and Google into Photoshop to alleviate this problem. And while this is a good step forward, it isn’t perfect.


Want to learn more about web typography? Laura Franz will present the session Finding, Testing, and Using Web Fonts at the HOW Interactive Design Conference, September 27–29 in Washington, DC. Register now; seats are going quickly.


A better way to test your web designs

Typecast lets designers test fonts for their web designs

A new (and still in beta) web-font tool called Typecast makes designing type for the web a whole lot easier. This slick app lets you test a tremendous range of fonts right in the browser. The best part? It’s not code-centric. So while you can experiment with live text, implemented through the magic of CSS and @font-face, you don’t have to write the code. Instead, you design with attributes you’re familiar with—size, line height, spacing, indent, alignment and more. When you’re happy with how the page looks, you can dump out the CSS and easily plug it into your code, but the point is that you aren’t adjusting CSS, you’re adjusting type. Under the hood, Typecast writes the relevant CSS, but the interface is built on language you’re familiar with.

Typecast screen shows heading options

If you want to play with web typography, this is a phenomenal way to get started. Unfortunately, you need to get on the waiting list, as this app is in beta. But you should stay tuned to Typecast—it has all the fixings for a killer tool in your web design tool belt.

More web type resources

One thought on “Explore Your Web Font Options with Typecast

  1. Pingback: Explore Your Web Font Options with Typecast | The Realn3ws Post

COMMENT