いまさら人にきけないSEO・検索エンジン対策「いまセオ」第3回「内部環境による要因」HTMLとは

こんにちは！

チームNext!ディレクターのHIDECCI（ヒデッチ）です。

今回は、いまさら人にきけないSEO「いまセオ」第3回目「内部環境による要因」についてお話します。

前回のおさらいですが、SEOには「外部環境による要因」と「内部環境による要因」があり端的に言ってしまうと、外部要因は「外部サイトからのリンク数」に依存する、とご説明いたしました。

外部に対して、今回は「内部」です。

「内部環境による要因」について

内部？
内部とは・・・？
内部とはいったい何の内部のことなのでしょうか。

実は、ホームページの「内部」には、「表」と「裏」があります。

「表」というのは皆さんが普段見ているホームページの内容（文章や画像、デザインなど）です。「裏」というのはその表を構成しているHTMLとよばれる言語に記載されている内容をさしています。

内部のお話をより理解していただけるように「裏」つまり「HTML」のお話をいたします。

ホームページの裏側「HTML」について

このホームページの裏側はこのようになっています。

文字だらけですね。これはホームページを構成する、HTML（エイチティーエムエル）と呼ばれる言語で記述された文章です。

HTMLとは

HTMLは、HyperText Markup Language（ハイパーテキストマークアップランゲージ）の頭文字4文字でHTMLです。

誤解を恐れずに直訳すると「今までのテキストよりも凄い、しるしをつける言語だよ」という意味になります。更に「今までのテキストよりも凄い」「しるしをつける言語だよ」という2つの文節に分かれます。

「今までのテキストよりも凄い」

今までのテキストよりもどう凄いのかといいますと、これは「ハイパーリンク」がつけられるテキストだから、ということになります。

ハイパーリンクとは、ホームページ上で、青い下線付きの文字をクリックすると別のページに飛びますよね、あれです、いわゆる「リンク」のことです。つまり、リンクができるテキスト形式文書のことを「ハイパーテキスト」と呼びます。

このハイパーリンクの概念が発明されたおかげで、現在のインターネット上での情報伝達・共有・参照が可能になっているわけですからとても素晴らしい発明ですね。

「しるしをつける言語だよ」

ホームページは、このHTMLを使用して書かれた文書で、あるルールに則って作成されています。それは「タグ」と呼ばれる命令書式を用いて「タグ囲んだ文字に命令をする」というルールです。

タグとは、< p >　や　< a >　のように、　単語をや略語を　<　　>　括った形式の命令文のことを指し、このタグで任意の文字を囲んで使用します。
例えば、ピータグと呼ばれる段落をつくるタグの場合には以下のように記述します。

この文章は、ピータグと呼ばれるHTMLタグで囲まれています。段落を作ります。

この文章は、ピータグと呼ばれるHTMLタグで囲まれています。段落を作ります。

この文章は、ピータグと呼ばれるHTMLタグで囲まれています。段落を作ります。

上記の3行は、実際には以下のように＜p＞　と　＜/p＞ で囲まれています。

<p>この文章は、ピータグと呼ばれるHTMLタグで囲まれています。段落を作ります。</p>
<p>この文章は、ピータグと呼ばれるHTMLタグで囲まれています。段落を作ります。</p>
<p>この文章は、ピータグと呼ばれるHTMLタグで囲まれています。段落を作ります。</p>

ピータグを使用すると行間が空きます。
段落や文節のまとまりを表現するときに使用します。

<　　>　のタグの中に入っている文字にも意味があります。
ピータグは、「paragraph、パラグラフ」つまり「文章の段落や節」という単語の先頭の「p 」文字をとって、ピータグと呼ばれ、文節を区切るときに使用されます。

HTMLタグには「開始タグ <　>」と「終了タグ <　/　>」というものがあり、終了タグは、開始タグと同じ文言が入りますが「/」が入ることで「終了だよ、〆だよ」と宣言しているわけです。

マークアップランゲージの「Markup」という言葉は「～にしるしをつける」という意味の他動詞ですので、タグで文字を囲むことを「マークアップ」と呼んでいるのです。

このように、ホームページの裏側では、HTMLが記述された文書が隠されています。HTMLで作成した文書を、ブラウザと呼ばれる閲覧ツール（Google chrome （グーグル クローム）など）を介することにより、様々な文章、画像、デザインやレイアウトで表現されるわけです。

ホームページの表側「デザイン・コンテンツ」について

今度は「表」の話をさせていただきます。

表とは、皆さんが普段から慣れ親しんだ、コンテンツ（内容：文章、画像、動画など）、デザイン、レイアウトなどのWEBデザインに関する部分となります。

さまざまなデザインのホームページが存在していますが、なんと世界中で12.7億サイトもあるそうです。これにブログなどは含まれていないそうなので、更にもの凄い量のコンテンツがインターネットの中にはあるということになりますね。ちなみに、日本語のみですと12.7億中、5.6％が日本語で構成されたサイトだそうですので、7100万サイト存在するということになるようです。

参照元： インプロ部さま　世界中のウェブサイトの数と日本の割合-91年～現在に至るまで

自社の事業やサービスを知ってもらうための重要なツールがホームページですが、7100万サイトの中から、見つけてもらうための施策はどうすればよいのでしょうか。また競合他社と比べて自社のホームページの差別化をどのように図ればよいのでしょうか。

安易に画一的なテンプレートを使用したホームページでは御社の魅力が伝わらず、訪れた途端に直帰されてしまうでしょう。また、反対にオーナーの自己満足優先のデザインにした場合、来訪した方に伝えるべきものが伝わらない、またはとても使いにくいサイトとなってしまっても本末転倒です。

その企業にあった最適な訴求をしていくことで、マーケティングやブランディングが最大化するのです。

