: What font technique is being used here? While I was attending this event (http://worldtour.fogcreek.com/) I noticed this page had custom fonts for the Address part in the top left corner (i.e

@Speyer207

Also check out Google's font directory which is a great way to get started using fonts that aren't considered "web safe." Basically, all you have to do is add a link tag the proper font in the directory before the css that uses it. Google will determine the browser through the user agent, and will spit out the required font-face css. You can then use the font in the "font-family" property.

Here's the quick start guide: code.google.com/apis/webfonts/docs/getting_started.html

Vote Up Vote Down

@Lee4591628

They are using the @font -face technique. By using a variety of files and some pseudo browser detection they are able to serve font's consistently in all browsers. The use:


True Type and WOFF for Webkit, Gecko, and Opera
EOT for Internet Explorer
SVG for iOS


Because of the way the CSS is structured, it will check to see if the font is avilable locally, if it's not and it's IE, it will use the EOT and not load anything else. And if it's not IE it will load the font it will need.

Check out Font Squirrel for more info and @font -face kit's and a generator of @font -face fonts and CSS.

They are also using text-shadow with a color close to that of the text. This creates the blurred effect on the text.

Vote Up Vote Down

@Karen161

This website uses a font technique called WOFF (World Open Font Format). It is currently being standardized on a recommendation by W3C. It enables fonts to be directly embedded in web pages.
en.wikipedia.org/wiki/Web_Open_Font_Format
Have a read. Seems to be a very interesting concept and is beginning to become widely accepted even though it was on drafted last year.

Vote Up Vote Down