HTML semantic înseamnă să folosești elemente care descriu sensul conținutului lor, nu doar aspectul acestuia. Un <nav> spune "aceasta este navigație"; un <button> spune "aceasta este clickabil" — în contrast cu un <div> care nu spune nimic.
Home
Home
Amândouă pot fi stilizate identic, dar doar al doilea este înțeles de browsere, cititoare de ecran și motoare de căutare.
<header>, <nav>, <main>, <footer>, permițând utilizatorilor să sară între regiuni. Un zid din <div>-uri nu le oferă nimic.<h1>, <article>, <main> și înțeleg structura paginii.<button> este focusabil, activabil cu tastatura (Enter/Space), și anunțat ca buton — un <div onclick> nu este niciuna din acestea decât dacă le re-adaugi manual.<header> <nav> <main> <article> <section> <aside> <footer>
<figure> <figcaption> <time> <mark> <button> <h1>–<h6>
Regula de bază: alege elementul care înseamnă ceea ce intenționezi, și folosește <div>/<span> doar ca containere de stil când niciun element semantic nu se potrivește.
Este cea mai ieftină victorie în accesibilitate și SEO pe care o poți obține.