Taking a second look at free fonts

http://www.smashingmagazine.com/2014/03/12/taking-a-second-look-at-free-fonts/

96 31 12 years ago

joveian• 12 years ago

My favorite is still DejaVu (I mostly use the Bistream Vera portion) that strangely the article doesn't even mention. I like it enough and hate the way that most websites use fonts enough that I just use it for everything (I use it under urxvt also). I also set a minimum font size wich breaks a lot of things but is still a net benefit IMO. http://dejavu-fonts.org

pawelk• 12 years ago

After every HN article about the next best programming font I go back to DejaVu Sans Mono, so you may be on to something here.

kendalk2• 12 years ago

I used DejaVu Sans Mono until Ubuntu released their Ubuntu Fonts. Ubuntu Mono is a nice programming font! Sorry to tempt you...

The font grass is always greener in the next pasture. :)

shmerl• 12 years ago

I use DejaVu Sans Mono as well for terminal and source editing, but I found that it looks more slim if you apply autohinting to it (for example on Debian it changes quite significantly because of it). I usually put this in $HOME/.config/fontconfig/fonts.conf

    <match target="font">
      <test name="family">
       <string>DejaVu Sans Mono</string>
      </test>
      <edit mode="assign" name="autohint">
       <bool>true</bool>
      </edit>
      <edit mode="assign" name="rgba">
       <const>vrgb</const>
      </edit>
    </match>

simcop2387• 12 years ago

I'm the same way with DejaVu. I forget how I originally found it but it seems to be very light on the eyes and renders really well on every platform and looks great.

pseut3• 12 years ago

I may not know what I'm talking about, but Adobe's source sans and source code pro look a lot like dejavu but have some nice refinements IMO: eg the "-" is a little higher so "->" is better aligned. You may want to check them out.

Luyt• 12 years ago

Same here, I configured Firefox to not allow pages to choose their own fonts. Instead, I use a font of my own choosing to render all webbrowser content, and I've set a minimum font size limit, too.

Together with the 'View/Zoom/Zoom Text Only' option enabled, I can comfortably read almost any web page, without having to scroll horizontally. Also, quite some sites show a bit breakage because their developers use fixed heights for container DIVs etc... (a container should size itself to its content, instead).

kendalk2• 12 years ago

I am working on a MVP and am going for an elegant look. I have the <p> in Georgia 22px but would like something a little less common. Georgia is a nice font but it is everywhere.

My current main fonts are:

      p { font-family: Georgia, Palatino, "Palatino Linotype", Times, "Times New Roman", serif; 
          font-size: 22px; }

      h2 { font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; 
          font-size: 22px; }

Has anyone found a font combination with an elegant, "classical" look?

Edited: for spacing

leephillips• 12 years ago

Have a look at this book:

http://practicaltypography.com/

ScottWhigham• 12 years ago

But it says in the opening salvo, "The fastest, easiest, and most visible improvement you can make to your typography is to ignore the fonts that came free with your computer... and buy a professional font". Not quite "in the spirit" of the OP!

pseut3• 12 years ago

Especially http://practicaltypography.com/charter.html and http://practicaltypography.com/georgia-alternatives.html

thefutureisfake3• 12 years ago

Playfair Display has a very elegant and classical look. Especially set in italics for headers. It actually pairs fairly well with Georgia. Look into Alegreya as well.

atulagarwal• 12 years ago

On a quick read, the article doesn't talk about the licensing for the free fonts. Several free fonts I've liked are free for personal projects or websites, but are chargeable for commercial projects - and one should be careful about selecting them.

Secondly, fonts are very easy to pirate. The commerical fonts (eg. TypeKit fonts) can be copied and reused with a bit of HTML+CSS knowledge. Anyone know of a way to enforce the font licenses?

bitwize• 12 years ago

We need a font DRM standard for the web! Quickly, to the W3C!

thefutureisfake3• 12 years ago

Ha!

mistercow2• 12 years ago

Font piracy is one of the oldest forms of piracy around. Enforcing font licenses in any form is pretty much futile.

