Monday, August 13, 2012

How to get HTML5 content in SharePoint 2010

Suppose you want to use HTML5 elements on your SharePoint 2010 site? You create a web part that renders the content as HTML5, for example using <canvas> or <svg> to render dynamic graphical content. The graphics show up fine in FireFox, Chrome etc, but in Internet Explorer it doesn't appear at all, or it is rendered incorrectly. You double-check to ensure that you are using Internet Explorer 9 or later, which is HTML5 compatible. Still the problem persists. How do we solve this?

The reason the HTML5 content is not rendered correctly is that the master page contains an instruction to Internet Explorer to act as if it was version 8, even if you have version 9 (or later). So the solution is to change this instruction.

Open the v4.master master page for your site using a text editor or SharePoint Designer. In the <head> section, locate the line:
<head runat="server">
  ...
  <meta http-equiv="X-UA-Compatible" content="IE=8"/>
  ...
</head>
and change it to
<head runat="server">
  ...
  <meta http-equiv="X-UA-Compatible" content="IE=9"/>
  ...
</head>
Now your HTML5 content will render correctly. This solution works both for SharePoint Online and your friendly neighborhood SharePoint.

1 comment:

  1. Nice work! Looking forward to working more in HTML5 – this is a great tutorial. Do you have any plans to release a SharePoint Foundation version of this v5.master?
    http://essayswriters.org/college/

    ReplyDelete