While I have yet to see an “ultimate” font stack, there are plenty of really great ones out there to choose from if you don’t want to take the time create your own custom stacks. Common Font StacksĪ lot of designers out there have taken a crack at creating ideal font stacks. Considering both Arial/Helvetica and Verdana are considered web-safe (same goes for Times/Times New Roman and Georgia), it doesn’t make much sense to include both. The same goes for Times New Roman (narrow) and Georgia (wide). In effect, this can make your site’s typography appear very differently to different visitors. Verdana is a very wide font Arial is relatively narrow.

One common thing I see in font stacks is the inclusion of Verdana and Arial or Helvetica in the same stack.

Third, make sure you pay attention to the scale of the fonts in your stack. There’s nothing wrong with having more than one font for any of those, but try to keep your font stack reasonably short (six to ten fonts is a pretty good maximum number). Second, there’s a basic formula to creating a good font stack: ‘Preferred Font’, ‘Next best thing’, ‘Something common and sorta close’, ‘Similar Web-safe’, ‘Generic font’. This way, if for some strange reason the person visiting your site has virtually no fonts installed, at least they won’t end up looking at everything in Courier New. While there is no definitive font stack out there, there are a few things to keep in mind when using or creating your own stacks.įirst of all, make sure you always include a generic font family at the end of your font stacks. It seems every designer has their own favorites, what they consider to be the “ultimate” font stack. There are a huge variety of font stacks recommended. Review of Popular Web Font Embedding Services.Avoiding Faux Weights And Styles With Google Web Fonts.You might be interested in the following related posts: Read on for more information on using and creating effective font stacks with CSS. Font stacks can make it possible to show at least some of your visitors your site’s typography exactly the way you intend without showing everyone else a default font. Many stick to the basic stacks Dreamweaver auto-recommends or go even more basic by just specifying a single web-safe font.īut doing either of those things means you’re missing out on some great typography options. Font stacks can make it possible to show at least some of your visitors your site’s typography exactly the way you intend without showing everyone else a default font.ĬSS Font stacks are one of those things that elude a lot of designers. But doing either of those things means you’re missing out on some great typography options. Many stick to the basic stacks tools auto-recommend or go even more basic by just specifying a single web-safe font. CSS Font stacks are one of those things that elude a lot of designers.

Candara web font