> For the complete documentation index, see [llms.txt](https://tech.x2bee.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://tech.x2bee.com/dev-guide/developer-guide-en/pjt-prepare/ui-ux-guide/screen-detail-guide/tab-application-guide.md).
# Tab Application Guide
Tabs divide the workspace within X2BEE's menus, and clicking a tab moves you between workspace screens.
This section explains the elements that make up tabs and how to use them.
***
## Basic Components
1. Compose a tab group at the top of the information the tab defines.
2. For tabs that allow input, include the save button in the common area so it can save on a per-screen basis.
3. When there are many tabs, you can use the tab direction keys. (Do not use nested "Tab in Tab" (vertical) double tabs.)
## Placement
Place and activate the most important or most frequently selected item, or the first tab in the work order, on the left.
Refer to the following guidelines for tab placement.
* Tabs should be arranged in a single row, not wrapped across two rows
* Selected tabs must be visually distinct from unselected tabs
* For the number of tabs in a TabControl, 5 tabs are recommended considering browser memory and loading speed, with a maximum of 10
## Tabs by Information Type
Type A
Represents groups of information at the same level, searched under the same query conditions, as tabs.
Used either as a type where same-level information is split across tabs, or as a process type arranged in business processing order.
Type B
A method that groups related screens and arranges them in business order; each tab can contain its own individual search area.
