I'd like to expand my use of fonts in my web designs. I know that there are a variety of services available like Google Web Fonts to include fonts onto my site, but I would also like to be able to use those fonts in high-fidelity design mockups made with either Fireworks or Photoshop. Is there an easy way to import web font files so they are available outside the browser?
3 Answers
If the typeface is open source, freeware, or public domain (all different concepts in terms of licensing, though the cost is the same (free)) then you can just download and install the font as you wish. All of the fonts Google hosts can be downloaded and installed and used in Photoshop as you see fit.
For commercial typefaces, there are typically two main options (aside from outright purchasing a license from the start):
use the online sample type-setting option. Typically a flash or server-side image or embedded web font. You can then screen shot it and use it FPO.
Ask the type foundry for a trial version. Several will allow that. Or if not a copy of the font file itself, they may be happy to set an image version of it for you.
-
This is a good answer. The screenshot method is what I often use if I need a font for mockups. Obviously, you shouldn't use this for final work, because that would most likely be violating the font license. Dec 7, 2011 at 0:46
-
It's a paid application, but I've found TypeDNA to be pretty useful for previewing fonts in Photoshop http://www.typedna.com/. Among it's many other useful features, it has a feature which allows you to use Google Fonts directly in Photoshop. Again, it's a $49 purchase, so this may not be what you're looking for.
Another option, which is free (at least currently), is the beta "Web Font Plugin" from Extensis http://www.extensis.com/en/webfontplugin/index.jsp. I haven't used it myself, but it looks to be pretty useful. It gives access to Google Fonts, as well as thousands of WebInk fonts (From what I can gather, WebInk is a usage-based web-font subscription service)
As for converting webfonts to be able to use them in Photoshop—I'm not sure of how to do this, but even if you could, most webfonts are not licensed to allow this.
-
1I was going to comment on horatio's post, but I guess I'm not allowed to. Anyways, his post reminded me that a long time ago I downloaded a package of all of Google's font archive. I found this link: joemaller.com/1856/download-google-fonts. Even though Google doesn't provide them in an archive, there are no licensing restrictions which you need to worry about in downloading them from here. That being said, I think the Extensis plugin may be worth trying still, so you don't have to maintain the font list on your computer. Dec 6, 2011 at 22:34
-
That's actually what I ended up doing, downloading from Joe's archive. Apparently you can also download individual fonts from Google by clicking on "Add to my collection". Dec 6, 2011 at 22:39
-
Why would one pay for software when they can just download the open source typefaces themselves?– DA01Dec 7, 2011 at 0:38
-
Because that is only a minor feature of what the software does. TypeDNA is actually pretty awesome. It allows you to automatically find fonts based on different parameters, such as weight, optical size, character width, and obliqueness. It also automatically generates pairs of fonts that look good together, base on the fonts' attributes. It's got a lot of other features as well, not to mention the fact that it's a full-fledged font-manager. Anyways, I only posted it as a suggestion, and that's why also also gave 2 other FREE alternatives. Dec 7, 2011 at 0:42
-
It does sound like an interesting product. Not something I'd use, but I can see that it'd be useful in cases.– DA01Dec 7, 2011 at 0:54
The link you provide in many cases has a clear link to the relevant typeface creator. The easy way to get the font file is to contact the creator and/or download the typeface from their website or e-commerce site.