HTML5 Page Elements

HTML5 offers new elements for better document structure:

Tag	Description
<article>	Defines an article in the document
<aside>	Defines content aside from the page content
<bdi>	Defines a part of text that might be formatted in a different direction from other text
<details>	Defines additional details that the user can view or hide
<dialog>	Defines a dialog box or window
<figcaption>	Defines a caption for a <figure> element
<figure>	Defines self-contained content, like illustrations, diagrams, photos, code listings, etc.
<footer>	Defines a footer for the document or a section
<header>	Defines a header for the document or a section
<main>	Defines the main content of 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)
<nav>	Defines navigation links in the document
<progress>	Defines the progress of a task
<rp>	Defines what to show in browsers that do not support ruby annotations
<rt>	Defines an explanation/pronunciation of characters (for East Asian typography)
<ruby>	Defines a ruby annotation (for East Asian typography)
<section>	Defines a section in the document
<summary>	Defines a visible heading for a <details> element
<time>	Defines a date/time
<wbr>	Defines a possible line-break

A unit of text

Text is the detailed information.

An icon: Icons are representations of tasks or objects.
A label: Labels are used for identifying or clarifying an icon.
A framed area: Frames are used to set content apart or divide a screen.
A color-highlighted area: Color fields can be used to direct attention to a particular place on the screen.
An animation figure: Animations are moving images that aid learning.

What Is Interaction Design?

Mobile interaction design can be a somewhat confusing term for those just beginning their careers in interface design.
Often used interchangeably, interaction design and interface design are completely different concepts, and it is important not to mistake one for the other. In fact, the two ideas can appear to be so similar that a casual reading of this text could make it seem as if we are confusing the two as well. They have separate definitions, however, and although they do work together to achieve the same goal, they are actually quite different.
Interface design involves the technical pieces and intricate design language created and mandated by a platform developer for use in a specific operating system. On a popular mobile system such as Android, this includes standards such as using Roboto as a system font or applying the Holo Light or Dark visual theme styles that specify suggested color, font size, line height, or other properties of phone interfaces. Apple has its own carefully defined set of interface design standards.