タブのオーバーフロー：年間のタブのスペースがなくなった場合はどうすればよいですか？
毎年受賞者をタブで区切って、以前の受賞者をリストしたページがあります。
- 毎年40人の受信者がいます。
- 受信者の名前が、その肩書きと会社とともにリストされます。
- 同じ人物を最大3年間で選択できます。
- 3年の優勝者は名誉の殿堂入りしますが、ここでは紹介しません。
- 現在、毎年の受賞者は別のタブに表示されています。
問題は、スペースが不足していることです。来年以降、タブを追加する余地はなくなります。合計で最大20年間の賞に有効なこのデータを整理する別の方法は何ですか？
注：「 タブオーバーフロー 」という名前をありがとう Robert Fraser 。
過去10年間のアワードを11番目のタブで表示して、過去10年間に移動するのはどうですか？
2011 | 2010 | 2009 | 2008 | 2007 | 2006 | ... | Older
ほとんどの人は最新のアワードに興味があるだけなので、古いアワードを2回クリックするだけでも大きな問題にはなりません。
「古い」をクリックすると、次のタブのあるページが表示されます。
Recent | ... | 2000 | 1999
それ以外は現在のページと同じに見えます。追加の視覚的な手掛かりとしてカラースキームを変更することもできますが、それは「存在する力」次第です。
「...」タブを作成し、JavaScript（yay jQuery）を使用して、クリックすると右に「スクロール」して他のタブが表示されるようにすることができます。次に、左側に矢印を表示して、新しいタブに戻ることができます。 （インスピレーションのためのTY @ChrisF）
記録のために、私は@ChrisFの答えが好きですが、ここではキックのためにGoogleスプレッドシートがそれを処理する方法を示します。
私はおそらくリストの上にバーを追加し、ドロップダウンを置いてバーの左側に年を選択します。その後、ドロップダウンを介して他のフィルタリングオプションを追加する余地もあります。
タブは、ページ分割に使用するのに適したメタファーではない可能性があります。所定のスペースに収まらない年に到達するためにページをリロードすることを避けたい場合は、スクロールする水平リストの方がうまく機能する場合があります。
AppleのMacページ の上部にある製品リストを確認してください。
年のリストが途方もなく大きくなることは決してないので、非イミディエイトページを非表示にするなどの一般的なページネーションの問題について心配する必要はありません。
"‹... 148 149 150 151 152 ...›"
すべての年を一覧表示し、すぐには関係のないものを除外する方法を見つけるのがおそらく最善です。
年数がそれほど多くない場合は、最後にドロップダウンメニューの下に「古い」年を置くことができます。
あなたはFirefoxのように行うことができます。非表示のタブのスクロールがあります。あなたが持っているスペースよりも多くのタブをロードすることができます。または、Chromeのように、さらにタブを追加してタブを小さくすることもできます（この方法は、タブを小さくするとラベルが消えるため、このケースでは機能しません）。タブのスクロール領域があることが最善の解決策だと思います。このように、ユーザーには制限がありません。ドロップダウンリストを追加して、ユーザーがページをすばやく切り替えることができるようにすることができます。
タブには制限付きのセットがあるので（「20年」の価値があると述べました）、「垂直タブ」を使用できます。これは、ほとんどのブログソフトウェアのサイドバーに「カテゴリ」または「アーカイブ」があるようなものです。次に、必要に応じて、現在のタブがある上部の上部に、最も重要なトラフィックの多いアイテムを使いやすい形式で配置できます。
たとえば、私のWebサイト（標準のテンプレート）の左側には、「アーカイブ」リストが表示されています。
http://www.aaronlerch.com/blog/
（私が自分のサイトをひっくり返そうとしているわけではないことに注意してください。私が探しているものを知っていたので、最初に思いついたのはそれだけでした:)
ここの他の人と同様に、タブからも離れることをお勧めします。
しかし、それらに行き詰まっている場合は、さらにタブを列に詰め込んで縮小することができます。 （Chromeのタブを考えています。）タブが狭すぎてラベルが収まらない場合は、ラベルを切り捨てます。あなたの場合、あなたは年の初めを切り捨てたいでしょう：
| ..12 | ..11 | ..10 | ..09 | ..08 | ..07 | ..06 | ..05 | ..04 | ..03 | ..02 | ..01 | ..00 | ..99 |
確かに最適ではありませんが、タブを破棄することに同意するまで、クライアントを落ち着かせる可能性があります。
タブを表示するには、タブが最適ではない可能性があります。ただし、クラシックナビゲーションを壊したくない場合は、2つの矢印を配置する必要があります。1つは左を指し、もう1つは右を指します。
また、最も頻繁に（または過去10年まで）使用されると思われるタブを表示することもできます。最後に、「古い」というタブがあり、JavaScriptを使用してクリックすると残りの古い年のリストが表示されます。リストが本当に長いと表示するために非常に多くの古い年がある場合、このアプローチはそれほどうまく機能しない可能性があります。また、これは、JSが有効になっていないユーザーに対して行うことを考慮していません。
これらのタブはすべて、非常に忙しくて騒々しいデザインにもなっています。私もthinkタブは、同じデータのバリエーションではなく、データの異なるセットをグループ化するのに適していると考えています。
どちらかの側に前/次のボタンがあるドロップダウンのようなものをお勧めします。またはサイドバーまたは何かのリスト。
ユーザーが好奇心から、数年間を閲覧することを期待していますか、それとも特定の年の賞をレビューしたいと思いますか？後者の場合、テキストフィールドはさらに高速になります。
次のタブ、前のタブ、タブの次のページ、タブの前のページ、ボタンは必要ですが、十分ではありません。
-リモートタブにスクロールすると本当に面倒です。
階層タブを使用してみてください-内部に年のタブがある10年のタブ。
また、年を入力して、ユーザーが目的のタブに直接ジャンプできるようにします。