a要素
カテゴリ | タグ | 機能 | 使用属性 | 要素分類 |
---|---|---|---|---|
リンク | <a></a> | リンクの作成、指定先への移動 | href | インライン |
使用例 |
---|
<a href="○"> </a> |
説明
ハイパーリンクといいこれを設定した部分をクリックすると他のページや外部のサイトへ移動する仕組みです。ホームページを作るにあたって最重要な要素になります。
1.リンク設定:サイト内他ページ、他のサイトへのリンク
絶対パスで記述してもいい。例を示すと、絶対パスというのは「https://youtukuru.com/contact」URL全てを記述することです。
相対パスというのは現在のページから別のページへのパス「/contact」や「../contact」などとなります。/は現在のページと同階層を表します。../は現在のページより上の階層を表します。
詳しくはパスの書き方をご確認ください。
はじめてのホームページ作成方法(パスの書き方)
2.ページ内の指定個所へのリンク。
※abcには任意の名前を指定します。『ページの先頭に戻る』をクリックすると<h1>まで戻る指定をします。
<h1>に戻る場所を指定します。これをアンカーといいます。日本語で錨のこと表します。※上の例は<h1>に指定した場合ですが、ページの一番上に戻るなら、<header>や<div id="wrapper">などに指定するといいでしょう。
アンカーを設定した場所に戻る仕組みになります。書き方は下記を参照ください。
一番上
一番上
3.他ページの指定個所へのリンク
リンク先のパスを記述し、その後ろに#任意の名前を記述する。リンク先の指定個所に<id="任意の名前">を記述することで、
他ページの指定個所へのリンクを作ることができる。
絶対パスでも相対パスでも可能です。
aタグまとめ
ページ内のリンクを使うケースとして、上記で説明したページの一番上に戻るボタンの他に、目次を作って各項目に移動するなどの使い方があります。
目次は記事が長い場合、スクロールせずに指定の項目まで飛べるのでユーザーさんにとっても良い対策になります。