Internet Explorer automatically switches to compatibility mode (IE9 and IE10)

On certain page on my site, Internet Explorer automatically switches to compatibility mode and tries to render the page in compatibility view (IE7 mode). Also the URL gets added to the compatibility view list.

In my case, it happened due to some CSS using Type 1 font (Helvetica).

Internet Explorer changed its font-rendering from IE9 (affects IE10 as well) which does not support the old Type 1 fonts. But still some users manually install fonts (for me, it was Helvetica, tested on Windows 7, IE9 and IE10 both).

Now if you use CSS like: font-family: Helvetica, Arial, sans-serif; rather than falling back for Arial, IE9 and IE10 switch to compatibility mode.

More details can be found at: http://bobbyjoneswebdesign.blogspot.com/2011/12/internet-explorer-9-type-1-font-bug.html

As per the mentioned blog post, following approaches would help resolve the problem for the web developers:

• Don't use Helvetica or other non-standard fonts in your CSS
• Use a substitute web font with the CSS @font-face feature to serve up your desired fonts
• Use an online web fonts service like webfonts.fonts.com
• Use Conditional Comments to create IE9 specific stylesheets.