SARATH K N

What is HTML
O A Web Page is created using a

language called, Hypertext Markup Language, better known as HTML Code.

O HTML is used to define the structure

and layout of a Web page.

O HTML

is not a programming language, it is a markup language

O File Extension :- .html or .htm

What is HTML 5
HTML 5 is the next version of Hyper Text Markup Language(HTML4) It is developing by World Wide Web consortium W3C and WHATWG. HTML5 will be the new standard for HTML, The previous version of HTML came in 1999. The web has changed a lot since then.

HISTORY OF HTML

Versions:
Year 1991 Version HTML

1993
1994 1995 1997 1998 2008

HTML+
HTML 2.0 HTML 3.0 (Added many new tags to the standard) with cascading style sheets (CSS) HTML 3.2 HTML 4 HTML 5

Evolution of HTML5

2004: WHAT Working Group

2006:W3C with WHAT

2008 : First Version of HTML5

2008: FireFox 3 with HTML5

Jan 2010: YouTube With HTML5 video player

April 2010: Apple Trashed Flash

May 2010: Scribd switched to HTML5

2010: Chrome WebStore opened in HTML5

July 2010: Pandora Moved to HTML 5

August 2011: Twitter in HTML5 for iPad

2011: Top sites are in HTML5

November 2011 :Adobe stops Flash for Mobile

April 2012: Flickr With a new HTML5 Uploader

2012: LinkedIn with HTML5 Apps

June 2010: Wix.com +10,000,00 HTML websites

New Input Elements

HTML5 Comes with a lot of new input elements which was not in HTML 4

color date

email
month number range search time week

New Structure Elements

In general, Web pages have navigation, body content, and sidebar content plus

headers, footers, and other features. HTML 5 has dedicated tags for these sections instead of the <div> tag (commonly used in HTML 4)
<section> <header> <footer> <nav>

<article>
<aside>

A typical page structure

HEADER SECTION

MENU NAVIGATION

MAIN CONTENT

FOOTER SECTION

Skeleton of a web page

Structuring a Page with HTML 4

The <div> </div>
is commonly used with some css rules

Structuring Page With HTML 5

Removed Elements

The following elements are Removed in HTML 5

Removed Elements <applet> <frame> <frameset> <noframes> <center> Reason Obselete Syntax for java applets / Use <object> element Usability concerns. Use Fixed positioned elements with CSS

Use Text-align:center or margin:auto with CSS

<s>, </strike> <u>

Text-decoration : strike Text:decoration : underline

HTML 4 needs External Plug ins

HTML5 Comes With Built in Video Player

Video Tag
<video src="movie.ogg" width="320" height="240" controls="controls">

Built in Audio Player

Audio
<audio src="song.ogg" controls="controls"></audio>

The HTML5 canvas element

An overview of canvas
2D drawing platform within the browser Uses nothing more than JavaScript and HTML no plugins

Extensible through JavaScript API

Created by Apple for dashboard widgets Now openly developed as a W3C spec

Browser Support
Most modern browsers
Safari Chrome

Firefox
Opera No Internet Explorer support by default

However, there are hacks to get it working

HTML5 CANVAS

HTML5 canvas

Is it a Flash Killer?

Flash Vs Canvas
Canvas will flourish with future development of frameworks
Its animation capabilities are only just being realised Flash has tight integration with the offline world, but HTML5 is changing that There is a gap in the market for a GUI for developing canvas applications

Browsers Supporting HTML5

Limitations of HTML 5
Browsers do not provide full support for html 5
Cross platform Browser compatibility Audio Video support

Some video content (Like ads) requires Flash player

Top HTML5 Websites

http://20thingsilearned.com
http://www.relfind.com/game/ http://thewildernessdowntown.com

http://www.ro.me