As many companies and developers are making the move to creating HTML5 apps many are wondering how to develop HTML5 applications in their current version of Visual Studio with .Net? There are two updates that developers can apply to Visual Studio 2010 that will allow development in HTML5. First, one needs to download and apply the Visual Studio 2010 Service Pack 1. Before installing, be sure to (1) disable any anti-virus software and (2) run the install as an administrator by right clicking on setup.exe and choosing ‘Run as administrator’ if you are using Windows 7. The installation process should take less than an hour. If it appears to be stuck, cancel the installation and refer to this link.

Once installed you can set the HTML5 as the default schema by selecting Options from the Tools menu and then selecting Validation from the options list in the left column and making HTML5 the target validation schema.

The second update is the Web Standards Update for Microsoft Visual Studio 2010 SP1.

Now let us create a sample HTML5 ASP.NET application. Create an ASP.NET Web Application. We will name it, HTML5 Features. First, we will add modernizr.js:

Right click on Scripts

Add Existing Item

Select the file modernizr.js which you can download from modernizr.com

Next we will modify the Site.Master file:

First, replace the current doc type:

with

And add some JavaScripts to the Head section

And we will also add the JavaScript code for printing the feature status, which is too long to reproduce here (see the project download for the full code):

In the Body section, change “My ASP.NET Application” to “My ASP.NET HTML5 Browser Features Application”

And in Default.aspx replace the contents of

with:

	       
HTML5 Features
 
		
Audio support? 
		
Canvas support? 
		
Canvas Text support? 
		
Cross Window Messaging support? 
		
Drag and Drop support? 
		
Geolocation support? 
		
Hashchange support? 
		
History Management support? 
		
Indexed DB support? 
		
Video support? 
		
Web SQL Database support? 
		
Web Socket support? 
		
Local Storage support? 
        	
Web Workers support? 
		
        	
Application Cache support? 
		
Session Storage support? 
		
SVG support? 
		
SMIL support? 
		
SVG Clippaths support? 

Now you can build and run the program. This will be the result:

Thus, developers can now begin incorporating HTML5 features in their ASP.NET applications.

Download: HTML5 ASP.NET Sample Application (2MB)