The tab template allows sections of content, separated into different panes as well as to allow a user the ability to seamlessly and intuitively switch back and forth between respective sections.
Criteria
Tabs minimize the usage of screen space, which improves the overall look, organization and functionality of the page.
Use a minimum of three tabs or a maximum of five. Accordion view is recommended more than five sections are required.
Tab labels should not exceed two lines.
Use title case for tab labels.
Always use the ampersand (&) instead of “and” in accordion labels
Order your tabs logically and assign a short title for each.
Do not use tabs when they do not lend themselves to the content, such as when the information needs to be presented in a sequential order or when information needs to be compared.
Do not use tabs if content should not be hidden until clicked on.
Inline images can be used in a tab so long as they add value to the text and are used in a consistent way.
Note that on mobile, tabs are displayed as accordions.