てんぽ: ドロップダウンメニューの使いどころ

ドロップダウンメニュー、あるいはプルダウンメニュー、ドロップダウンリスト。単にプルダウンとも。

• 月別・カテゴリ別アーカイブのドロップダウンリスト化（はじめてのFC2ブログカスタマイズ）

FC2ブログのカスタマイズの中でもメニューのドロップダウンリスト化は人気があるようで、共有テンプレでも採用しているものをよく目にします。 しかしドロップダウンメニューにも使いどころがあると思うのです。

長所

表示領域を節約できる。

短所

リストを表示させるまで選択肢（オプション）がわからない。

長所と短所を比べ、長所のほうが上回っていると判断できるならドロップダウンメニューは効果的です。 あるいは短所がほとんどなくなるような場合、たとえば都道府県を選ばせるメニューにはドロップダウンメニューは最適です。 この例で言えば、

• 選択肢が十分多い（表示領域の節約は確かなメリットになる）
• 選択肢があらかじめわかっている（短所がもはや短所ではない）

この特徴をナビゲーションメニューにも適用して考えると、 ドロップダウンメニューを「月別アーカイブ」に使うのは良さそうです。

月別アーカイブは多くなりがち（1年で12個）なのでドロップダウンリスト化する意味もありますし、 リストを表示させるまでもなく選択肢の予想はできます（「○年×月」であろうことはわかる。その数はわからないにしても）。

一方、「カテゴリ別アーカイブ」や「最近のエントリー」では、その数を自分で制御できるのであえて省スペース化する必要は小さいうえに、 リストを表示させてみないと選択肢がわからないというデメリットも顕在化します。

しかし、（FC2ブログで見られる）ドロップダウンメニューには別の大きな問題があります。 ページ移動にJavaScriptを必要とするのです。

• JavaScriptを使うなら

ウェブページでユーザビリティ、アクセシビリティの観点を重要視するようになればなおさらのこと、リンク記述をJavaScriptで制御する場合は気をつけなければなりません。JavaScriptが動作しない環境や、そのスクリプトでエラーを出せば、ハイパーリンク自体が動作せず、ユーザーは見たい情報にたどり着けなくなります。

（中略）

HTML自体では制御不能なことが可能になるのがJavaScriptですが、基本的にそういったページ移動制御をJavaScript依存で記述してはいけない、ということです。最初からJavaScriptでの動作効果を作る前にまずノーマルな状況で動作するようにして、その上にJavaScript の効果を「重ねる」ようにします。

こういう配慮の行き届いたJavaScriptの使い方がされていないことが多いのが残念です。 JavaScriptは「あると便利」ならいいんですが、「ないと不便」では駄目だと思います。

ナビゲーションをJavaScriptを使ったドロップダウンメニューにするなら、HTMLソース上ではul要素などで普通に書いておき、 それをJavaScriptを使ってドロップダウンリストに書き直すというのが理想です。