一括相互リンクの実践


スポンサード リンク

一括相互リンクの実践:テキストとHTML

一括相互リンクは変化し続ける生き物です。変化があまりにも激しいので、何が正解か迷うことも多いのですが、根ざすべき考えはユーザービリティーであると一括相互リンクとはの章でもお話いたしました。

一括相互リンク実践のテキストとHTMLでは、この普遍的条件を満たす為の知識として、W3Cの勧告をベースとしたSEOサイトコーディングの基本を御紹介します。

あまり細かく説明するのはサイト趣旨から離れますし、ボリューム的にも困難(詳細には大変な量の解説が必要です。)なので、さわりだけ、わかりやすくをモットーに解説いたします。ココから先のお勉強に関しては、専門サイトや書籍を御紹介していますので、そちらを参考してください。

  • TITLEタグの書き方

    1. あくまでもHTMLコーディングを通してホームページ制作を行なった経験がある方を対象にお話を進めます。

      ホームページを作る際に、そのページが一体なんであるかをわかりやすく伝える表札となるのがタイトルタグです。

      どのようなサイトでもかまいませんので「画面の右クリック>ソースの表示」としてみてください。

      英語や数字で構成されたHTMLソースが見ることが出来ます。

      一括相互リンクソースコーディングの例:TITLEのソース画像

      この箇所は、ウェブ上ではウィンドウの以下の部分の表示に用いられます。下記の画像のハイライト部分をご覧ください。

      一括相互リンクソースコーディングの例:TITLEのブラウザ表示画像

      一括相互リンクにおいてタイトルは基本中の基本です。たとえばあなたがブティックの経営者で、ホームページを作った際に、自社のサイトを説明したいとします。そのときに、

      「有限会社パリ服飾 パリが奏でるの音色たち」

      これではいけません。雰囲気はありますが、この会社のホームページは「パリ服飾」を知っている人しか来ないと言うのが正直なところです。

      なぜならば、検索エンジンは検索フォームに入力した単語だけを結果一覧として表示するからです。

      このタイトルでは、どこにも「ブティック」や「ブランド衣料」「フランス」といったキーワードが無いからです。

      それに服をインターネットで売るのに、会社名は必要ありません。

      もしこのお店がブランド衣料を扱う直輸入のお店とすれば、

      「ブランド衣料通販|パリ服飾|フランス直輸入品多数展示!」

      検索結果で表示される文字数は、Googleが全角で21文字以内、Yahooが35文字以内といわれています。

      もちろん変化がないことも保証はできないので、一概にはいえないのですがこのくらい関連ワードを入れておくといいでしょう。

  • Hタグ

    1. <H1>のHとはHeadingの略で、見出しを意味します。

      1が最上位の見出し(大見出し)で、以下数字が小さくなるにつれて下位の見出し(小見出し)となり、6が最下位の見出しです。

      使い方に若干コツがいるのですが、これはソースレベルの階層構造化といって、体得するにはとても時間がかかります。

      書籍やウェブにも沢山情報がありますので、DIVを多用したDIVレイアウトやスタイルシートの勉強をされる際にでも意識してください。

      それではソースをご覧ください。

      一括相互リンクソースコーディングの例:hのソース画像

      HTMLソース上ではこれだけの表示なんですが、ウェブに表示されるときにはセンスが出てしまいます。

      スタイルシートとの、レベルの高いお付き合いが必要ですが、せっかく一括相互リンクを勉強するのであれば、スタイルシートも抑えておきたい領域です。

      まずはドリームウェバーなどのツールとお別れして、ソースをしっかり見つめましょう。

      一括相互リンクソースコーディングの例:hのソース画像

      Hタグはページ内の見出しを意味することは説明いたしましたが、見出しと言うのは書かれている内容の要約を意味します。

      たとえば時間が無いときに、新聞の見出しを見れば大体の内容は理解が出来ますよね?

      検索エンジンはサイトの内容を飛ばして理解したりはしませんが、要約には文中の趣旨がまとめられていると理解しているようです。

      つまり、タイトルと同じようにあまり感覚的な表現よりも、検索エンジン(ロボットクローラー)が理解しやすい、参照データーとして利用しやすい形式で情報をまとめるほうが理想的です。

      あなたがサイトを作れば必ず内容があります。つまりHタグは必ず使うタグとなりますから、是非スタイルシートや、書き方を意識してサイトづくりをしてください。

  • Aタグ

    1. Aタグは他のページにリンクを張る際に使うリンクタグです。

      インターネットの特性として、ページからページへ、情報から情報へと渡り歩くのですが、このAタグはまさにその代表選手です。

      ウェブクローラーは、このAタグがどのページからどのページへと向けられているかをしっかりと見ているのです。

      その際リンクがどのような言葉でリンクされているかを評価します。

      たとえば先ほどのブティックが、日本中のアパレルメーカーから「フランスブランド衣料のパリ服飾」とテキストでリンクされていたとします。

      もしこの状態が出来ていれば、間違いなくパリ服飾はブランド衣料の領域で、トップ表示されます。

      以下をご覧ください。

      ○・・・ブランド衣料のことならココ!

      ×・・・ブランド衣料専門店!

      一括相互リンクソースコーディングの例:hのソース画像

      ターゲットとするキーワードをテキストリンク内に入れると言うのも大切ですが、代替テキストとして、Aタグ内のタイトルに目が見えない方のために、リンク先が何のページであるかを説明書をいれるのも一括相互リンクには有効です。

      このことを意識して、何でもかんでもイメージタグにしてしまうのではなく、一括相互リンクを考えるのであれば上手にテキストリンクを導入しましょう。

  • imgタグ

    1. イメージタグと言います。画像を配置するときに使用しますが、このタグの利用の仕方も重要です。

      イメージは目が見える方を対象に使用されますが、インターネット利用者の中には目が見えない方もおられます。

      そのような人々のためにW3Cでは代替テキストとして、ALT属性を用意しています。

      ソースの書き方は以下を参考してください。

      一括相互リンクソースコーディングの例:imgのソース画像

      スペースの関係上、右側が切れてしまいましたが、title属性も書き方はALTと同じです。

      両者の違いですが、ALTは代替テキスト(目が見えない方などは音声ブラウザで読み上げる文章)として、TITLEはカーソルが乗ったときに見せる文章として使用されます。

      それでは次にこのように表記されたソースコーディングから、どのような表現が行なわれるかを見てみましょう。

      一括相互リンクソースコーディングの例:imgのソース画像

      ちょうど先ほどのソースが表現されたところに、カーソルを乗せた状態です。

      TITLE属性で指定されたテキスト文章が表現されています。機能的にも便利ですし、ユーザーに対してはタイトル画像で抑えきれなかった情報を伝えることも可能です。

      ALT属性との愛称も検討しつつ、こういった細かい点をもれなく対応することが、一括相互リンクにとっては非常に重要です。