Ask HN: Which fonts do you use on the web for your websites/blogs?

[ameen]

I'm building my personal website with a blog. I'm confused about which fonts I should use. I'm an aspiring designer/developer and love well designed sites hence I would like to have beautiful readable fonts for my blog and different decorative font(s) for my website.

P.S. Some pointers on Typography & the latest Web design paradigms would be a great help as well. Thanks in Anticipation.

[whichdan]

To start, there are only a few dozen "core web fonts"[1] with which 99% of browsers will have. Then there are a handful of fonts specific to Windows/Mac/Linux, which commonly will be in one but not the other.

For "fancy" fonts, Google Web Fonts[2] is a great resource - you can embed a font into your page, so it isn't dependent upon it already being on the user's system.

There's a lot of reading you can do on typography, but I'd recommend experimenting with different fonts (serif & sans-serif), sizes, letter spacing, line height, and other parameters to get a feel for what makes text readable. Try a few ideas you like, then stand a foot farther from your monitor and see if it still looks good.

[1] http://en.wikipedia.org/wiki/Core_fonts_for_the_Web

[2] http://www.google.com/webfonts

[ameen → whichdan]

Thank you. Btw, Do you use font stacks and @fontface kits? Also, what are your favorite fonts?

[whichdan → ameen]

I don't design very often, but I usually stick to one or two fonts for an entire page, so I don't use too many non-standard fonts or font stacks. I've recently grown fond of Georgia, but besides that, I generally stick to Verdana and Trebuchet MS.

[michaeledge]

As mentioned before http://fontsquirrel.com is a great resource, which includes a good cross-browser css snippet for embedding webfonts http://www.fontspring.com/blog/the-new-bulletproof-font-face... On our site (flup.com) we've used Chunk Five as our logo font and Museo Slab as our headings font along with Lucida Grande for body copy. We've also used line-heights and font-sizes from the Blueprint Framework http://www.blueprintcss.org/ Good luck, Michael.

[alexwolfe]

If your looking for some general fonts to make your blog look good you might want to try the following:

h1 { font-family: Georgia, Time, serif; font-size: 32px; color: #333; margin-bottom: 22px; } p { font-family: Verdana, Arial, san-serif; font-size: 13px; line-height: 24px; color: #666; margin-bottom: 22px; } Here's an example http://jsfiddle.net/5UJZW/

[axitkhurana]

I'm using : Aaargh for the title & Colaborate-Light-Regular All caps for rest of the site. I like minimalism so two fonts, two colors and lot of white space on my website: http://akshit.me . You can browse easy to use free fonts at http://www.fontsquirrel.com

[latitude]

If you are on Firefox, then install Firebug and the next time you see a well-designed site with a font you like, pop Firebug open and checked font-family under Computed Style for the text in question.

Chrome/Webkit has a built-in "Inspect element" functionality that gives a similar access to the computed font-family value.

[vonstark]

go typekit and find some. whatever fonts u need can load from cloud & it's fast.