Webサイト運用あるある:「ここの文字だけ目立たせたい」編

  • マーケティング

こんにちは! Web運用ディレクターのY氏です。

日頃のWebサイト運用更新でよく発生する状況を「Webサイト運用あるある」として取り上げ、より安定した運用を継続するためのポイントをご紹介します。今回のテーマは「文字装飾」です。下記のような場面に遭遇することはありませんか?

  • ページ内のここだけ目立たせたい(赤字・太字・下線つき など)
  • ガイドラインでは注釈の文字を小さくすることになっているが、読みづらいので、ここだけ文字を大きくして欲しい
  • サイトで定義している小見出しのデザインが目立たないので、ここだけ中見出しのデザインにしたい

20171106_01.jpg

Webサイト運用更新には“つきもの”と言えるほどよく発生する状況ですが、文字装飾をページごとに変えてしまうと、思った以上に多くのリスクがあります。

サイトの体裁が崩れ、クオリティーやデザイン効果が下がる

多くのWebサイトは「デザインガイドライン」を定義し、一定のデザインルールに沿って運用されています。ガイドラインに沿うことで、サイト全体の体裁が保たれ、情報の優先度が明確になり、一貫したブランドイメージを訴求できます。ところが、ページによって文字の大きさや色などの装飾を変えてしまうと、サイト全体の統一感が失われ、情報の役割が不明瞭になり、一貫したブランドイメージを訴求できなくなるなど、Webサイトの機能が大きく低下してしまいます。

特に、文字の大きさについては「文字のジャンプ率」という概念があり、ほとんどのWebサイトではページ内で大きい文字や小さい文字を“適切な比率”で定義し、重要な情報の視認性が高まるように設計しています。しかし、ガイドラインに定義されていない文字サイズを増やしてしまうと「文字のジャンプ率」の効果が薄れてしまい、閲覧者が重要な情報を判別できなくなってしまうばかりか、雑然とした見にくいWebサイトになってしまうことで閲覧意欲を削ぐ(=離脱率を増やす)原因にもなりかねません。

また、文字の色についても、通常はベースカラー・メインカラー・アクセントカラーの3色程度で構成します。ページ内の色が多すぎると、それぞれの色の役割が不明確になり、閲覧者が情報の種別を判別しにくくなってしまいます。目立たせたいときに赤文字を使いがちですが、赤文字はよほど緊急かつ重要な情報以外は使用を禁止するなど、ルールを明確にしておいた方が、いざというときに“本当に大切な情報”を伝えやすくなります。

アクセシビリティが下がる

アクセシビリティとは、Webサイトの閲覧者にとっての「情報の見つけやすさ」のことです。重要な情報の文字装飾が赤字・太字・下線などページによってバラバラにしてしまうと、情報の掲載者は目立たせているつもりでも、閲覧者から見るとそれぞれの役割が不明瞭になり、必要な情報が見つかりにくくなってしまいます。特に“文中の下線つき文字はリンクと誤認される可能性がある”ため、安易に使用しないように気をつけましょう。

また、最近では音声読み上げソフトの動作など、目の不自由な方に配慮してサイトを設計するケースも増えています。ユニバーサルデザイン(=どんな人でも利用しやすいデザイン)を意識し、できるだけ文字装飾のような“見た目に依存した手法を使わずに”情報を掲載する必要があります。

メンテナンス性(更新性)が下がる

例えばWebサイトをリニューアルしてサイト全体のデザインを変更することになった場合、個別の文字装飾を行わずに運用更新されているWebサイトは、デザインのベースとなるスタイルシートを置き換えるだけですべてのページのデザインが切り替わり、ほぼリニューアルを完了することができます。ところが、Webサイトの多くのページに個別の文字装飾を行っている場合は、デザインのベースとなるスタイルシートを置き換えても意図通りに表示が切り替わらない箇所が残ってしまい、過去に個別の文字装飾を行った箇所を確認しつつ修正しなければなりません。“スピーディーに運用更新を行える環境を整える”という観点からも、個別のデザイン変更はしない方が得策です。

まとめ

企業のWebサイトは、エンドユーザーに対して他社よりも“早く”情報を伝え、“正確な”効果測定を行い、A/Bテストや新しいマーケティング施策などを“迅速に”立案・実施し、効果を“継続”する必要があります。これら一連の機能を持続するためには、Webサイトのデザインや設計の裏にある“意図”を正しく理解し、その意図を崩さないように情報を掲載・更新する必要があります。

たとえ文字装飾のような小さな変更であっても、影響範囲を考慮し、“長期的な視点”で運用更新を行うことを心がけましょう。

この記事の執筆者

Y氏

オペレーション部 ディレクター

この記事に関するご相談やご質問など、お気軽にお問い合わせください。

お問い合わせ

タグ一覧