Some cool features are introduced in HTML5 which help in better SEO and reducing dependency on external plugins.
- Tags like <header>, <nav>, <section>, <aside>, <footer> are introduced in html5. For example <header> tag is used to define header for a page or a section in a page. But it does not have any inbuilt CSS to make it look like a header. For example, it doesn’t make it center aligned. Earlier in previous versions of HTML the developer had to name a particular section for himself with id or class names. This made it very difficult to search engines to know what is what.
The purpose of these new elements is to let browser to know what a particular section is meant for and also help in SEO.
3. Declaring language attribute in html tag is helpful for screen readers and in SEO.
4. Using figure and figcaption tags:
<img src="img_pulpit.jpg" alt="The Pulpit Rock" width="304" height="228">
<figcaption>Fig.1 - The Pulpit Rock, Norway.</figcaption>
Usage: to display images along with captions.
5. Only MP4, WebM, and Ogg video formats are supported by HTML5 and MP3, WAV, and Ogg audio formats are supported by HTML5.
6. HTML5 video tag usage:
<video width="320" height="240" autoplay controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
- Controls: used to show play/Pause/Stop buttons
- Autoplay: plays the video on loading without requiring any user action.
- If the browser doesn’t support the video tag, the text is displayed.
7. HTML5 audio tag usage:
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
8. Object tag is used to embed plugins, images or even html files into the current html page.