html: リンクの張り方とオプション

informatics/html/html_basic_link
9-6-2017 updated

  1. 概要: リンクの張り方 (a tag)
    • 相対リンクと絶対リンク
  2. 追加できる属性
  3. SEO 対策における rel="nofollow" の効果

広告

リンクの張り方 - a tag -

リンクを張るときは <a href="ファイルのパスまたはURL">リンクを張りたい文字列</a > とする。閉じタグをみればわかるように,この a がタグである。anchor の略で,他のページへのリンクだけでなく,指定したメールアドレスに対するメールソフトの起動なども行うことができる。


相対リンクと絶対リンク

href の情報をファイルのパスで指定する方法を 相対リンク という。たとえば,このページから informatics の目次のページにリンクを張る場合には,次のように考える。

  1. このページのパスは informatics/html/html_basic_link.html である。つまり informatics というフォルダがあり,その中にさらに html というフォルダがある。html の中の html_basic_link.html というファイルがこのページである。
  2. ここから,informatics の目次のページにリンクを張りたい。そのページのパスは informatics/informatics_meta/index_informatics.html である。
  3. この場合,href="../informatics_meta/index_informatics.html" とする。../ は一つ上の階層という意味である。

一方,href の中に URL を指定する方法を 絶対リンク という。href = "http://ultrabem2.web.fc2.com/informatics/informatics_meta/index_informatics.html" となる。


両者のメリットとデメリットをまとめてみよう。

  1. サーバーを移転した場合は普通 URL が変わるので,絶対リンクだと張り直さなければならない。これはかなり手間。相対リンクなら必要なし。ただし,TextSSTextWrangler のような複数ファイルのテキストを一括置換できるソフトもあるので,これらを使えば問題ない。
  2. コンピューター内で (local で) ファイルの場所を移動すると,相対リンクだとリンク切れになってしまう。
  3. 相対リンクの方が記述が短くてすむ。わずかであるが,データ転送量 を考えると有利である。

基本的にはどちらでも OK だが,上記の 1 を重視して,相対リンクを進めているサイトが多いようである。


追加できる属性

属性 説明
href

href="ファイルのパスまたは URL"。相対パス,絶対パスのどちらも指定することができる。

title

title="補足情報", マウスをリンク上に合わせたときに表示される情報を含めることができる。リンク先のサイト名などを表示させたいときに用いる。

target

target="_blank" のようにして,リンクを新しいウィンドウで開くかどうかなどを指定できる (3)。

  • _blank: 新規ウィンドウでリンクを開く
  • _self: 現在のウィンドウでリンクを開く
  • _parent: 親フレームでリンクを開く
  • _top: フレーム分割を解除してメインウィンドウでリンクを開く
rel

rel="nofollow" で Google などのクローラーがリンクを辿らないようにする。


SEO 対策における rel="nofollow" の効果

他のページから被リンクがあるかどうかは,依然として SEO の重要な項目の一つである (2)。これは,リンク元のページからリンク先のページへと ある種のパワーを送っている という形で評価されているため,自分のページのパワーを渡したくない場合には rel="nofollow" を使うことになる。

外部リンクの場合

価値のないサイトへの発リンク,とくにスパムの可能性があるサイトへのリンク (2)。

内部リンクの場合

同様に,作りかけのページなど,価値のないページへの内部リンクでも,rel="nofollow" を使うべきである (2)。


広告

コメント欄

一言コメントをどうぞ! (基本500字まで - 100字のページもあるかも)


このコメント欄は各ページにあるので、いつ管理人がコメントを見ることになるのか分かりません。内容について質問がある場合は、下のリンク先のフォームから質問頂ければ、早めに返信するようにします。


References

  1. とほほの WWW 入門. リンクする. Link.
  2. 東大法学部卒自由商人「速水鏡」のインターネット副業講座. rel=”nofollow”のSEO効果~外部リンク・内部リンクでの使い方. Link.
  3. TAG index. Link.
  4. 相対 URL と絶対 URL はどちらが SEO に強いのか? Link.