Of course, you could always scramble the glyphs and then do an inverse scramble on the page (seriously though, don't do that unless you hate your users).

thefutureisfake3• 12 years ago

All of the fonts featured in the article are free for personal and commercial use. And yeah font piracy is a pretty big issue. I'm sure Proxima Nova is one of the most pirated fonts in the world. I see it on websites everywhere and I have a hard time believing every site actually purchased a license...

stevejohnson• 12 years ago

I paired Playfair with Lato for my personal site. I'm happy with the results, particularly given that my web site is pretty much just unadorned text.

http://steveasleep.com/

Noxchi• 12 years ago

It looks kind of cluttered, like you're using too many fonts. I would limit where you use the serifed font to mainly the headline.

normloman• 12 years ago

Looks messy to me. Try increasing the line height.

Vaskivo2• 12 years ago

Like other users said, it looks a bit cluttered. I think it's because Lato has very narrow lines. My (amateurish) suggestion is either a typeface with thicker lines or a taller typeface.

elwell• 12 years ago

We went with the free version of Sofia Pro for our event titles/etc. Seems to display more smoothly than most free fonts.

http://wesawit.com/events/imagine-dragons-at-the-staples-cen...

CGudapati• 12 years ago

I was a typesetter for sometime(never released a typeface officially) and during another recent discussion on typefaces, I heard about source code pro. I swear I told many people that consolas is the best mono-space font. But source-code pro changed it. It became my main coding font now and it is simply amazing.

I request everyone to try it.

danieltillett• 12 years ago

Do you have a link?

pseut3• 12 years ago

It was announced here: http://blogs.adobe.com/typblography/2012/09/source-code-pro....

the last paragraph of that post has links for the source, web fonts, etc.

DL link (from sourceforge): http://sourceforge.net/projects/sourcecodepro.adobe/files/la...

johnvschmitt• 12 years ago

It really varies widely depending on how you use fonts:

Fonts for PRINTING: You need tons of sizes, really high definitions, as it can be printed 4" high at 300dpi. 3MB for a TTF? OK.

Fonts for iPad Games: You need TINY file size. <200KB, & won't need as high-res at all, esp. variations. You're fighting hard against the size for your game download, to get under the 50MB limit for mobile vs. wifi-only with most US carriers.

Fonts for Web: You need to ensure browser compatibility, size (for download times, which kill UX if it's slow). Too often, devs forget their homepage assets are cached, & don't see the critical first time user experience with their site as slow.)

mistercow2• 12 years ago

Too often, devs forget their homepage assets are cached, & don't see the critical first time user experience with their site as slow.)

I always consider running PageSpeed Insights to be a mandatory final step before making any significant change (that is, anything that loads new assets) live. That helps to avoid this issue.

pom• 12 years ago

I have been digging Karla recently and was pleased to see it mentioned. A few that I didn’t know look interesting as well.

Vaskivo2• 12 years ago

Typefaces are a new passion of mine.

Wanting to start a blog, one of the things I focused were the presentation. I wanted something medium and svbtle like (big and serifed body typeface, clean and responsive design). I found here in HN the site [1] . It is a great read, very newbie friendly and sparked my love for typefaces. While the author, like the OP's writer, mostly scorns free fonts, it gives a lot of insights on the "other stuff" like line height and width, when to use bolds and italics and smallcaps.

Later I found out about google fonts and lost hours in there. I'm a big fan of serif typefaces. My favourites are Vollkorn, Merriweather, and Gentium Book Basic. I'm in love with Vollkorn, but I find that it's hard to pair it with others when used in the body.

For a monospace typeface, either for display or programming I use DejaVu Sans Mono everywhere.

I have a certain fascination for slab-serifs, but I dislike most os the typefaces I find, or can't pair it correctly with other.

I'm still procrestinating, and my blog keeps being delayed, but here's a sample of it, if you want to take a look: [2]

It was made with pelican and I adapted the theme "storm". You can check it here [3]

If you want some suggestions of font combinations, my "experiments" can be found in this source file: [4]

I'm still learning a lot (what the hell is a "humanist typeface"?), but I find it a lot of fun opening a website and going to the source to see the typefaces used.

[1] http://practicaltypography.com/ [2] http://web.ist.utl.pt/~ist155461/blog/posts/2013/Jan/25/moai... [3] https://github.com/Vaskivo/v-storm [4] https://github.com/Vaskivo/v-storm

theandrewbailey• 12 years ago

On my blog, I use Noto Sans for text and Questrial for headings. On the rare occasion that I require a monospace font (anywhere, blog, programming or otherwise), I go for Cousine.

http://www.google.com/fonts/specimen/Noto+Sans

http://www.google.com/fonts/specimen/Questrial

http://www.google.com/fonts/specimen/Cousine

http://theandrewbailey.com/

Taking a second look at free fonts

Related Stories