Ahtml 5 Information a

Google+ Pinterest LinkedIn Tumblr +

What is HTML 5?

HTML 5 is a new specification of HTML designed to follow HTML 4.01 and was created by designers who were not satisfied with the direction the W3C was taking HTML with the advent of XHTML 1.0. HTML 5 adds features to help web application developers and to improve the interoperability among web browsers and user agents.

There are lots of new features to HTML 5 including:

  • Tags to help with the structure of your pages likesectionarticle, and aside.

  • New form tags to get more specific data in your forms

  • Multimedia tags to assist you in adding video andaudio to your web pages.

  • Plus, some tags have been removed from the specification.

  • What is HTML 5
  • What’s New in HTML 5

How to Use HTML 5

HTML 5 Doctype
The first thing you should know about HTML 5 is how to tell browsers you’re using it. You do this by using the correct doctype:

style=”font-family: inherit; font-style: inherit; margin-top: 1.5em; margin-right: 0px; margin-bottom: 1.5em; margin-left: 3em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; text-decoration: inherit; quotes: ”; “> >

Building an HTML 5 Page
Put the doctype as the first line in your HTML document. Then add the  tag and start the  of your document. Inside the head, you should indicate the title of your document and the character set:

style=”font-family: inherit; font-style: inherit; margin-top: 1.5em; margin-right: 0px; margin-bottom: 1.5em; margin-left: 3em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; text-decoration: inherit; quotes: ”; “>
  
    My First HTML 5 Document
    
   >

Write your HTML 5 document with the same tags as you would an HTML 4.01 document. Put your content in the  tag and close both the body tag and the html tag at the very bottom of the document.

Here is a sample HTML 5 document:

style=”font-family: inherit; font-style: inherit; margin-top: 1.5em; margin-right: 0px; margin-bottom: 1.5em; margin-left: 3em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; text-decoration: inherit; quotes: ”; “>

  
    My First HTML 5 Document
    
  
  
    Put your HTML 5 tags here
  
>

  • New Tags in HTML 5
  • HTML 5 Tags Alphabetically
  • Use Dreamweaver CS5 to Write HTML 5
  • Using HTML 5 Layout Tags and Getting Browsers to Display Them

HTML 5 Browser Support

HTML 5 is currently a working draft at the W3C. Because it has not yet been approved as a formal specification, many web browser manufacturers either don’t support HTML 5 or only support some of the tags.

According to Deep Blue Sky and their tests of browsers that visit their site, Safari 4 has the widest support, missing only geolocation API support. Chrome has good support of HTML 5, except for geolocation API. This isn’t surprising as it’s based off of Webkit like Safari. Firefox 3.5 supports the audio tag, video tag, canvas, and even the geolocation API. Opera 10 only really supports the canvas tag reliably, but it doesn’t support audio or video. However it does have good support for web forms 2 and SVG support. And of course, Internet Explorer 8 doesn’t support HTML 5 at all.

HTML 5 Tutorials

HTML 5 has a lot of new features. And one way to learn them is with tutorials. Here are a few:

  • HTML 5 Canvas Tutorial
  • Introduction to HTML 5 Video
  • How to Add Sound with the AUDIO Element
  • HTML 5 localStorage() Tutorial
  • HTML 5 Drag and Drop Tutorial
  • How to Make an HTML5 iPhone App
  • Coding A HTML 5 Layout From Scratch
  • HTML 5 Forms
  • Structural Tags in HTML 5
  • How to Make All Browsers Render HTML5 Mark-up Correctly — Even IE6

HTML 5 and the W3C

The W3C has a working draft document of HTML 5. But it was originally started by theWHATWG group. They started the development of HTML 5, and continued it until the W3C took over.

HTML 5 Validators

Checking that your HTML 5 web page is correct is a lot easier when you can validate it. But there aren’t a lot of HTML 5 validators. Here are a couple:

  • The W3C Markup Validation Service
  • Validator.nu (X)HTML5 Validator

But because there is a part of the specification that defines how a browser’s parser will treat the byte stream, this will allow us to know how any given browser will treat the HTML it is given. And this is regardless of how valid the HTML is.

HTML 5 Examples

Examples are a great way to learn HTML 5.

  • Basic HTML 5 Canvas Tag Examples
  • HTML 5 Video Example
  • HTML 5 2-column Layout Example

HTML 5 Websites

Here are a few sites that use HTML 5 or you can submit your own:

  • HTML 5 Gallery | A showcase of sites using HTML 5 markup
  • 101 Best HTML 5 Sites
  • 25+ Stunning Websites Using HTML 5

Readers Respond:HTML 5 Websites

Read responses (5) Share Your HTML 5 Page HTML 5 Tutorials

  • Introduction to HTML 5 Video
  • HTML 5 Canvas Tutorial
  • HTML 5 Tags

HTML 5 Information

  • What is HTML 5
  • What’s New in HTML 5
  • New Tags in HTML 5
Share.

About Author

Leave A Reply