HTML5 tags less known and less used

HTML5 comes with a lot of new features and every web developer have to interact daily and constantly with HTML, so we used to utilize popular html’s tags like “H1.. H6“, “P“, “SECTION“, “DIV” and more.. so you feel that there is no more unknowns in it. Let me say to you that there is much more less known and less used tags for me at least and I suppose for several developers on the ground didn’t known about.

I will list next in this post the tags I faced and I didn’t know about before.. If you have some plus please share it with us using comment section. And if I find some new tags this post will be updated.

<dialog>

Is an HTML tag used to create dialog on web pages, as a famous example of this dialog used to create pop ups that interact with others components and users conversations.
<dialog> return boolean by using attribute called “open” to specify status of “open” or “close”.

Syntax

<dialog>
  Opened Dialog
</dialog>

<dialog open>
  Closed Dialog
</dialog>

<progress>

The element give us the ability to follow the progress of a task, you can using it under any parent elements. As a main attributes this tag accept “value” and “max”. You can use it with JavaScript to give users a great interaction. As example “To making a Quiz app”.

Syntax

<progress value="80" max="100">80 %</progress>

You will get this result:

progress tag example

<cite>

Cite tag can be used to reference some work, book or services, the web browser will detect it as that, and you can add your touch on it using CSS.

Syntax

<cite> Your text here.. </cite>

Example

    <section>
        You can check my <cite><a href="http://www.bounouara.me">BLOG</a></cite> for more
    </section>

Add this HTML section to your web page and you will get this result:

cite tag example

<figcaption>

In popular cases we use <figure> tag to mark a photo inside, give us the ability to add caption to this photo, and that gives our page integration more accessibility to the whole elements

Syntax

<figure>
  <img src="myimage.jpg" alt="my image">
  <figcaption>My Image - Morocco</figcaption>
</figure> 

In this blog post I tried to discuss with you some of less used HTML tags in my humble view, so maybe there are more tags less used and less known if you know one try to share it with us with thanks.

Happy coding!.

References

HTML: HyperText Markup Language

Leave a Reply

Your email address will not be published. Required fields are marked *