Monday, September 19, 2011

Custom Fonts

Problem was to use Helvetica Font for the website. And Helvetica isn't available in Windows platform default. In order to do this, option that we took first was to buy font and include that as part of website. Below snippet would take care


@font-face
{
    font-family: my_font;
    src: url('/themes/mytheme/fonts/my_font.otf');
}

Read more here http://www.alistapart.com/articles/cssatten

Something that sounded so straight forward turned to be a big challenge industry has been facing.. "Licensing Web Fonts". Procuring License and at the same time not letting other misuse the fonts for piracy had been big challenge the Font companies have been facing.

@font-face - actually links the font from a location so that browser can refer. So it is possible for someone to easily download the file. Microsoft uses EOT (Embedded OpenType) to solve this so that download is restricted by domain but this approach works only on IE and others browsers have not adopted this approach. Moreover, most of the fonts would need extended license to use the fonts in web. Sometime you would need license to even use along with the service like SIFR, Cufon etc.

Then I stumbled upon concept called "Font Service". In this model, you subscribe the font service and different service provider allows us different way to consume this service and not bother about the license and piracy by us. As usual to make things complex, they will be bunch of people offering this service and making things tough to decide. But here are couple of articles that helped me
http://www.smashingmagazine.com/2010/10/20/review-of-popular-web-font-embedding-services/
http://blog.students.ubc.ca/communications/2010/10/20/web-font-services/

Fonts.com with nominal could solve our problem though. (http://webfonts.fonts.com/en-us/videotutorial)

For Drupal developers - http://webfonts.fonts.com/Content/manuals/FDCWF-Drupal-Mod-user-guide.pdf

0 comments: