マガジン

ヘッダーの言語切り替え:なぜそこにあるのか

遊びを見つける

執筆にClaudeを使用しています。

ゲームを実際に動かしながら、下書きの説明カードを鉛筆で確かめる手元。
記事のテーマをもとに制作したAI生成の写真風イメージ。

初めて開いたサイトの文字が、ほとんど読めない場面を考えてみます。メニューも案内も読めないので、まず「読める状態に直したい」と思います。このとき、言語を切り替えるボタンが見つからなければ、ほかの機能は使えません。言語切り替えは、他の機能が使えるかどうかを左右する、特殊な機能です。 ページの上部、つまりヘッダーは、どのページでも同じ位置に出続ける場所です。そこに置けるものは数に限りがあります。ロゴ、検索、ログイン、メニュー、そして表示の好みに関する設定が競い合います。この記事の問いは、「どんな機能なら、常に見える場所に置く資格があるのか」です。言語切り替えを題材に、置き場所を決める判断を分解します。 結果を先に書くことはしません。以下は、読者が自分のサイトやゲームの画面で数えて確かめるための、分析の手順です。

この記事の目次
  1. 常に見える場所に置く資格を、5つの問いに分ける
  2. 手順1:常時表示の要素を書き出して採点する
  3. 手順2:「たどり着くまでの操作数」を数える
  4. 手順3:読めない状態を作って試す
  5. 手順4:切り替えの「効き方」と進行の保持を確かめる
  6. 手順5:代替の置き場所と比べて決める
  7. 次の行動

常に見える場所に置く資格を、5つの問いに分ける

「大事だから目立つ場所に置く」という判断は、反対の意見が出ると決着がつきません。そこで、置き場所の判断を次の5つの問いに分けます。

  1. 先行性:他の操作より先に必要になりますか。言語は、読めないと他の操作ができないので、この問いに強く当てはまります。
  2. 普遍性:どのページ、どの状況でも必要になりますか。特定の画面でしか意味がない機能は、その画面の中に置けば足ります。
  3. 見つけやすさの要求:困っている人が自力で見つけられる必要がありますか。「読めない」状態の人は、説明文を読んで探すことができません。
  4. 取り消しやすさ:間違えて押したとき、同じ場所から戻れますか。言語を誤って変えると、読めない画面に放り込まれます。戻る手段が同じ場所で見えることが重要です。
  5. 場所の代替性:設定画面やフッターなど、別の場所に置いても同じ役目を果たせますか。

アソバースで確認できる範囲では、サイトは日本語と英語の表示切り替えを備えています。ライト/ダークの切り替えと「動きを抑える」設定も同じ「表示の好み」のグループです。これらを実際にどの位置に置いているかは、この記事では断定しません。サイトを開いて、ヘッダーに何が並んでいるかを自分の目で確かめてください。

手順1:常時表示の要素を書き出して採点する

最初の作業は棚卸しです。

準備するもの:調べたい画面(サイトのトップ、作品ページ、一覧ページなど3種類以上)、メモ用の表計算ソフトか紙、できれば自分以外の評価者2人。

手順:

  1. 各画面を開き、スクロールしても残り続ける要素を、1行につき1要素で書き出します。ロゴ、検索欄、各種メニュー、言語切り替え、テーマ切り替え、ログイン関連などが候補です。
  2. 要素ごとに、先ほどの5つの問いへ「はい(○)」「どちらでもない(△)」「いいえ(×)」で答えます。
  3. 評価者が複数いる場合は、各自が単独で採点してから突き合わせます。話し合いながら採点すると、声の大きい人の意見に引きずられます。

集計の単位は「要素1つ × 問い1つ」です。要素ごとに○の個数を数えますが、最初は重みをつけません。重みをつけるのは、集計を見て違和感があってからにします。

読み方は次の通りです。

  • 5つの問いのうち、先行性と見つけやすさの要求が両方○の要素は、常設の有力候補です。
  • ○が多くても、取り消しやすさが×の要素には要注意です。常に見える場所に置くなら、押し間違いへの備えがセットで必要になります。
  • 普遍性が△や×の要素は、常設より、必要な画面の中に置く案を先に検討します。

手順2:「たどり着くまでの操作数」を数える

採点は頭の中の判断なので、実際の操作でも確かめます。課題は一つだけで、「いまの表示言語を別の言語に切り替える」です。

記録の取り方:

  • 単位は「ページ1つ」です。トップ、一覧、作品ページ、ログイン画面など、少なくとも4ページを選びます。
  • 各ページで、開いた直後の状態から言語が切り替わるまでの操作数を数えます。クリックやタップ、スクロール、メニューの展開をそれぞれ1回と数えます。
  • 各ページで3回繰り返します。2回目以降は場所を覚えているので、1回目の数を主な記録とし、2・3回目は「慣れでどれだけ減るか」の参考にします。

結果の読み方:

  • どのページでも操作数が同じなら、位置が一貫していることを意味します。ページごとにばらつく場合は、場所を覚えにくい配置です。
  • 1回目と3回目の差が大きいなら、場所は見つけにくいが慣れれば使えるという配置です。「初見の人」を優先する機能では問題になります。
  • 設定画面の奥にある場合、先行性が高い機能なのに操作数が多いという矛盾が出ます。置き場所を見直す根拠になります。

手順3:読めない状態を作って試す

