検索フォームはヘッダーにあるとアクセスしやすい。しかし邪魔なのでアイコンだけ置くという折衷案で妥協した。フルスクリーンの検索フォームにしようかとも考えたが、うっかりヘイトが貯まるのでやめておいた。

ヘッダーにある利点は、ウェブページ最上部に戻る手段が用意されていることだ。最下部に進む手段は用意されていないことがあるため、フッターに置いても利用しづらくなる。サイドバーに置くのも悪くはないが、狭い画面と広い画面での一貫性を持たせるのは難しい。

一方、検索フォームは主張が激しいため、フォームそのものがヘッダーにあると邪魔だ。最近はフォーカスすると拡大するものをよく見かけるが、ここではその次によく見かけるアイコンをクリックするとフォームが出てくる(と同時にフォーカスが当たる)タイプにした。これならステップも変わらない。

出し方にもいくつかアプローチがある。フルスクリーンで出したりドロップダウンで出したりすると、実装と実行の両面でコストが大きい。そこでヘッダーに新たに置いたアイコンをクリックすると、今まで通りフッターに置いた検索フォームへ移動し、フォーカスを当てるようにした。


Firefox 51やMobile Safari 10.2でうまくフォーカスが当たってない。このことについてはまた別に書く。