本文へ移動

タブ(グラフィカルユーザーインターフェース)

単一ウィンドウ内で複数のパネルや文書をまとめ、切り替えるためのGUI要素。タブは整理を容易にし、画面の煩雑さを減らすため、ブラウザー、エディター、設定ダイアログなど多くのアプリケーションで使われる。

概要

グラフィカルユーザーインターフェースにおけるタブは、単一のウィンドウ内で異なるパネル、文書、または表示を切り替えるためのコントロールである。通常、同時にアクティブになるタブは1つだけであり、タブを選択すると対応する内容が表示され、ほかの内容は隠される。タブは、別々のウィンドウを開かずに複数の作業コンテキストを管理する、コンパクトで親しみやすい方法を提供する。

画像ギャラリー

8 画像

構造と動作

タブは一般に、ラベル付きの見出しを横一列に並べて表示するが、縦の列として配置される場合もある。各見出しは、コンテナーまたは文書に対応する。主な属性には次のようなものがある。

  • タブの内容を示すラベルまたはアイコン。
  • 現在選択されているタブを示すアクティブ状態。
  • 分離可能な文書を閉じるためのコントロール(多くは×記号)。
  • タブの並べ替えや新しいウィンドウへの移動を行うためのドラッグ・アンド・ドロップ対応。

プログラマーはツールキットやフレームワークのウィジェットを用いてタブを構築する。アクセシビリティとキーボード操作は重要な考慮事項である。

歴史と普及

タブは、ファイルフォルダーやノートブックなどのデスクトップ・メタファーから発展した。初期の文書ベースのシステムと、その後のウェブブラウザーは、複数のページで1つのウィンドウ枠を共有できるようにすることで、この形式を広めた。時とともにタブは、設定ダイアログから統合開発環境まで、多様な種類のアプリケーションに取り入れられてきた。

用途と例

タブは画面上の煩雑さを抑え、関連する情報をまとめるために広く用いられている。例として、次が挙げられる。

  • 1つのウィンドウで複数のページを開き、ナビゲーションや作業の切り替えを改善するウェブブラウザー。
  • 各文書をタブとして扱えるワードプロセッサーやエディター(ワードプロセッサー)。
  • 「一般」「セキュリティ」「外観」などのセクションを分ける設定または環境設定のダイアログ。

バリエーションと特筆すべき事項

設計者は、角丸、角形、積み重ね表示などの視覚スタイルや、閉じる操作、固定、オーバーフローメニューなどの操作モデルを変化させる。モバイルインターフェースでは、従来のデスクトップ用タブの代わりに、セグメント化コントロールやスワイプ可能なタブバーが実装されることが多い。適切に実装されたタブは、見つけやすさ、キーボード対応、多数の同時項目を管理する能力の均衡を図る。

関連項目

著者

AlegsaOnline.com タブ(グラフィカルユーザーインターフェース)

URL: https://ja.alegsaonline.com/art/95781

共有