What is HTML5?

Super User
14 October 2014

If you're thinking about learning HTML and you've just started dipping your toes into the world of coding, you may have come across the term HTML5. So, what is HTML5? Is it a completely different language? In short, no. HTML is a markup language used to create web pages to be displayed on web browsers.

It has been in development for over 20 years now and it has gone through many iterations. The current, most advanced rendition of HTML is HTML5. But what's so different about it and why is it important to learn the differences between HTML5 and its previous versions? It's important because of the fact that HTML5 brings a lot to the table in terms of equalizing net standards. The most popular browser makers of today, Mozilla and Google, are aggressively pushing this technology forward with their browsers.

For example, just a few years ago, handling video was a cumbersome affair. Different websites used different media players, such as Real Player, QuickTime and Flash. Now, with HTML5's "<video>" tag, there is no need to install third-party plugins (and potential viruses to boot) in order to play a simple video. HTML5 video has become the standard now in the majority of popular websites. But HTML5 video is only one among the many significant changes that have been introduced into the language.

The differences between HTML5 and HTML 4.01

  1. The syntax has been simplified.
    Previously, declaring the DOCTYPE required an overly complicated line of code. HTML5 simplifies that with the simple "<!DOCTYPE html>" tag.
  2. Audio and video have been made an integral part of HTML5.
    As mentioned above, third party plugins are no longer required to embed and play both video and audio media. They can simply be embedded into a website using the following tags : "<video>, <audio>".
  3. HTML5 natively supports vector graphics.
    Silverlight, Flash and VML were the go-to technologies for vector graphics before the advent of HTML5. Now, both SVG and canvas can run on websites without the need for additional software. HTML5 animation is also made easier because of this.
  4. It is now possible to determine the Geo-location of the user using the JS GeoLocation API.
    This was practically impossible in HTML4.01, especially if the user was browsing on a mobile device.
  5. Web Storage, the Web SQL database API and Application Caches are used for client side storage.
    Webpages need to store data locally on the user's system. Before HTML5 came along, cookies were the predominant way to go about this business. Web Storage, however, is faster, more secure and allows for larger data storage without affecting the browser's performance.
  6. The JS Web worker API allows JavaScript to run in the background.
    In HTML4.01, JavaScript was not allowed to run in the browser. It used to run in the same thread as the browser interface.
  7. HTML5 drag and drop.
    Any element in a HTML5 document can be dragged and dropped using HTML5 drag and drop.
  8. HTML5 may not work in older browsers.
    HTML4.01 is still perfectly functional in all browsers, old and new. As of 2014, HTML5 has already become the industry standard and is supported by every major browser in the market.

Best HTML5 tutorials online

There are literally hundreds of books and free online HTML5 tutorials that you can use to learn HTML5. Among them, these 3 are a few of the best:

w3schools: Literally the best place for HTML5 tutorials. It's used as reference by beginners and experts alike for its intuitive, hands-on tutorials. Each tutorial comes with its own HTML editor which you can use to test the code that you just learned.

codeacademy: If you want your HTML learning experience to be fun, look no further than codeacademy. It uses interactive tutorials to guide you through the fundamentals of HTML5. Students get points and badges for successfully solving problems just like a game.

treehouse: Treehouse is also one of the best websites for learning HTML5. The way it works on treehouse is the following: the student picks a "track" and follows that track by watching videos, completing tutorials, quizzes and code challenges to cement his understanding of what he just learned. The only downside is that it's not free. The site asks for $25 per month for the basic subscription (which is more than enough for a beginner).

Websites that stand as great HTML5 examples

Field: Field was made to promote the Nike+ Fuelband. It was made using HTML5 and is one of the best HTML5 examples you can find on the web because of how addictive it is. In it, the user is asked to create his own animated dance track and it is all done in HTML5.

Subtask: Subtask is a web application (that is now available on iOS as Mindnode) that one can use to make mind maps of any task. It's highly useful and stands as one of the best HTML5 examples.

Cut the Rope: The game "Cut the Rope" was made to showcase the HTML5 prowess of Internet Explorer 9. It's impressive because of the fact that everything in the game, including the physics, was made possible because of the flexibility and accessibility of HTML5.

Latest Articles

OUR TECHNOLOGY:

© Copyright Toneyes Co.Ltd. 2022