Semantic elements clearly describe their meaning to both the browser and the developer. Examples of non-semantic elements: <div>, <span>. Examples of semantic elements: <header>, <article>.
| Tag | Description |
|---|---|
| <header> | Page/section header |
| <nav> | Navigation links |
| <main> | Main content |
| <section> | Thematic grouping |
| <article> | Self-contained content |
| <aside> | Sidebar content |
| <figure> | Image with caption |
| <figcaption> | Caption for figure |
| <footer> | Page/section footer |
| <time> | Date/time |
| <mark> | Highlighted text |
Edit the code below and click Run to see the result live.