"HTML5 e CSS3 - Módulo 2"
Semantics

"Curso em Vídeo"
This is the student's notebook of Ricardo Barros Becheli

HTML Semantic Elements

Semantic elements = elements with a meaning. HTML5 was built to be semantic, to attribute meaning to its content.

What are Semantic Elements?

A semantic element clearly describes its meaning to both the browser and the developer.

The opposite of that are the CSS styles, which give a form, a look to the content, like now.

Examples of non-semantic elements: div and span - Tell nothing about its content, they just select an area (to be worked by CSS or JS).

Examples of semantic elements: <form>, <table>, and <article> and many others. They clearly define their content.

But be careful where semantics meets logic:

A cartoon illustration of structural ambiguity. (Image courtesy of MIT OpenCourseWare.)
A cartoon illustration of structural ambiguity. (Image courtesy of MIT OpenCourseWare.)

Learn more at w3schools.