What is it?

HTML5 is the latest revision of HTML, which was finalized by the World Wide Web Consortium (W3C) in October 2014. It is designed to support multimedia on mobile devices. HTML5 is the latest HTML standard with new semantics, graphics, and multimedia elements that simplify Web applications and are easy for programmers to learn. Usually referred to as “H5”.

Browsers that support HTML5 include Firefox, Internet Explorer 9 and higher, Chrome, Safari, Opera, etc. Domestic roaming browser (Maxthon), and based on IE or Chromium (Chrome engineering version or experimental version) launched 360 browser, Sogou browser, QQ browser, Cheetah browser and other domestic browsers also have the ability to support HTML5.

HTML5 vs. HTML

Difference 1: HTML5 doesn’t distinguish between strict and traditional schemas, whereas HTML declarations have strict, traditional, framework schemas. Documentation becomes simple and straightforward.

Html5’s announcement:

HTML declaration:

  • HTML 4.01 Strict: <! PUBLIC DOCTYPE HTML "- 4.01 / / / / / / W3C DTD HTML EN" "http://www.w3.org/TR/html4/strict.dtd" >
  • HTML 4.01 Transitional: <! PUBLIC DOCTYPE HTML "- / / / / W3C DTD HTML 4.01 Transitional / / EN" "http://www.w3.org/TR/html4/loose.dtd" >
  • HTML 4.01 Framest: <! PUBLIC DOCTYPE HTML "- / / / / W3C Frameset DTD HTML 4.01 / / EN" "http://www.w3.org/TR/html4/frameset.dtd" >

Difference 2: HTML does not have semantic tags, while HTML5 adds many semantic tags to make the code structure clearer and more readable.

  • Such as header, nav, footer, main, artical, section, and so on.

Difference 3: HTML cannot dynamically draw images on web pages, while HTML5 adds canvas canvas, which will be distorted when enlarged, while SVG can draw vector graphics.

H5 Added features

  1. Canvas, SVG – The elements used for drawing, Canvas will distort the image while SVG will not.
  2. Video, audio — Media used to play video and audio.
  3. Drag, Drop — Used for Drag and Drop.
  4. Geolocation – Used to get a geographic location.
  5. LocalStorage, sessionStorage — For local offline storage.
  6. WebSQL, IndexDB – Front-end database operations, h5 has given up due to extremely low security.
  7. Web Worker – javascript that runs in the background independently of other scripts and does not affect page performance.
  8. WebSocket – a protocol for full-duplex communication over a single TCP connection.
  9. New special content elements such as article, footer, Header, nav, section.
  10. New form controls – such as date, time, email, URL, and Search.

Pros and cons of H5

Html5 has the following advantages:

  • Improved usability and maintainability and improved user experience.
  • Semantic tags are added to help developers define clear structures.
  • Video and audio can be played to add multimedia elements.
  • H5 animation is a friendly alternative to Flash and Silverlight.
  • Crawlers are SEO friendly when they crawl websites.
  • H5 is widely used in mobile applications and game development.
  • Good portability.

Disadvantages:

At present, most advanced browsers support HTML5, but a small number of lower version browsers do not currently support HTML5. Due to the introduction of new tags, there will be a lack of a unified data description format among browsers, resulting in poor user experience.