HTML The Skeleton – HTML5

Alright, this is most of HTML has to offer us. However, you may heard about HTML5. What’s HTML5?

HTML5 is virtually the same as regular HTML, but with more features. It makes some HTML coding easier with some new tags. In fact, the <!DOCTYPE> and <html> layout that was introduced at the start is all thanks to HTML5. Here’s some more of the other features below:


Buttons

Some of the first things HTML5 changed is the way we code button inputs. HTML5 introduced a new <button></button> tags; rather than using the <input type="button" />. It will give us the same result as the original, but when adding a value, we can just add the value between the tags.

<button onclick="alert('Hi!')">I'm a New Button</button>


Layout Containers

Another useful feature is new layout elements. It allows us to directly mark what elements goes with what. In HTML, we would need to do this with normal <div> tags. But in HTML5, they gave us new elements to use.

  • <article> = Used to mark article elements
  • <section> = Used to mark section elements
  • <nav> = Used to mark navigation elements
  • <header> = Used to mark elements for the header of the page
  • <footer> = Used to mark elements for the footer of the page

We can use elements like the above to layout our webpage how we want it. One caution on using these elements, displaying these elements on older browsers may cause some unexpected errors or side effects. It’s recommended to still use the above <div> tags to layout an HTML page, for more browser support.

There are more features that HTML5 has introduced, but these will be it for now.

To be blunt, HTML5 is basically “Super HTML 4: Arcade Edition.” Same game, just more features than the original.



Conclusion

Alright, this is most of HTML development. It’s a LOT, right? We have enough knowledge to build us a HTML page. However, if you’re following along, you may notice that everything looks…boring and stale.

But fear not! This is where the next chapter comes in: CSS.