More New Semantic Tags

These tags I have never met, so if they become of interest to me, I will have to google them. Most of these elements are probably too new for full browser support, but give it time!

<bdi>
Bi-directional isolation "bidi" defines a part of text that might be formatted in a different direction from other text. Better than BDO, if you are writing in Arabic, Hebrew, Persian, Thaana, Urdu, etc.

<dialog>
Defines a dialog box or window, which makes it easy to create popup dialogs and modals (bootstrap term) on a web page.

<figcaption>
Defines a caption for an image inside a <figure> element

<figure>
Defines self-contained content, like illustrations, diagrams, photos, code listings, etc.

<main>
Defines the main content of a document. Like the body tag, it can only be used once in a document.

<mark>
Defines marked or highlighted text

<menuitem> 
Defines a command/menu item that the user can invoke from a popup menu
<meter>
Defines a scalar measurement within a known range (a gauge) and different than the progress tag

<progress>
Defines the progress of a task. Not to be confused with meter tag

<rp>
This tag is used with the <ruby> and the <rt> tags and defines what to show for browsers that not support ruby annotations

<rt>
Defines an explanation or pronunciation of characters (for East Asian typography)

<ruby>
Defines a ruby annotation (for East Asian typography)

<time>
Defines a date/time but browsers don't show anything special to users. This element can also be used to encode dates and times in a machine-readable way so that user agents can offer to add birthday reminders or scheduled events to the user's calendar, and search engines can produce smarter search results.

<wbr>
Defines a possible line-breaks, like in long words

If using these tags, try using Google Chrome to view the results. Chrome seems to be the most "with it" browser. Most of these tags seem to work with it.

Back button Table of Contents Next button