HPのメニュー名が長いとき、文字を小さくする前に考えること

HPのメニュー名を一行に収めようとして、文字を小さくしていませんか。先に「名前として残す部分」と「別に添えられる説明」を分けると、意味を変えずに読みやすくする方法を考えられます。

長い名前を無理に一行へ押し込むことだけが、整った表示ではありません。

一つのメニューに属する情報を見る

制作例

トップページの料金案内では、メニューが行ごとに並びます。名前、内容の補足、価格がどの単位で組になっているかを見てください。

名前と補足には、違う役割がある

制作例

制作例には「CUT」「CUT + COLOR」「CUT + PERM」という名前があり、その下に内容の補足、右側に価格表示があります。名前はメニューを見分ける情報、補足は何が含まれるかを確認する情報です。実際の名前がさらに長い場合も、文字だけを小さくする前に、二つを分けられないか考えます。

長い名前を整える三つの選択肢

正式な名前を変えられない場合は、意味の切れ目で折り返します。続きが次の項目に見えないよう、名前のまとまりを保ちます。

名前の中に所要時間や含まれる内容まで詰め込んでいる場合は、補足へ分けられるかを検討します。選ぶために欠かせない条件は、どのメニューのことか分かる位置に残します。

短い表示名を使う方法もあります。ただし予約画面や店頭の案内と違う場合は、同じメニューだと分かるようにします。略称は制作側だけで決めず、事業者に確認します。

スマホでは、名前の続きまで一組で確認する

PCの一行が、スマホでも一行になるとは限りません。実際の幅で、名前の折り返し、補足との間隔、次の項目との区切りを確認します。短くすると内容を取り違えるなら、無理に省略せず複数行で見せます。

そのまま使える依頼メモ

・正式なメニュー名：＿＿

・短くしてよい部分／変えてはいけない部分：＿＿

・別の行に分けられる説明や条件：＿＿

・予約先や店頭で使っている名称：＿＿

・確認したい画面と、長さが気になる項目：＿＿

メニュー表とこのメモを添えて、HP制作をご相談ください。掲載内容とスマホでの見せ方を整理し、必要なページ・掲載量・作業範囲を購入前に確認します。