CSS @font-face - what does “src: local('☺')” mean?

Question

I\'m using @font-face for the first time and downloaded a font-kit from fontsquirrel

The code they recommend inserting into my CSS is:

@         


        

Answer 1

The local(☺︎) is a css hack to divert IE6-8 from downloading fonts it can't use (it can only use fonts in EOT format).

Explained: The last src property takes precedence in the CSS cascade, meaning that the CSS will be parsed from bottom to top. The local(☺︎) will make IE skip the src at the bottom, without wasting bandwidth downloading fonts it can't use, and rather go straight to the font in .eot format (defined on the line above in your question) that it will use. The smiley is just to ensure there won't be a local font with that name (character combination).

Read more here: http://nicewebtype.com/notes/2009/10/30/how-to-use-css-font-face/