リンクと画像の設定

リンク

リンクはHTMLの特徴でもあるハイパーテキスト(複数の文書(テキスト)を相互に関連付け、結び付ける仕組みのこと。)を実現する仕組みである。

リンクはアンカータグ<a>で表す。
<a>にはhref属性(飛び先)を持つ。
href属性の値はURI(Uniform Resource Identifier)で表す。
HTMLでは「属性="値"」のように属性と値を=で結び、値は半角ダブルクォーテーションで括る。
リンクの表し方には絶対パスと相対パスがある。

住所で例えると、

「山田さんはどこに住んでいますか?」という問いに対して
「お向かいです。」と答えるか、
「京都市上京区○○町1-1です。」と答えるかの違いである。
「お向かいです。」という表現が相対パスであり、「京都市上京区○○町1-1です。」という表現が絶対パスである。

すなわち、相対パスは、特定の人から見ての場所であり、絶対パスは、誰から見ても同じ場所を表すことができる。

HTMLの場合は「http://〜」で表すものが絶対パス、

「index.html」や「image.gif」などのように表すものが相対パスである。

<a href="http://www.google.co.jp/">googleで検索</a>

<a href="index.html">ホームへ</a>

ターゲット

ターゲットとは、どのウィンドに表示するかを指定する属性

<a href="http://www.google.co.jp"  target="_blank">
とすることで、新しいウィンド(タブ)で開かれる。
メリットは、別のウィンドで開くため離脱を防げる。(元のページが開いたままになるため)
デメリットは、新規で開くと画面が煩雑になること。

画像表示のタグ

画像はイメージタグ<img>で表す。
<img>タグは画像の場所(URI)を表すsrc属性を持つ。
srcにも絶対パスと相対パスでの書き方がある。
(ただし、著作権の問題やリンク切れの可能性があるので、他人のサイトの画像を指定しないようにしよう。)

<img src="eagle.gif">

画像からのリンク

文字のリンクと同様に、画像をボタンとして使用したり、画像を表示させることができる。

  鷲の写真