Spend the next 45 minutes finding examples of semantic tags being used "in the wild", aka on live websites. For each tag, use MDN to help you write a definition of the semantic use of the tag, then find a live example, record the url for the website where the tag is used and write a sentence about (Is the tag is being used appropriately? Why or why not? You don't need to find an example for every tag, just do as many as you can. We'll share examples of uses found after completing.
Here are the various semantic tags to define and look for on the internet:
Use these tags to create the overall hierarchy of the content in your page:
- nav
- main
- article
- header
- section
- aside
- footer
- h1-h6
- ul
- ol
- li
These tags are for marking up text content within a structural element:
- p
- em
- strong
- b
- i
- s
- mark
- hr
- wbr
- pre
- br
- cite
- code
- kybd
- samp
- var
- q
- blockquote
- data
- a
- abbr
- small
- sub
- sup
- del
- ins
- time
- address
- ul
- ol
- li
- details
- summary