ラベル UI の設計

フォーム・ボタンやリンクの文字列など、ホスピタリティの高い「ラベル」の UI 設計を考える。

目次

ブログの「前後の記事」リンク

「前の記事」「次の記事」。日本語は「前後」や「後先」の概念が複雑で分かりにくい。「前の記事」はこの記事よりも新しいのか?古いのか?

よく見かけるのは、

というように、ペアでの配置とレイアウトによる表現が多いが、たまに右側に「前の記事」が配置されたサイトも見かける。左右が時系列 (過去と未来) を表現していて、「次」という言葉がセットで登場すればまだ推測がつくのだが、その概念に一見反するようなレイアウトや文言が出てくると凄く分かりづらい。

英語圏だと、「Prev (Previous) Post」と「Next Post」のように表現され、時系列が分かりやすい。一方日本語だと、「過去」「未来」と書くと仰々しいし、文字数を揃えたい意向から、「前の記事」「次の記事」などという表現が多い。コレを「手前の記事」「後の記事」などと呼んでもイマイチピンとこないし、「戻る」「進む」という単語はブラウザバックを連想させて違和感がある。

ココは潔く、「古い記事」「新しい記事」、というリンクラベルにするのはどうだろうか。文字数は揃わないが、Prev・Next に近い時系列的な概念を伝えられるし、「前後・後先」のような紛らわしい語を使わないことで、分かりやすさを優先している。自分が以前運営していたはてなブログでは、自分でカスタマイズしてこのように表現を調整していた。