This article describes filters and their implementation. A Tab/Filter gives the user a way to easily switch between views or to filter a set of data.
Notes
Tabs / Filters have the following characteristics:
- Tabs are displayed as a horizontal sequence of buttons.
- Only one tab can be selected at a time.
- Tabs are typically placed at the bottom of a view where they are more easily accessed.
- Tab / Filter button widths vary depending on the number of filters in a single set.
- There is a minimum of two Tabs / Filters per set and a recommended maximum of five.
- They may be labeled with either text or icons, but not both.
- Tabs / Filters are written with title case capitalization and have no ending punctuation.
Tabs / filters can be used for two purposes:
- Navigation (A) in which to present as a navigational widget for switching between sets of views.
- Data filtering (B) in which the user can view a single set of data in different ways.
Tabs / Filters can be placed inside a header on the top of the screen, or within the toolbar at the bottom.