This is Font Awesome

Yup like the title said, it’s font awesome!

Why and what is font awesome, you say?

Font Awesome is an iconic font designed for Bootstrap and for web development.  Just imagine yourself having an iconic font like dingbats but, is filled with useful icons like spinner, arrows, all the standard icon for mobile, even a facebook like button thumbs-up. Cool eh?

Some of the cool font sample (300+ of em)

Not only it’s useful for designer to install the font an use it in Adobe Flash, Illustrator and Photoshop, font-awesome is also a css kit that allows you to “embed and install” the open-source (Apache 2.0 license) font into users (CSS3 style). You can use them, distribute them freely, style and scale them just like you did on a normal font.

I’ve been using font-awesome for three iteration of enterprise projects now,  so far I must say, I really liked it. However, if don’t get way too spammy on icon, especially on mobile, if you deal with massively styled icons button that repeats in a listview, it does have some performance issue.

However, if you just dealing with header buttons (once that stay static and not tiled into list and repeated many many times) then, it’s all good to have them around.

When deployed on server, be sure set the mime type to match the font extension, otherwise the server will disregard the font file, and the user will end up seeing a square glyph.

The recommended settings for Apache and IIS servers are below.

svg as "image/svg+xml"  ttf as "application/x-font-ttf" or "application/x-font-truetype"
otf as "application/x-font-opentype"
woff as "application/x-font-woff"
eot as "application/vnd.ms-fontobject"

Head over to font-awesome.com to find out more!!

 

 

Comments

comments