The most straight-forward answer to that question is simply that it is the current, “right” version of the language.
But some people seem unconvinced by this fact. Older markup practices still work in most browsers — if you type <img align="right" />
onto your web page, the text will flow around the image just the way you’d expect. Why not just do that? It’s easier!
There are a number of reasons to prefer HTML5, and to avoid using any of the deprecated features. Some are practical, while others are more philosophical. Some are altruistic, while others are selfish.
- Easier to write
- Easier to maintain
- Easier to redesign
- Better for Search Engine Optimization
- Better for the blind and visually impaired
- Better for content aggregators and feed readers
- Better for users on mobile devices
- Better for users on slower internet connections
- Fewer chances of design breaks
- Easier to add media
- Easier to create interactive applications
- Deprecated features will likely stop being supported at some point, breaking your page
How To Use HTML5
You probably already know how to create HTML5 documents. The basics of the language are the same. There’s a just a few things that are good to keep in mind.
Avoid Deprecated Features
<!– Browse the list on this page to make sure that you know which HTML features are no longer supported in HTML5. If you click on the links to the individual pages, you can learn more about why each feature was deprecated and how to accomplish similar effects using modern, standard features of HTML5 and CSS. –>
Make sure that you know which HTML features are no longer supported in HTML5. If you research the deprecated tags, you can learn more about why each feature was deprecated and how to accomplish similar effects using modern, standard features of HTML5 and CSS.
You don’t have to memorize the list, though. All you really have to remember is that if you want to affect the way something looks on a page, you probably shouldn’t attempt to do what you want with HTML. Nearly all of the HTML features that affected style or design have been deprecated, and the few that are left are only recommended in particular cases.
Learn to Use the New Features
Sometimes, if you don’t know that something is available, you don’t know to look for it. For example, if you didn’t already know about the <video>
element, you might not know just how easy it is to embed video on a web page.
<!– So it’s a good idea to spend some time browsing the New Features list so that you are aware of what’s available. –>
So it’s a good idea to spend some time browsing the new Features so that you are aware of what’s available.
Get Comfortable With CSS
Many of the deprecated features were used to achieve design and styling effects. These are now properly the domain of CSS. If you want to be a modern web front-end developer, you’ll spend some time getting good at using CSS.
Use the HTML5 <!DOCTYPE>
Declaration
All HTML5 documents should begin with a tag that indicated the document is, in fact, supposed to be valid HTML5. That looks like:
<!DOCTYPE html>
This should be the very first thing in a document, before the <html>
tag, and before any whitespace.
Don’t Close Null Tags
It’s a little minor point, but…
A “null” or “empty” element is an element that has no content. These include:
<img>
<br>
<hr>
Surprised that an <img>
element has no content? The image itself is an attribute of the tag, not the content.
In some previous versions, HTML (those based on the XML standard) required these elements to be closed with a slash.
<!-- Self-closing null elements -->
<img src="example.jpg" />
<br />
<hr />
This is no longer required.
<!-- The HTML5 way -->
<img src="example.jpg">
<br>
<hr>
Validate Your Pages
Finally, you should make it a habit to validate your HTML documents against the specification. This means using an automated tool to check whether the markup adheres to the standard or not.
The W3C provides an official Markup Validation Service, which allows you to quickly check your pages against the HTML5 specification (and older specs too, if you like).
<!–
Deprecated Features in HTML5
New Features in HTML5
–>