ホームページのデザイン（WEBデザイン）について

ホームページのデザイン（WEBデザイン）とは、御社の魅力を最大限に伝えるためのデザイン・配色、コンテンツや要素の配置・レイアウト構成など考え抜かれたものでなければなりません。

また、WEBデザインの範疇には「ナビゲーションメニュー」など、来訪した方に対しこのホームページの使い方を「サイン」として伝える役割があるものもあります。

トップページへ訪れた来訪者は、きちんと御社のサービス紹介のページにたどり着き、サービス内容を読んで、興味・関心を持ち、お問い合わせしてくれるような導線作りもWEBデザインの範疇となります。

使い勝手が考慮されていない場合、サービスの紹介ページまで来てくれず、離脱され機会損失をしまうこともあるかもしれません。
ホームページは、常に改善し、ブラッシュアップしていく必要があります。（こちらはまたGoogleアナリティクスなどのアクセス解析の章でご説明いたします）

コンテンツの質と量は？

そして「表」の最大の特徴が、掲載されている「コンテンツ」となります。コンテンツとは、掲載されている中身です。文章、画像、動画などなど。御社の「サービス紹介」のページは、御社サービスの魅力を過不足なく伝えることができる構成になっているでしょうか。

読みやすさはどうでしょう？文字数は？話の流れや構成はどうでしょうか？読んだ人が納得できる論理的な構成になっているでしょうか。

あなたが伝えたいキーワードの出現頻度は文中どのくらいの割合をしめているでしょうか。更に現在のキーワードよりも最大公約数を獲得するキーワードがあるかもしれませんが、調査済みでしょうか。

このあたりも戦略的に構成することで、目標達成（お問い合わせ、購買、来店）の確度が上がると言われています。（このあたりはコンテンツマーケティングの章にてお話いたします）

コンテンツの量と質も重要な要素と言えますね。

　SEOとHTMLの関係

SEOとHTMLの関係についてお話いたします。

HTMLは誰が読むものなのかというと「Google chrome （グーグル クローム）」「Microsoft Edge（マイクロソフト エッジ）」「Mozilla Firefox（モジラ ファイヤーフォックス）」などのブラウザが読み、HTML上で表現したものをブラウザを介して人間が読みます。ブラウザを介することにより、普段見ているホームページの形に形成されるわけです。

HTMLはブラウザの他に「クローラー」と呼ばれるロボットが読みます。

Google製の「クローラー」と呼ばれるロボットがインターネットの海を泳ぎ、そこで見つけたホームページの情報を持ち帰り、データベースに蓄積します。その蓄積した情報を「検索キーワード」に応じてリスト化して表示する仕組みが検索エンジンの基本的な仕組みです。

少し前までは、クローラーは「裏側」しか読むことができないと言われていました。よって「表」にjpgなどの画像イメージがあっても認識ができないと言われており、クローラーが読むのは「裏」のHTMLに記載されている文書である、とされています。（今は多少違うようなのですが詳細はGoogleさんのみぞ知るところです）

よって「表」は人が見るもの、「裏」はクローラーが読むものとされ、クローラーに読んでもらうためにどうすればよいのか、一番最適なHTML文書の書き方はどれだ、というようなことがWEB制作者やSEO業者の中で日々喧々諤々話されています。

SEOに関係するHTMLタグについて

HTMLタグは、100種類近くありますので全てを語りつくせるものではありませんが、SEOに関係するタグについて、以下にざっくり記載させていただきますね。

【重要】

• titleタグ（タイトルタグ/検索結果用のリンクとなるSEO上重要なタグ）
• meta descriptionタグ（メタディスクリプションタグ/検索結果用の説明テキストタグ、文中に検索キーワードがあると太字で表示されます）
• hタグ（ヘディングタグ/見出しタグと呼ばれ、そのページの見出しのレベルを決めていくタグです。使用順序のルールがあります、h1タグも重要なタグです）
• altタグ（オルトタグ/画像の説明タグで、クローラーに画像の内容を伝えます）
• canonicalタグ（カノニカルタグ/ページ自身が自分が何者なのか（サブドメインのwwwあり、なしなど）を宣言するためのタグです）
• ul/ol/liタグ（リストタグ/このタグの利用で、要素と要素がリスト化され整理されるため、検索エンジンに認識・理解されやすくなります）

【昔は重要であったが、今はあまり重要ではない】

• meta keywordタグ（メタキーワードタグ/ページを象徴するキーワードを入れるといわれていますが、今は重要視されていないようです）

ちなみに、HTMLは、プログラミング言語というよりも、その名の通り「マークアップ」する言語だそうです。
プログラミング言語は、計算をしますが、マークアップ言語は計算しません、というのが切り分けのポイントだそうです。

いかがでしたでしょうか。

ホームページには表と裏があり、表は人間、裏はロボットと、それぞれ見る対象が異なるんですね。面白いですね～。

裏側については、このHTMLの記述の方法が、ロボットにとって読みやすく理路整然としていることが重要なんです。記述の方法を誤ってしまうと、検索順位にも影響する場合があり、そもそもGoogleさんが検索結果に掲載してくれない、なんてこともあるので注意が必要です。

また表側については、対人間となるのでデザインの美しさだけではなく（当然美しいほうがよいのですが）インターフェースデザインの使いやすさや、掲載されているコンテンツのわかりやすさなどが重要になってきます。

HTMLすべてを覚える必要はありませんが、ホームページを運営される方は、SEOで重要な基本的な「HTMLタグ」は知っておいて損はありません。この詳細については次回以降でもっとしっかり詳しく行ってまいりますのでお楽しみに。

本日はこれまで。それではまた！

検索順位をボタン一発で調査、記録。検索順位チェックツールGRC