1. Introduction to HTML5

2. The first thing to realize about HTML5 is, it's not a single entity
The first thing to realize about HTML5 is, it's not a single entity. It's comprised of many elements, including the fifth revision of HTML, CSS3 and many JavaScript API's. It allows you to use the multimedia experience of the desktop on the web. Prior to this technology, experiences of this kind could only work on the desktop.
With HTML5, developers can create apps and websites that function like desktop applications, which allows you to use the web platform to reach all of your users at once. Users no longer have to download apps for multiple devices; They can start an app by clicking on a link or button and not have to worry about having the latest update.
An interesting aspect of HTML5 is that it will allow you to create apps that function even when not connected, or when your system is offline. The trick is being able to store the assets and content locally. When this is done, the app works, regardless of where you go or if your system is online. Another one of the positive aspects of the offline features is being able to store data in the cache or in such a way that allows the data to be retained even if the page is reloaded.

3. With HTML5, you can make use of a wide variety of graphics elements, such as animation, games, movies, etc. Even intense graphics effects such as lightning and shadows, 3D, special effects, vector graphics and so on are supported. A major advance is with the JavaScript engines, which are fast enough to run these applications in real time. Hardware accelerated rendering is being used in modern browsers to create smooth rendering and transitions. What this means is that browsers are using the GPU (Graphics Processing Unit) to speed up computing tasks, which will improve the user experience.
HTML5 tags are backwards compatible so that HTML 4-based content won't destroy HTML5 content. The former HTML structure and formatting is retained.
Several new tags have been added, some of which are: <audio> is used for sound, <video> for video playback, <canvas> for dynamic graphics. HTML5 allows SVG and MathML graphics to be embedded inline or linked within the HTML content. The result is that developers can include complex imagery without images, nor do they need to rely on third party platforms. All the content can be in one HTML file. It's also possible work with SVG imagery using JavaScript and manipulate aspects of the images, as well.

4. With HTML5 ,you can add audio directly to a web page
With HTML5 ,you can add audio directly to a web page. Be aware that while you can control the element with HTML or JavaScript, the specification doesn't cover which the types of codecs supported and this will vary with each browser. Before beginning your HTML5 development, this needs to be checked.
HTML5 allows you to embed video directly into a web page. Be aware that while the video element has been standardized, how the video codec is supported varies with each browser, so it's important to check that as part of your development process.
New types of form elements have been included, which allow you to display a given type of input then rely upon the browser to execute it. Some of the input options are: Telephone number, , URL, date, time, color along with different variations.
The Canvas element gives you dynamic script-able graphics rendering in the browser. With the use of JavaScript, you have the ability to control colors, vectors and pixels on your screen and this works with simple illustrations all the way up to complex visual effects.

5. Semantic markup tags are another advance which allow to structure your content so that the structure has meaning, sometimes known as semantics. Examples of this are the:  <article> , <section> , <header> , <footer> , <aside> , <nav> , and <figure> tags. This allows you to place important elements into sections. It's also useful for search engines and aggregators.
The DOCTYPE has been simplified. The result is that HTML5 documents are valid XML structures. HTML5 content is XML based which means that it must follow XML formatting rules.

6. History of HTML
HTML first published
1991
HTML 2.0
1995
After HTML 4.01 was released, focus shifted to XHTML and its stricter standards.
HTML 3.2
1997
HTML 4.01
XHTML 2.0 had even stricter standards than 1.0, rejecting web pages that did not comply. It fell out of favor gradually and was abandoned completely in 2009.
1999
XHTML 1.0
2000
HTML5 is much more tolerant and can handle markup from all the prior versions.
XHTML 2.0
Though HTML5 was published officially in 2012, it has been in development since 2004.
HTML5
2012

7. What is HTML5?
HTML5 is the newest version of HTML, only recently gaining partial support by the makers of web browsers.
It incorporates all features from earlier versions of HTML, including the stricter XHTML.
It adds a diverse set of new tools for the web developer to use.
It is still a work in progress. No browsers have full HTML5 support. It will be many years – perhaps not until 2018 or later - before being fully defined and supported.

8. Goals of HTML5
Support all existing web pages. With HTML5, there is no requirement to go back and revise older websites.
Reduce the need for external plugins and scripts to show website content.
Improve the semantic definition (i.e. meaning and purpose) of page elements.
Make the rendering of web content universal and independent of the device being used.
Handle web documents errors in a better and more consistent fashion.

9. These are just some of the new elements introduced in HTML5.
New Elements in HTML5
<article>
<aside>
<audio>
<canvas>
<datalist>
<figure>
<figcaption>
<footer>
<header>
<hgroup>
<mark>
<nav>
<progress>
<section>
<source>
<svg>
<time>
<video>
These are just some of the new elements introduced in HTML5.

10. Other New Features in HTML5
Built-in audio and video support (without plugins)
Enhanced form controls and attributes
The Canvas (a way to draw directly on a web page)
Drag and Drop functionality
Support for CSS3 (the newer and more powerful version of CSS)
More advanced features for web developers, such as data storage and offline applications.

11. First Look at HTML5 Remember the DOCTYPE declaration from XHTML?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"
In HTML5, there is just one possible DOCTYPE declaration and it is simpler:
<!DOCTYPE html>
Just 15 characters!
The DOCTYPE tells the browser which type and version of document to expect. This should be the last time the DOCTYPE is ever changed. From now on, all future versions of HTML will use this same simplified declaration.

12. The <html> Element
This is what the <html> element looked like in XHTML:
<html xmlns=" xml:lang="en" lang="en">
Again, HTML5 simplifies this line:
<html lang="en">
The lang attribute in the <html> element declares which language the page content is in. Though not strictly required, it should always be specified, as it can assist search engines and screen readers.
Each of the world’s major languages has a two-character code, e.g. Spanish = "es", French = "fr", German = "de", Chinese = "zh", Arabic = "ar".

13. The <head> Section
Here is a typical XHTML <head> section:
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>My First XHTML Page</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
And the HTML5 version:
<head>
<meta charset="utf-8">
<title>My First HTML5 Page</title>
<link rel="stylesheet" href="style.css">
</head>
Notice the simplified character set declaration, the shorter CSS stylesheet link text, and the removal of the trailing slashes for these two lines.

14. Basic HTML5 Web Page
Putting the prior sections together, and now adding the <body> section and closing tags, we have our first complete web page in HTML5:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>My First HTML5 Page</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p>HTML5 is fun!</p>
</body>
</html>
Let's open this page in a web browser to see how it looks…

15. Viewing the HTML5 Web Page
Even though we used HTML5, the page looks exactly the same in a web browser as it would in XHTML. Without looking at the source code, web visitors will not know which version of HTML the page was created with.

16. THANKS…