HTML 5 Content Tags

HTML 5 introduces several new tags which focus of defining the content of a page in a machine readable fashion.

In today’s websites, if a computer program attempts to pick out a particular part of a page, such as the main article, the sidebar or the top navigation, it would have difficulty. This is because every website structures its HTML differently, and most modern websites use <p>, <div> and <span> tags to surround their content. These tags generally define style. The new HTML 5 tags define content.

Defining content makes websites easier to parse by computer programs. This could benefit accessibility readers for the blind and allow content aggregating systems and ‘mash-up’ websites to easily parse, link to and cite your articles.

Here is a list of some of the HTML 5 tags that define content.

  • <article> – Defines a main article on a page. Can include cite (citation) and pubdate (publishing date) attributes.
  • <details> – States content details for a specific section. Can include an open attribute defining whether or not the details within are visible to the end-user.
  • <figcaption> – States the caption for a figure as defined by the figure tag.
  • <figure> – Usually used to group a set of elements.
  • <footer> – Footer layout element. This is used to contain the footer content of the page, usually contains the website name, author and copyright information.
  • <header> – Header layout element. This tag is designed to contain the top header of a document, usually showing the website logo, page and/or company title and subtitle.
  • <hgroup> – A tag used to group together heading tags such as <h1>, <h2>, <h3> and so on.
  • <keygen> – A key generation tag which defines a generated (encryption) key that can be associated with a HTML form.
  • <meter> – The <meter> tag contains content which is deemed to be a measurement of some sort.
  • <nav> – The <nav> tags stands for navigation and is designed to surround navigation links, such as those present in a sidebar bar or navigational header/footer.
  • <summary> – The <summary> tag defines the title of a <details> element.
  • <time> – This tags contains content which is a statement or measurement of time and/or date/time.

More information about HTML 5 tags is available from W3Schools. See the HTML 5 Tag Reference for more details on these tags and the other new tags in HTML 5.