この分析で最も起こりやすい誤りは、自分が読める言語で試してしまうことです。日本語を普通に読める人は、日本語表示のまま「言語切り替えはどこか」を探します。ラベルの文字が読めるので、見つけやすさを過大に評価します。

これを避けるために、次の「往復課題」を行います。

  1. 普段使っている言語から、読み慣れない言語の表示に切り替えます。
  2. 切り替えた直後の画面で、元の言語に戻す操作を行います。
  3. 戻すまでに迷った箇所を、「どの要素で目が止まったか」の形で記録します。

この課題で見たいのは、取り消しやすさと見つけやすさの要求の2つです。次の点を確認します。

  • 切り替えボタンの位置は、切り替え前と後で変わっていませんか。
  • ボタンの表記は、現在の表示言語に引きずられていませんか。一般に、言語名は「その言語自身の表記」で示すのが定石とされています。たとえば日本語の選択肢は、どの表示言語でも日本語として読める形です。これなら、読めない言語の画面でも元に戻れます。
  • 小さなアイコンだけで示している場合、意味が通じない人はいませんか。評価者に、初めて見る人を1人入れてください。

アソバースの確認済みの範囲では、日本語・英語の表示切り替えは作者が入力した作品名や紹介文を書き換えません。したがって、切り替えたとき「サイトの案内は変わるが、作品名や紹介文はそのまま」という画面になります。これは仕様上の動作ですが、初めて見る人にとって混乱の原因になりえます。往復課題の中で、混乱が起きるかどうかも観察項目に加えてください。

手順4:切り替えの「効き方」と進行の保持を確かめる

ヘッダーに置く機能は、押した結果がどこまで及ぶかも判断材料です。ページ全体に及ぶのか、開いている作品の中にまで及ぶのか。この範囲が分からないと、押すのをためらいます。

アソバースの公式作品13本は、サイトの日本語/英語設定に合わせて表示を切り替えます。また、言語を変えたときも、プレイ画面を拡大したときも、進行を保つよう作られています。この点を使って、遊んでいる最中に切り替えた場合を確かめます。

確かめる手順(作品1本ごと):

  1. 作品を開き、進行が目に見える状態まで遊びます。たとえば「かたちのあいだ」なら数手動かした配置、「潮目のオセロ」なら数手進んだ盤面です。
  2. その状態で言語を切り替えます。
  3. 盤面・手数・選択中の項目が、切り替え前と同じかどうかを見比べます。メモか、切り替え前後のスクリーンショットを使います。
  4. 作品ごとに「保たれた/一部変わった/変わった」を記録します。

読み方:

  • 全作品で保たれているなら、ヘッダーのような目立つ場所に置いても、遊びを壊すリスクが低いと判断できます。
  • 作品によって結果が異なる場合は、その作品の画面にだけ注意書きを加える案が出てきます。
  • 保存のある作品とない作品で結果が分かれるかどうかも、確認する価値があります。保存があるのは「余白の庭」「WAVE / WAVE」「かたちのあいだ」の3作品で、ほかの10作品の記録や録音は画面を開いている間だけです。言語切り替え後も画面を開いたままなので、後者でも進行が残っているかを見ます。

ここで記録するのは「保たれたかどうか」だけで、理由の推測は書かなくて構いません。理由は、作品を開いて確かめるか、公式の案内で確認してください。

手順5:代替の置き場所と比べて決める

最後に、ヘッダー以外の候補と比べます。次の表は一般的な傾向の整理です。実際の評価は、自分の画面での記録に基づいて書き換えてください。

  • ヘッダー、向いている点:どのページからでも到達できる。読めない状態でも探せる、注意する点:面積を取る。他の要素と競合する
  • 設定画面、向いている点:好みの設定をまとめられる、注意する点:そこへ行く導線が読めないと到達できない
  • フッター、向いている点:面積を取らない、注意する点:ページの最下部までスクロールが必要で、見つけにくい
  • 初回の選択画面、向いている点:最初に一度だけ決めさせられる、注意する点:後から変えたいときの入口が別に必要
  • ブラウザ設定の自動判定、向いている点:操作が要らない、注意する点:判定が外れたとき、手動で直す手段が必須

どれか一つに決める必要はありません。複数を組み合わせる設計が多く、たとえば「自動判定+ヘッダーの手動切り替え」は、判定の失敗を手動の入口が受け止める組み合わせです。

この表と手順1〜4の記録を合わせて、次の順で判断します。

  1. 先行性と見つけやすさの要求が○なら、常設に回します。
  2. 常設した機能について、取り消しやすさが×なら、同じ場所から戻れるようにします。
  3. 手順2の操作数が、ページによって大きくばらついたら、位置と見た目を揃えます。
  4. 手順4で進行が保たれなかった作品や画面があれば、その箇所だけ別に対処します。
  5. 常設に値しない機能は、必要な画面の中か設定画面に置きます。

ライト/ダークの切り替えや「動きを抑える」設定にも、同じ採点が使えます。先行性が言語ほど高くなければ、設定画面の中に置く判断も十分あり得ます。逆に、動きが苦手な人にとって最初の画面から必要なら、扱いが変わります。この結論は採点で決まるものなので、先に決めつけないでください。

次の行動

まず、自分が使っているサイトか作ったゲームを1つ選び、常時表示される要素を書き出して5つの問いで採点してください。次に、読み慣れない言語に切り替えて元に戻す往復課題を、できれば初めて見る人と一緒に行います。アソバースの作品では、遊びかけの状態で言語を切り替え、進行が保たれているかを1本ずつ見比べてみてください。