Web fonts can sometimes look great on one machine, but awful on another, due to differences in rendering not just between browsers, but also with the same browser between operating systems.
Most commercial web font services have a try-before-you-buy preview feature, where you can see side-by-side screenshot images of the fonts rendered at various sizes on different browser and operating system combinations with default settings (e.g. on Typekit (click 'Browser Samples'), and on Fonts.com (click 'Web Font browser/OS samples' tab)). Google Webfonts doesn't have this feature, and since the fonts are non-commercial/open source they are rarely/never available on these services.
Assuming you don't have a convenient stack of Mac, Windows XP, Windows 7/Vista and Ubuntu machines sitting under your desk, each with a variety of browsers installed, and that you don't have the time, resources, know-how and patience to set them up on one machine using something techie like Virtualbox (not even sure that would work...), how would you go about ensuring that a font you were interested in doesn't have rendering issues?
A good answer could be...
- A service that simulates browser/OS rendering for any font or for Google Web Fonts specifically (I've not found one)
- Knowledge about typographic features to look out for that are known to render particularly differently or badly on certain systems.
If an example would help, a font I'm particularly interested in is Lato 300, 400 and 900, mainly at 10pt, 14pt, 22pt
Answer
I don't know of an automated tool that will do what you're looking for, but if you don't mind setting up some test pages you can preview them using Browsershots.org or Adobe's Browser Lab. Both services are free (though Adobe's requires an Adobe ID) and will show you screenshots of your site in different browsers and operating systems.
Browsershots has a much wider array of browsers, though it doesn't include Mac versions. It also only renders screenshots (you have to manually preview different URLs if you want to "browse" a site) - though this shouldn't be a problem since you're just testing out web fonts.
Adobe's Browser Lab has a limited set of browsers (no Linux versions), but includes some Mac versions. The advantage to Browser Lab is that the preview screenshots are semi-live - you can Ctrl+Click links in the previews to browse to other pages on the site. This may not have much utility if you're just checking font-rendering on a set preview page, but is useful for other test cases.
No comments:
Post a Comment