There are currently around 700 programming languages for you to choose from when starting your coding journey.
Massive amounts of choice can make it unclear what you need to learn.
The skills you need also depend on whether you want to be a frontend or backend developer. It’s easy to see why the entire process can become confusing.
So, should you learn HTML or HTML5? HTML is the second most used language in the world, with 63.1% of developers using it daily. It structures the web pages we use every day and is one of the fundamental languages of web development. Learning HTML or HTML5 is essential.
But what is the difference between HTML and HTML5? Let’s take a closer look at what sets them apart and how you should approach learning them both.
There is no HTML5 just HTML
WHATWG, or Web Hypertext Application Technology Working Group, is the community behind evolving HTML standards.
They have removed the versioning from HTML. Instead, they now use a living document to define the technology as it progresses. It means that HTML5 is now just HTML.
I’ve included a link to the working document which now defines HTML in the resources if you want to dig a little deeper.
So asking whether you should learn HTML or HTML5 has become redundant. They are now the same thing.
In fact, it would be difficult to find a course or program that is teaching anything but the latest and greatest of HTML5. The latest, and last, version of HTML was released on 22nd January 2008. It’s hardly new technology.
There have been improvements since but the core concepts of HTML have remained the same.
Asking whether it is best to learn HTML or HTML5 is similar to asking whether you should learn English in a British or Australian accent. The change to versioning has meant it is now the same thing.
The only differences will come from whether the course you are learning from is up to date with the latest improvements.
Is HTML5 better than HTML?
Without a doubt, you should learn HTML5 instead of earlier versions of HTML. It is now the industry standard and is far better than its predecessors.
With HTML we used the browser as a temporary storage area. It used cookies that would be sent with every request to the server. These were less secure and had a tiny storage limit of around 5MB
With HTML5 we have the option to use web storage, application cache, and SQL databases.
2. Error Handling
- Input fields with the type email provide validation as standard.
- The required attribute makes inputs required by default
- Setting specific patterns for password and phone number inputs
- Minlength and maxlength for text fields
- Min and Max for numerical inputs
3. Geographical Support
Tracking a user’s location is far simpler in HTML5. With earlier versions of HTML, finding their location was difficult and not at all reliable for mobile.
Thanks to the Geolocation API, identifying a user’s location is simple. It means webmasters can tailor their content depending on where someone lives. It also gives site owners far better insight into who is visiting their domain.
You can do some cool things with geolocation and it’s definitely a reason to learn HTML5 over HTML.
4. Multimedia Support
As we discuss in the HTML5 feature section below, multimedia support is far superior.
Thanks to HTML5 browsers now support audio and video natively. The days of needing an external plugin like Adobe Flash are long gone. Engineers from across the globe celebrated the demise of Adobe Flash and the bloat it brought with it.
HTML5 has simplified the development process and was a key driver behind the media-rich web we now see.
Historically, we made a request to a server, got the response, and then did something with the data.
Thanks to HTML5, we can now use WebSockets. These open up two-way communication channels between our web page and the server.
It means you no longer have to refresh the page or send another request for updates. The server will automatically send the data as it changes.
Most modern tech companies use web sockets in some capacity so learning HTML5 over HTML is crucial.
What did HTML5 introduce?
When it first came out HTML5 helped progress web development a lot. It enabled the creation of better, more dynamic sites.
If you were considering learning HTML or HTML5 it’s important to understand the benefits that the 5th version of HTML brought us.
Below is not a complete list of all HTML5 features and functionality but just some of the ones I use most regularly.
Audio and Video
It introduced audio and video tags so that developers could natively use audio and video on their site. Before this, sites had to use Adobe Flash plugin for interactive elements as HTML didn’t support it.
The great thing is that the audio and video tags are just plain HTML so they can be easily styled with CSS.
Native audio and video support is a key version to learn HTML5 over an earlier version of HTML.
HTML5 Video Code
<video width = "500" height = "300" controls autoplay> <source src="/html5/video1.ogg" type="video/ogg" /> <source src="/html5/video1.mp4" type="video/mp4" /> This browser doesn't support this video element. </video>
HTML5 Audio Code
<audio controls autoplay> <source src="/html5/audioclip.ogg" type="audio/ogg" /> <source src="/html5/audioclip.wav" type="audio/wav" /> This browser doesn't support this audio element. </audio>
Scalable Vector Graphics
The introduction of scalable vector graphics, or SVGs, in HTML, was a huge leap forward. It also marked the death knell of Adobe Flash because it was no longer needed to create graphics. They are incredibly lightweight and easy to animate and style.
HTML5 introduced the <figure> and <figcaption> elements. Figure allows you to properly markup a photo and figcaption enables to you define a caption for the figure.
Below is an example of three figures with images inside each and a caption.
Every website has navigation. The introduction of the nav tag in HTML5 makes it easier to make simple horizontal menus with links to other areas in your site.
Importantly, the nav tag has made accessibility better on the web. It allows screen readers to easily pinpoint the main navigation menu.
The Placeholder Attribute
When users are filling out forms it is useful to let them know what is required in each field.
The placeholder attribute describes the expected input and improves usability. It’s also lowers the chance of user error by clearly outlining what each input needs.
Tagging an input with the type of email gives you automatic browser validation for emails.
It means that Chrome or Firefox will automatically check whether the user has input a valid email.
Is it worth learning HTML in 2021?
HTML is one of the fundamental technologies used in web development. It structures every web page or web app you have ever been on.
How deep you decide to go when learning it is up to you. But you must learn it if you intend to progress into a front-end developer role.
Often people want to skip HTML because they think it is not worth learning.
Most entry-level technical interviews have a few questions on HTML and CSS. Not being able to answer these basic questions shows a complete lack of fundamental knowledge.
So, deciding not to learn HTML or HTML5 will put you at a serious disadvantage. Remember software engeering is competitive so you must learn the basics to keep up.
Asking whether you should learn HTML or HTML5 is not the right question. The versioning for HTML has been dropped, so HTML5 is HTML.
Take the time early on to nail the fundamentals of HTML and you will be surprised how far it can get you in your front-end career.
Only learn from resources that are teaching the latest HTML. The updates have made a huge difference and save developers a lot of aches and pains.
Nathan Britten, the founder and editor of Developer Pitstop, is a self-taught software engineer with nearly five years of experience in front-end technologies. Nathan created the site to provide simple, straightforward knowledge to those interested in technology, helping them navigate the industry and better understand their day-to-day roles.