コンテンツの更新は「見た目」ではなく「構造」で考える

投稿日: | 投稿者:ayatori
コンテンツの配置や文章を考える際、おさえておきたいポイントを教えてください

ウェブ担当の部署に配属されて3ヶ月が経ち、上司からサイトコンテンツの更新作業を任されております。コンテンツの配置や文章を考える際に押えておくべきポイントを教えてください。


コンテンツを「見た目」で考えると...

JQ126_72Aコンテンツを「見た目」で考える人は、たとえば以下のように、コンテンツを作ろうとします。

  • ここは「小見出し」だから、文字を太く (ボールドに) しよう。
  • この「中見出し」、もうちょっと目立たないから、頭に「■」を書こう。
  • 文中のこの語句は目立たせたいから赤く (目立つ色に) しよう。
  • この部分 (セクション) は重要で、埋もれさせたくないから、前後に改行をたくさん入れよう。
  • このリストは箇条書きっぽくまとめよう。各項目の頭を「・」ではなく「●」にするほうが、見やすいかな。

eメールやワープロで文書 (ドキュメント) を作っていると、ついつい、このように考えてしまいがちなので、しかたないことではあるのですが、ウェブサイトのコンテンツを更新する際には、「見た目」のことはいったん考えないようにして、「構造」で考えることをおすすめしたいと思います。

コンテンツを「構造」で考える、とは?

コンテンツを「構造」で考える、とは、たとえば、以下のようなことを言います。

  • これは「中見出し」である (見出しレベルは「2」、つまり <h2> である)。これ以外にも、同ページ内には「xx」と「xx」という中見出しがある (同じレベルの見出しとして、つまり <h2> として存在する)。
  • 見出しレベル「2」の下に、これこれこういう「小見出し」(見出しレベル「3」つまり <h3>) が存在する。
  • 文中のこの語句は「強調したい箇所」である。
  • この部分 (セクション) はひとつの「段落」という塊である。
  • この部分 (セクション) は他のコンテンツからの「引用」である。
  • この部分 (セクション) は「箇条書き」である。含まれる項目はこれとこれとこれである。

いかがでしょうか。コンテンツの中味を分解して検討するにあたって、「外見」ではなく、「意味」や「はたらき」で捉えているということに、お気づきでしょうか?

このように捉えることによって、「見た目」に左右されないコンテンツ作りが可能になります。少し専門的な話になりますが、上記で挙げた各構造 (見出し、強調箇所、段落、引用、箇条書き、など) は、いずれも「HTML」というフォーマットで情報構造を記述する (マークアップする) ことが可能です。つまり、各構造を、ブラウザをはじめとするウェブ技術によって適切に理解/解釈できるように、作ることができます (そして、「HTML」とは別に「スタイルシート」と呼ばれるファイルがあるので、それを用いて「見た目」を規定します)。

同じコンテンツをパソコンで閲覧する場合とスマートフォンで閲覧する場合とでは、異なる「見た目」になっている (それによって、小さなスマートフォン画面でも読みやすく/利用しやすくなっている)...というウェブサイトをご覧になったことは、あると思います。つまり、「構造」と「見た目」は完全に不可分というわけではなく、ユーザーの環境に応じて「見た目」を柔軟に変更することが、ウェブでは可能なのです。

今後、ウェブを利用する端末がますます多様化することを考えると (大小さまざまなパソコン、スマートフォン、タブレット、などなど...)、このように、ユーザーが閲覧するデバイスに応じて「見た目」を (自動的に) 切り替えることは、あたり前になると思います。そして、閲覧デバイスの選択権は100%ユーザーの側にあり、サイトを作る側/運営する側が制限をかけることはできません。多種多様な閲覧デバイスに対応できるように、コンテンツは「構造」で考えるクセを習慣化することが、大事だと思います。

無料オンライン相談受付中!ウェブ戦略の専門家が
ご相談を承ります!

ウェブマーケティング担当者必見!

ウェブ戦略お役立ち資料

お役立ち資料のダウンロードや
セミナーのアーカイブ視聴が無料でできます。
ページの先頭へ