Posts Tagged ‘web fonts’

As we continue to progress through this relatively new era of web fonts, we see more & more choices available to us. We have a plethora of well-designed fonts to pick from for our design projects, and quite a few of them are free too. Slab serifs? Script? Humanist sans? All these and more are at our fingertips – so, with that in mind, here are ten well-designed & free new web fonts you can use today.

Cabin

This well made sans-serif typeface has 8 weights for download.

Cabin Web Font

Bevan

A bold, heavy slab-serif.

Bevan Web Font

Pacifico

A playful script font.

Pacifico Web Font

Quattrocentro Roman

A classy serif font, similar to Trajan in some regards. Read the whole article >

There are a bevy of tools in the typography-savvy web designer’s toolbox these days. No longer are we tied down by the age-old web safe font list; now, we actually have choices when it comes to setting & styling live type on the web. Of course, there are still issues with those using old browsers, but their punishment is dose after dose of Times, Arial and so forth.

Allow me to run down the current choices for designers & developers when it comes to live fonts on the web. Some of these are free; some are paid; some are easier to implement than others. It’s up to you to make the choice as to which tool is best for you and your project, but I’ll share my opinions throughout. If I missed any that you use on the regular, let me know in the comments! *note: each title and image links to the service’s website.

@font-face

free

@font-face

This CSS3 selector is probably the most widely-used tool for font-embedding today. It’s super easy to implement, and you can use any open-source font whose license allows for font-embedding.

Essentially, you upload the font to your server and link to it within your CSS file. For what it’s worth, I almost exclusively use FontSquirrel’s @font-face tools, which include kits and generators. If you’re overwhelmed by the amount of choice when it comes to @font-face fonts, check out the 10 Best @font-face Fonts.

Google Font API

free

Google Font API

This service from Google is even easier than @font-face to implement, although their list of available fonts isn’t so big (yet). It’s a similar idea to @font-face, but you don’t have to host the font on your server. You just throw in one line of code in your HTML and define the font in your CSS. That’s it.

Hit the jump for more ways to better your web typography! Read the whole article >

Connect

Subscribe via RSS to the Paper Leaf Design Blog Subscribe via RSS to the Paper Leaf Design Blog Subscribe via RSS to the Paper Leaf Design Blog Subscribe via RSS to the Paper Leaf Design Blog

Search

Who?

Paper Leaf Design is a small but mighty graphic & web design studio in Edmonton. This is our blog, where we wax poetic on design.

Interested in our services?

Hire Us!