Migration in HTML5 defines how to migrate from HTML4 to HTML5. Let’s see how the migration of the HTML4 page can be done into an HTML5 page without any problem in content or structure.
The HTML5 has new features and improvements to existing features. It includes all the elements that are present in the HTML4 and XHTML. HTML5 includes the redefinition of the existing markup elements.
The redefinition of the HTML4 elements to the HTML5 is given below:
|<div id = “header”>||<header>|
|<div id = “menu”>||<nav>|
|<div id = “content”>||<section>|
|<div id = “article”>||<article>|
|<div id = “footer”>||<footer>|
Difference between an HTML4 and HTML5 document:
Lets see the following example:
From the above example we can say that, for the migration form HTML4 to HTML5 we have to make changes in the following fields:
Change HTML 4 Doctype to HTML 5 Doctype:
This is HTML4 doctype:
For the migration from HTML4 to HTML5 change it to:
Change HTML4 Encoding to HTML5 Encoding:
This is HTML4 encoding:
Change it to:
Use the HTML5 Shiv:
Use the HTML5Shiv to style the unknown elements and to support them in the older versions of internet explorer.
Change <div> elements to HTML5 Semantic Elements:
In HTML4 we used <div> element for header, footer, menu and article etc, but in HTML5 we used the semantic elements like <header>, <footer>, <article>, <nav> etc.
Difference between the <article>, <section> and <div> element:
There is difference between <article> <section> and <div> in the HTML5 standard.
To represent a generic section of the HTML document a <section> element is used. It should not be used for styling or scripting purposes only.
There is a difference between the <article> and the <section> element. The <article> element is used to specify the complete composition in a page, whereas, the <section> element is used to represent a section of a page or document.
To mark the block of the document as a group the <div> element is used. This document is then used to specify the properties of this group. The <div> element does not affect the appearance of the document.
Some different examples of < article>, <section> and <DIV> element: