A List Apart

Menu
Issue № 350

Keep your type looking right across browsers, platforms, and devices. And let users do stuff on your website even when they're offline.

Say No to Faux Bold

by Alan Stearns · 22 Comments

Browsers can do terrible things to type. If text is styled as bold or italic and the typeface family does not include a bold or italic font, browsers will compensate by trying to create bold and italic styles themselves. The results are an awkward mimicry of real type design, and can be especially atrocious with web fonts. Adobe's Alan Stearns shares quick tips and techniques to ensure that your @font-face rules match the weight and styles of the fonts, and that you have a @font-face rule for every style your content uses. If you're taking the time to choose a beautiful web font for your site, you owe it to yourself and your users to make certain you're actually using the web font , and only the web font ,  to display your site's content in all its glory.

Application Cache is a Douchebag

by Jake Archibald · 48 Comments

We’re better connected than we’ve ever been, but we’re not always connected. ApplicationCache lets users interact with their data even when they’re offline, but with great power come great gotchas. For instance, files always come from the ApplicationCache, even when the user is online. Oh, and in certain circumstances, a browser won’t know that that the online content has changed, causing the user to keep getting old content. And, oh yes, depending on how you cache your resources, non-cached resources may not load even when the user is online. Lanyrd’s Jake Archibald illuminates the hazards of ApplicationCache and shares strategies, techniques, and code workarounds to maximize the pleasure and minimize the pain for user and developer alike. All this, plus a demo. Dig in.

More from A List Apart

Columnists

Matt Griffin on How We Work

Pricing the Web

If you plan to bill your clients, you need a method for putting a price on what you do. The variables are always money, time, and scope of work, but the way they relate to each other can bring different client motivations to the foreground and fit different agency needs.

From the Blog

Driving Phantom from Grunt

For this example, we're going to build a Grunt task that takes a screen shot of the pages we're building (similar to Wraith, but far less advanced). There are multiple parts to make this work, so let's break it down. First, we will write a PhantomJS script that renders each page. Second, we make a NodeJS function that calls this script. Finally, we make a GruntJS task that calls that Node function. Fun!