What is the difference between HTML5 and (pre-5) HTML?
It is a cleaner markup and improved code for web developers.
In this article, you will learn about the difference between HTML and HTML5.
HTML stands for HyperText Markup Language and HTML5 is the latest version of HTML Language. It is a cleaner markup and improved code for developers. HTML5 comes with a host of new elements and functional attributes.
In HTML file, DOCTYPE defines the HTML version. The browser also reads the DOCTYPE to identify the running HTML version.
HTML5: New Elements and attributes:
The new elements and functional attributes of HTML5 are listed below:
- A simpler way to DOCTYPE declaration: <!DOCTYPE html>
- New semantic elements: <header>, <footer>, <main>, <section>, <article>, <figure>, <aside>, and <nav> etc.
- New attributes of form elements: number, date, time, calendar and range, etc.
- New form elements: <datalist> and <output>
- New graphic elements: <svg> and <canvas>
- New multimedia elements: <audio>, , <source>, <track>, and <video>
Key Differences
- Audio and video were not part of older HTML version specifications and now, both are an integral part of HTML5 specifications.
- Vector graphics are also an integral part of HTML5 such as SVG and canvas while vector graphics is possible in HTML only in conjunction with various technologies such as VML, Silver-light, Flash, etc.
- In HTML, browser cache can be used as temporary storage. In the case of HTML5, application cache, web SQL database, and web storage is used.
- HTML doesn’t allow JavaScript to run in a web browser, it runs in the same thread as browser interface whereas HTML5 allows JavaScript to run in the background and that is possible because of JS Web worker API in HTML5.
- HTML works smoothly only with old browsers while most of the modern web browsers have started supporting HTML5 specifications. These browsers include Firefox, Mozilla, Chrome, Opera, Safari, etc.
Detailed comparison between HTML and HTML5
| HTML | HTML5 |
| It allows JavaScript to run only in the browser interface but does not support originally in the browser background. | JavaScript can actually run in the background of the browser itself through JS web worker API. |
| It supports the use of virtual vector graphics with the help of programs like Flash, Silver-light, and VML. | HTML 5 allows us to use virtual vector graphics without the help of programs like Flash, Silver-light, and VML. |
| Older HTML versions are not much mobile-friendly. | HTML5 is far more mobile-friendly. |
| One can not draw various geometrical shapes (circles, triangles, rectangles, and others) using the older HTML versions. | HTML5 facilitates us to draw all kinds of geometrical shapes (circles, triangles, rectangles, polygons, and others)in all. |
| It does not allow audio <audio> and video <video> tags. | It allows audio <audio> and video <video> tags. |
| We can not track the GeoLocation of a user browsing any website using the older version of HTML. | HTML5 enables us to track the GeoLocation of a user while browsing any website with the help of JS Geo Location API. |
| It uses cookies to store temporary data. | It uses SQL databases and application cache to store offline data. |
| Character encoding is way too long and complicated in HTML. | Character encoding is much shorter and easy in HTML5. |
| The Doctype declaration is too long and complicated in older versions of HTML. | The Doctype declaration is more concise and lot easier in HTML5. |
| We can also see older elements in older versions of HTML. | We are able to see new elements like (strike, frame, frameset, font, center, tt, big, dir, acronym, basefont, noframes, applet, isindex) while various outdated elements have been completely dropped in HTML 5. |
| In this, parsing rules are less efficient and compatibility across various platforms is very limited. | HTML 5 possesses better parsing rules and full compatibility across various platforms. |
| It does not allow drag and drop effects. | HTML5 allows drag and drop effects. |
| Older version of HTML doesn’t offer Attributes like charset, async and ping. | We have attributes like charset, async and ping available in HTML 5. |
Please feel free to ping seek any further clarification!
