1、文字

a0001_0168451、文字

ウェブ制作における文字の表現や使用方法はキャッチコピーと本文で大きく異なる本文は内容が理解しやすく読みやすいレイアウトが要求されるが、キャッチコピーには人の目を惹きつける魅力が必要となる。色や形がデザインされた文字をキャッチコピーに利用する場合には文字を画像化する必要がある。

  • コピーライティング

コピーライティングにおいてはコンセプトメイキングと同様に、何のために、誰が、誰に、何を、どのように、について明確にしておくことが重要となる。また、ウェブサイト内における用語の統一もユーザーの混乱を避けるために必要となる。

コピーライティングはキャッチコピーの制作とボディコピーの制作に大きく分かれる。キャッチコピーは少ない文字数でユーザーの心をとらえることが必要であり、ボディコピーでは提供する情報内容を的確かつわかりやすく表現することが何よりも大切となる。ただしユーザーがディコピーを最後まで読み通すことのできる適度な文字数も考慮する必要がある。

  • テキストデータとしての文字の使用

テキストデータとして表現された文字はウェブブラウザでの画面表示も素早く、またユーザーにとって慣れ親しんだ文字であるため、読みやすい。ユーザーはウェブブラウザを通してウェブページ以内のテキストデータを容易に検索することもできるし、コピーやペーストも可能である。このような理由でウェブページの本文にはテキストデータとしての文字を使うのが基本とされている。

加えてナビゲーションのためのリンクにグラフィックスを多用することはウェブページが煩雑に見えてしまう原因となるので、原則としてテキストデータとして文字を使う方が良い。

  • 画像データとしての文字の使用

特殊なフォントを使いたい場合や、デザイン性に優れた文字表現を行いたい場合には、文字をあらかじめ画像として制作しておく必要がある。多くのウェブページの中では、テキストデータとしてHTMLファイルの中に記述された文字とあらかじめ画像として用意された文字が混在している。

ただし、文字を画像として使用すると、フォントの選択にも制限がなく、デザイン的な自由度が高くなる反面、テキストデータとしての活用はできなくなってしまう。また、グラフィックスの多用はウェブブラウザにおける表示が遅くなってしまう原因となる。どちらを使うかについてはデザイン的な見栄えと蔵鋒としてどちらが有効に利用できるかという点の両方を考慮した上で決定する必要がある。

  • ウェブサイトでの文字組み

紙メディアと同様に、ウェブページにおいても文字組みは重要な表現である。ウェブページではHTMLとスタイルシートによって文字サイズ、行間、行長、段落、行揃え、文字色と背景色などを決める。HTMLと、スタイルシートでは実現できない書体や時間調整などの設定は画像としての文字で表現する。

①禁則処理

ウェブページにおいての禁則処理は、ウェブブラウザによって異なるので、製作者が正確な制御を行うことは難しい。しかし文字を画像として用意するああ位には、禁則処理を考慮する。

②行間欧文は文字の上下にスペースがあるため、行間を指定しない標準設定のままでも適度に読みやすい。しかし。和文は標準設定のままでは行間が狭くなってしまう。HTMLでは行間の設定はできないが、スタイルシートにより行間を指定できる。

③行長

文章を表示する時の一業の長さを行長、あるいはストロークと呼ぶ。行長が長すぎても短すぎても読みづらくなってしまう。特に禁則処理が行われていると、行長が短い場合には不自然に文字数が少なくなってしまうことがある。20~30文字の行長を標準と考える。ウェブページで行長を調整するには、CSSやテーブルのせるは場で設定する。

④段落

雑誌や書籍では、段落は1文字下げで表現されることが多いが、ウェブページの場合は1時下げだけでは十分ではない。1行あきで段落を示すくらいが適切である。文章自体もあまり長い段落を作らずに5行程度で段落を構成すると読みやすくなる。

⑤文字色と背景色

文字の読みやすさを左右するのは、文字色と背景色のコントラストである。白地に黒文字は最もコントラストが高い状態であり、文字はくっきり見える。しかし、もちの読みやすさという点では、薄い色の背景色の上に黒文字を使って若干コントラストを低くした方が目に優しい。ただし、文字色と背景色のコントラストが低すぎると、文字がよ見づらくなってしまうこともある。また、黄色の背景色の中に白文字を使うと、コントラストの高い白抜き文字を表現できる。

⑥プロポーショナルフォントと等幅フォント

フォントにはプロポーショナルフォントと等幅フォントがある。一般的な文章にはプロポーショナルフォントが使用され、数値情報やスクリプト、プログラムなどをウェブページに掲載する時などには等幅フォントが使用される。これは桁数が認識しやすいという利点のためである。

⑦字間調整・カーニング

プロポーショナルフォントを使ったとしても、和文書体では間延びして見えてしまう傾向がある。HTMLで表現する場合には、カーニングは困難だが、画像化された大きな文字を使う場合には、カーニングを行うのが望ましい。

<おすすめサイト>
SEO会社の東京SEOメーカー
ホームページ作成なら東京WEBメーカー