記事の詳細

「キーワードとかそういうののSEO対策ってもうほとんどありきたりになってきたよね」

「そもそういうのってどこまで通用するんですの?」

「ウェブサイトってコンテンツの良さで決まるから……いや、でもそれ前提としても、それ以外のところでやっぱりなんかあるんじゃないの?」

「Blackboooooox!!!」

という会話が頻繁に飛び交う昼休み、とりあえず「よいコンテンツ」というのはどういったコンテンツなのか?というのを考えたときに、ウェブデザイナー、あるいはコーダーができることというのはごくごく限られております。
いわゆるコーダーとかフロントエンジニア的な存在の役割というのは、本で例えると装丁のところにあり、文字組や表紙の作成、中表紙や見出しの作成などなど、実はエディトリアルに近しい部分があるなー、とグラフィックあがりのデザイナーは感じているのです。
コーディングは看板づくりのようなもの。ユーザーが見やすいようにきちんとマークアップしていくことが大切なのです。

ま、とりあえず作ってみましょ、ということで作ってみました。

 

クラスタグ一覧シート

編集可能なaiデータ(IllustratorCC)、pdfデータが入っています。再配布は禁止であとはご自由にどうぞー。

セクショニングをきちんと明確にすると、ユーザーエクスペリエンスはあがる?

セクショニングというのは文章構造を明確にする」考え方のことで、文書的に正しいアウトラインを得ることができるとされています。

早い話が「読みやすくしようや」ってことです。これは「見る人」もそうですが、サイトをたまにクロールしていく「コンピュータ」に対してもそうなのです。この考え方をセマンティックWebと言います。

セクショニングを正しくすることは、検索エンジンにクロールされるときに正しく評価されやすい、ということ。近年SEOは、小手先の技術で背伸びするようなものから、コンテンツの内容が利用者の目的に本当に合っていることを伝える方向へとシフトしていっています。
簡単に言うと、表紙にドでかく「これは役に立つ本」と書いていても、中身に目次も段落もいない役に立たない本なのに売れる、という時代から、「あなたのための本」としっとりとした明朝体で書かれていた上、きちんと目次があって、中表紙があって、カーニングトラッキングされて文字組も美しい書籍がニーズ、という時代へ変化していっているわけですね。

WEBサイトにおける文章構造の美しさは、そのまま人の眼にも美しいってことなんですね。

セクショニングができているかどうかの確認ができるウェブサイト

https://gsnedders.html5.org/outliner/ | HTML 5 Outliner

https://chrome.google.com/webstore/detail/html5-outliner/afoibpobokebhgfnknfndkgemglggomo | Googlechrome拡張機能

クラスタグの基本的な付け方

セクショニングと同等にクラスタグもきちんと整理されているサイトは、コンテンツの修正や改善が容易になるので優秀と言えるでしょう。SEO的にはあんまり……? かもしれませんが、何がどこに書いてあるのかを一目瞭然にしておくことにこしたことはないのです。

クラスタグのルールはWEB制作会社ごとにルールがあるのが基本のようです。それでもなんとなく、その専門の人が見れば「ああなるほどね」となるようなクラス付けを心がけていきたいものですね。

この記事であなたの課題を解決することができましたか?

疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。

The following two tabs change content below.
久保田 里美

久保田 里美

価値あるコンテンツ制作部インクループ株式会社
デザイナー。コンセプト設立からデザインを理論立てて起こすことをポリシーに、WEB媒体から紙媒体まで幅広く手掛けていきたいデザイナー。日々勉強日々精進。

ほかの投稿も読んでみませんか?

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

仕事ではパソコンが使いこなせるのが当たり前

相模原市産業会館パソコン教室

AD

ページ上部へ戻る