A solution for embedding arbitrary fonts in web pages

by iiduce on 2009-12-09 09:11:41

Font use is an integral part of web design. Often, we want to use a particular font in a web page, but the font is not built into the mainstream operating system, so the user may not see the actual design when viewing the page. The most common method used by art designers is to make images of the desired text, which has several obvious drawbacks: 1. It is not possible to use this font on a large scale; 2. The picture content is not easy to modify compared with text; 3. It is not conducive to website SEO (mainstream search engines will not use image alt content as an effective factor in judging the relevance of web content). There are a few ways on the web to use sIFR technology, or javascript/flash hacks, but the implementation can be cumbersome or flawed. Here's how to embed any font in a web page using only the @font-face property of CSS.