Tuesday, April 22, 2014

Tip: How to embed different font files for different browser?

Scenario:
Many times you want to embed the necessary font files for the exact browsers that you want to target in order to save internet bandwidth and to improve web site performance. For example, Google Chrome uses the *.svg file to render the best quality of text but other browsers might not support that font file, so you might as well instruct the browser downloads only that font file rather than downloading everyting.

Solution:
Create several css files (i.e.browser specific) that contain the font files declaration. Determine the font file to use at the server or web site host. Here's an example using the ASP.NET MVC:


No comments: