When writing HTML developers often use common tags like div, section, p, span and that's ok.
But to give your markup more meaning (make it more semantic) I suggest you start using following tags more often. So instead of plain old divs and spans try:
1. address
Use this tag whenever you need to wrap the contact information or a contact address.
<address>
150 Deansgate,<br>
Manchester M3 3EH,<br>
United Kingdom
</address>
This tag may also include:
any type of contact information that is needed, such as a physical address, URL, email address, phone number, social media handle, geographic coordinates, and so forth. - MDN
2. del
To mark the content that has been deleted from the document use del. This element comes with the default strike-through styling.
One of the most common uses for this element I found to be is displaying prices.
<p>
The item is sold out <del>19.95$</del>
</p>
Often this element can be seen along side its counterpart ...
3. ins
It is used to show that the content has been added to the document instead.
Again nice example with prices, ins is the new price here:
<p>
The item is on sale only <ins>9.95$</ins> <del>19.95$</del>
</p>
4. small
This tag is used to define side-comments and small print. The contents of the small tag is usually have smaller font-size style by default. One of the uses is to wrap copyright or legal text in the footer.
<footer>
<p>Yoursitename</p>
<small>Copyright Β© 2019</small>
</footer>
5. time
Finally this tag is used to display specific time or date. Often time tag comes along with the datetime attribute which indicates the time and/or date.
Often is used to display published post date and time.
<p>
Published on <time datetime="2019-11-27T00:30">November 27, 2019</time>.
</p>
Top comments (3)
Thanks for this. I just went and implemented the time tag on one of my sites. π
This is an excellent reminder of writting languages with attention to detail
This is awesome. I'll start using these on my website itself.