リンクを作成する方法

共著者 Jack Lloyd

ハイパーリンク（日常では単に「リンク」と呼ばれるものです）はインターネット全般、特に個々のウェブサイトにおいて極めて重要な位置を占める要素です。リンクはテキストの一部や画像をクリックすることでユーザーが別なウェブページへ進むことを可能にするものなので、ウェブの閲覧に必要不可欠な要素とも言えるでしょう。自分のウェブサイトの一部にハイパーリンクを作成するためにはHTMLコードの短い断片だけで用は足ります。このコードを使うとリンクを手早く作成できます。

方法 1 の 2:

基本的なリンクの作成

1
リンクに使用したいテキスト文書か画像を作成 　リンクはウェブサイトのコードを編集するときに簡単なHTMLタグを使って作られます。そうは言ってもまずは、タグ内に設置されるべきコンテンツを作成する必要があります。ここではテキスト文書の例で進めていきますが、コンテンツはテキストでも画像でも別な HTML要素でも構いません。
2
作成したコンテンツをタグで囲む 　ハイパーリンクは対応するカッコで閉じられた簡単なタグを用いて示されます。これらのタグは何の属性もなしに使っても機能しませんが、属性の加え方はすぐに紹介していきます。
- 例を示すと、作成されたリンクは目下のところこのように見えるでしょう: 新しいページに行くには、ここをクリックしてください。
3
ハイパーリンクの行き先を示す「href」属性を追加　「href」属性はリンクがクリックされたらユーザーをどこへ誘導するのかをブラウザに伝えます。これには等号（＝）の記号が後続し、その後ろに当該の到着先URLがつづきます。
- 引き続き上の例で見ると、リンクは今このように見えるでしょう: 新しいページに行くには、ここをクリックしてください。
- リンクの行き先が外部サイトの場合には、URLを省略せずフルに記述することが必要ですのでご注意ください（通常は"http"から始まります）。ページ名が指定されてさえいれば、現在のページのディレクトリは親ディレクトリになります。
広告

方法 2 の 2:

修飾子の追加

1
画像リンクの作成　これは画像タグをリンクタグ内に加えるだけで完了ですが、（サーバー内での保存場所など）画像元のアドレスが必要になるでしょう。画像リンクがどのように見えるかの参考例です:
- <a href="the_intended_link_url.html"><img src="the_picture_in_question.jpg" /></a>
2
「mailto」を使って電子メールリンクを作成　特定のアドレスに宛てたメールソフトを起動させるリンクを作成するには、「mailto」修飾子を宛先であるメールアドレスの直前に配置します。
- 例を示すと、電子メールリンクはこのように見えるでしょう: ここをクリックしてご質問・ご心配な点などご相談ください。
3
後の参照用に大きなウェブページ内にアンカーを作成する 　ウェブページ内の特定の箇所へリンクを張りたいのであれば、アンカーを使う必要があります。アンカーは目次のついた大きなページではとても便利です。テキストの各セクション（節）を単位に目次とリンクするアンカーを設置できます。アンカーは"名前"を付ける属性を使って作成します。
- アンカーを作成するには、次のタグをページ内の適切な位置に挿入します: 第3章： HTMLでアンカーを使う
- 作成したアンカーにリンクさせるには、 #記号を次のように使います: 第3章へジャンプ
広告

ポイント

ウェブサイトを作成するのに特別なソフトウェアは必要ありません。ほとんどのコンピューターにはhtmlファイルを作成可能なテキスト編集ソフトが入っています。マイクロソフトの「メモ帳」プログラムなどはその一例です。単純にコードを入力してhtml形式で保存することができます。しかしながら、もっと進んだプログラムのように、すぐにプレヴューを見ることや、コードを再確認してすべてが適切な規則に従って作動するかどうかを確かめることはできないでしょう。
CSSスタイルなどの手段を用いてリンクの見栄えを変更することもできます。