Quick Intro of HTML5
- HTML5 will be the new standard for HTML, XHTML, and the HTML DOM.
- The previous version of HTML came in 1999. The web has changed a lot since then.
- Today, some elements in HTML 4.01 are obsolete, never used, or not used the way they were intended to. These elements are deleted or re-written in HTML5.
- HTML5 is still a work in progress. However, most modern browsers have some HTML5 support.
- HTML5 is a cooperation between the World Wide Web Consortium (W3C) and the Web Hypertext Application Technology Working Group (WHATWG).
- WHATWG was working with web forms and applications, and W3C was working with XHTML 2.0. In 2006, they decided to cooperate and create a new version of HTML.
Some rules for HTML5 were established:
- Reduce the need for external plugins (like Flash)
- Better error handling
- More markup to replace scripting
- HTML5 should be device independent
- The development process should be visible to the public
and that’s enough about HTML5.
If you are not aware of HTML5, you can read more about HTML5 later through the below links
Coming to jQuery Mobile…
- jQuery Mobile, is a framework that will help you rapidly and confidently develop mobile app user interfaces across popular mobile device platforms like iOS and Android, is perhaps the most popular project out there.
- The framework boasts a lightweight code base (weighing in at 20KB when minified and gzipped) and a huge bevy of standard user interface elements that mobile device users are accustomed to, such as switches and sliders.
- JQuery Mobile, hails from a royal family of frameworks and spawned from community of jQuery, the most famous cross platform JS library.
- Works great with mobile browsers from Symbian, Android through iOS to Blackberry, Window Phone 7, WebOS.
- Visit http://jquerymobile.com for more details
JQueryMobile has been included as a standard binary include in upcoming ASP.NET MVC 4.0 by Microsoft.
Okey, that was little bit over talk about jQuery Mobile :-), lets look at the point I want to make.
Recent months there is an increasing trend of mobile web applications using HTML5, as most of the recent mobile browsers supports partially or up to certain level on HTML5 capabilities. The idea is that Multi Platform targeted mobile web application development.
To enable HTML5 syntax intelli- sense in Visual Studio 2010 we have the following options to try
1.) Visual Studio 2010 Service Pack 1 – Visual Studio 2010 was originally released without HTML5 support, so does SP1 finally add support for it, to some extent.
The entire HTML5 specification isn’t supported but most of the new elements and attributes are. That means you get both intellisense and validation for HTML5 with SP1.
2.) HTML 5 Intellisense for Visual Studio 2010 and 2008 Extension from Mikhail Arkhipov (Microsoft)
Since Visual Studio 2010 doesn’t have complete support for all HTML5 and CSS3 syntax’s we can try this add-in to enable the support in Visual Studio 2010 and 2008.
3.) Web Standards Update for Visual Studio 2010 SP1
Web Standards Update provides the much wanted HTML5 & CSS3 support to Visual Studio 2010 SP1. It brings VS 2010 intellisense & validation as close to W3C specification as we could get via means of an extension. The most notable supported features by this extension are:
HTML5 – Video, Audio, Input Type, Drag & Drop, WAI-ARIA, Microdata, Schema.org
Browser API – GeoLocation & Local Storage
CSS3 – 2D Transforms, 3D Transforms, Animations, Background & Borders, Basic Box Model, Basic UI, Behavior, Color, Flexible Box Layout, Fonts, Paged Media, Hyperlink Presentation, Line, Lists, Marquee, Media Queries, Multi Column, Namespaces, Presentation Levels, Ruby, Selectors, Speech, Syntax, Template Layout, Text & Transitions. It also supports vendor specific prefixes like -ms, -webkit & -moz.
Refer to Scott Hanselman’s blog for more detailed update : http://www.hanselman.com/blog/AnnouncingTheWebStandardsUpdateHTML5SupportForTheVisualStudio2010Editor.aspx
4.) A Little Old Way
To enable Intellisense to work with HTML 5, perform the following steps:
- Download the HTML5 support package for Visual Studio 2008 from the Visual Web Developer team here.
- Copy the html_5.xsd in C:Program Files (x86)Microsoft Visual Studio 10.0Common7Packagesschemashtml
- Edit the correct registry file and replace 9.0 with 10.0
The file will look like this ( 64 bit VS 2010 Ultimate for me ):
Windows Registry Editor Version 5.00
“Friendly Name”=”HTML 5”
- Run the registry file to merge it with your registry.
- Open Visual Studio 2010
- Go to Tools->Options->Text Editor->HTML->Validation
- Select target as HTML 5
This would allow you to get Intellisense for your HTML 5 based projects.
Not only that Visual Studio Gallery is having lots of cool Extensions such as Mobile Ready Templates using HTML5, and other extension templates you could try. Some of them are….
Creates a mobile ready MVC 3.0 project using the Razor’s view engine and jQuery mobile. Both mobile and desktop versions can be tested using mobile emulators or browsers.
Yet another Mobile Ready ASP.NET MVC Template. Use this MVC 3 Razor Site Template with jQuery Mobile boilerplate layout, scripts and CSS referenced to create adaptable websites for a variety of devices.
So we do have wide variety of ways we can enable HTML5 support when using Visual Studio 2010. Of course we already having HTML5 support included with ASP.NET MVC 3.0 Tools Update, but the above options will help us in enabling Intellisense support for normal ASP.NET applications as well.
Hope this will help you with your HTML5 development..
Happy Coding !!!