テキスト素材「作成と改善ポイント」
Webページの大切な要素である「テキスト素材」。作成の手順と改善の着眼点の解説。

世の中にはド派手なデザインのWebサイトもありますが、Webサイトが情報の伝達手段である以上、"テキスト"という存在が基本的な構成要素であることは間違いありません。

そして、紙媒体以上にテキスト素材の扱い方は重要です。なぜならば、PCやスマートフォンでの閲覧を強いるWebは眼が疲れやすく、読みにくいからです。また、読書と異なり、容易に他のモノ(外部のWebサイトやWebページ)に遷移できてしまうことも特徴のひとつです。

同時に、テキストのターゲットが人間だけでなくWebブラウザや検索エンジンのクローラーなどの機械も含まれていることを認識する必要もあります。

テキスト素材の作成の流れ

テキスト素材の作成は下記の流れを取ります。

  1. 執筆
  2. 編集
  3. 校正

執筆

Webコンテンツの執筆時に気をつける点は、SEOの観点を意識することです。

テーマとなるキーワードを使うことはもちろんHTMLの文書構造を考慮したライティングが求められます。最低限、h1やh2などの「見出しタグ」を考慮した上で執筆しましょう。

編集

テキストエディタに書いたテキスト素材を適切にマークアップしスタイル設定を行っていきます。その際に、字数の過不足や構成を調整していきます。

校正

編集を終えたテキストに対して、校正を行っていきます。

まずは基本的な作業。つまり、誤字脱字のチェックと表記が適切かどうかの確認です。

また、英語サイトなど外国語コンテンツの場合は、ネイティブによるチェックを要することもあるでしょう。

テキスト素材における改善のポイント

冒頭にも書きましたが、Webコンテンツを読むことはユーザーにとって非常に疲れる行為でもあります。したがって、読みやすくすることはやはり大切です。

コンテンツを公開後でも、気づいたらすぐに改善をしていきましょう。

見出しをつける

見出しタグを適切に使うことはSEOだけでなく、ユーザーにとっても非常に役立ちます。

大見出し以外にも、中見出し・小見出しを間に挟んでいくことで、より読みやすく理解しやすいコンテンツに仕上がるでしょう。

CSSを用い、文字の大きさや罫線に違いをつけ、見出しのレベルをひと目でわかるようにデザインします。

行間などの調整

行間は詰まり過ぎても、広げ過ぎても読みにくくなります。行間はCSSのline-heightプロパティで調整します。一般的な値としては「1.5」前後が適切でしょう。

また、横幅を広く取ったレイアウトだと視線の動きが大きくなるため、段組みなどにした方がいいでしょう。

フォントのサイズ

フォントサイズも読みやすさにつながる大切な要素です。

フォントサイズがあまりにも小さいWebページだとユーザーによっては非常にストレスを感じさせることになるでしょう。適切なフォントサイズを指定しておくか、ユーザー側で任意のサイズに変更できるようにしておきましょう。

背景とのコントラスト

例えば、背景が白で、文字も白。

これでは読めませんよね。

この例は極端でしたが、灰色などを背景に敷く場合は、コントラストがしっかりと保たれているか確認しましょう。