<a> - リンクする
目次
概要
- 形式
<a href="...">～</a>- サポート
- https://caniuse.com/mdn-html_elements_a
- カテゴリ
- フローコンテンツ
フレージングコンテンツ
インタラクティブコンテンツ(href 属性を持つもの)
パルパブルコンテンツ
- 親要素
- フレージングコンテンツ を子要素に持てるもの
- 子要素
- トランスペアレント (ただし、インタラクティブコンテンツ や a 要素を子孫に持つことはできない)
- タグの省略
- 開始タグ:必須 / 終了タグ:必須
- 属性
- グローバル属性
- href
- target
- download
- ping
- rel
- hreflang
- type
- referrerpolicy
説明
a は Anchor(アンカー) の略です。他の文書などへのリンクテキスト(古い呼び名でアンカー)を表示します。
属性
共通属性
- グローバル属性
- 詳細は グローバル属性 を参照してください。
重要属性
- href=url
- LS/H2/e2/Ch1/Fx1/Sa1/Op1/i1
- リンクをクリックした時のジャンプのアドレス(URL)を指定します。他にも、mailto: による電子メールの送信指定や、javascript: による JavaScript 実行にも利用されます。
- target=target
- LS/H5/H4T/e3/Ch1/Fx1/Sa1/Op
- ページを表示するターゲットを指定します。target には、
<frame> や <iframe> の name 属性で指定したフレーム名や、下記の特殊名を指定します。特殊名は大文字・小文字が区別されます。
- _top
- フレーム分割されている・いないに関わらずトップフレーム
- _blank
- 新規ウィンドウ(新規フレーム)
- _self
- 自分自身のウィンドウ(フレーム)
- _parent
- 親フレーム
拡張属性
- download=filename
- LS/H5/Ch14/Fx20
- HTML5 で追加されました。リンク先のリソースがダウンロードする目的のファイルであることを示します。値は省略可能で、指定する場合は、ダウンロードの際のファイル名を指定します。この属性を指定することで、画像などのファイルでもクリック時に表示するのではなく、ダウンロードできるようになります。ファイル名に制限はありませんが、OSや環境によって使用不可能文字が変更されることがあります。
- ping=url
- LS/Ch/Op
- ユーザがリンクをクリックした際に、href とは別に、ブラウザが呼び出す URL を指定します。これは主に、ユーザがリンクをクリックしたことをロギングする目的で使用します。
- rel=rel
- LS/H2
- この文書から見たリンク先の文書との関係を記述します。rel には prev, next, contents などを指定します。詳細は rel を参照してください。
- hreflang=hreflang
- LS/H4
- リンク先文書の言語(ja など)を指定します。
- type=type
- LS/H4
- リンク先文書の MIMEタイプ(text/htmlなど)を指定します。
- urn=urn
- [非推奨] H2-2
- あまり使用されていません。HTML3.2 で削除されました。
- media=media
- [非推奨] H5d
- メディアを指定します。HTML5 の草案で検討されていましたが、最終案では削除されました。
- charset=charset
- [非推奨] H4-4
- リンク先文書のキャラクタセット(euc-jp や Shift_JIS など)を指定します。HTML5 では廃止されました。
- methods=methods
- [非推奨] H2-2
- リンク先のオブジェクトが持つ機能についての情報を記述しますが、あまり使用されていません。HTML2.0 では定義されていましたが、HTML3.2 で削除されました。
セキュリティ関連
- referrerpolicy=policy
- LS/H5.2/Ch46/Fx50
- リソースにアクセスした際のリファラー(Referer)送信ポリシーを指定します。
- no-referrer
- 送信しない。
- no-referrer-when-downgrade
- https から http にダウングレードする際には送信しない(デフォルト)。
- same-origin
- 同一オリジン間移動の場合のみ送信する。
- origin
- オリジン情報(プロトコル＋FQDN＋ポート番号)のみを送信する。
- strict-origin
- オリジン情報(プロトコル＋FQDN＋ポート番号)のみを送信するが、ダウングレード時には送信しない。
- origin-when-cross-origin
- オリジンをまたがる場合は、オリジン情報のみを送信する。
- strict-origin-when-cross-origin
- オリジンをまたがる場合は、オリジン情報のみを送信するが、ダウングレード時には送信しない。
- unsafe-url
- 常に送信する。
詳細は下記を参照してください。
https://developer.mozilla.org/ja/docs/Web/HTTP/Headers/Referrer-Policy
非推奨
- name=name
- [非推奨] H2-4/e2/Ch1/Fx1/Sa1/Op1/i1
- <a name="XXX">～</a> で囲んだ部分に XXX という名前を指定します。HTML5 では廃止され、代わりに、対象テキストを囲む任意の要素に id 属性を指定することになりました。
- rev=rev
- [非推奨] H5.1/H2-4
- リンク先の文書から見たこの文書との関係を記述します。rev には next, previous, parent などを指定します。HTML5 で廃止されましたが、RDFa 対応の目的で HTML 5.1 で復活しました。HTML Living Standard では廃止されたままです。
クリッカブルマップ関連
- coords=coords
- [非推奨] H4-4
- クライアントサイドイメージマップの座標を指定します。
<area> を参照してください。HTML5 では廃止されました。
- shape=shape
- [非推奨] H4-4
- クライアントサイドイメージマップの形を指定します。
<area> を参照してください。HTML5 では廃止されました。
データバインド関連
- datafld=datafld
- [非推奨] e4-7
- データバインド機能を用いる際の、データソースの列名を指定します。Internet Explorer 8 で廃止されました。
- datasrc=datasrc
- [非推奨] e4-7
- データバインド機能を用いる際の、データソースの ID を指定します。Internet Explorer 8 で廃止されました。
i-mode関連
- cti=cti
- [非推奨] i2
- このリンクをクリックすると、cti で指定した番号にダイヤルします。cti をサポートしている機種では href より cti を優先します。0～9、アスタリスク(*)、シャープ(#)の他、1秒待ちを示すカンマ(,)とキー入力待ちを示すスラッシュ(/)を使用することができます。
- utn
- [非推奨] i3
- 携帯端末や FOMAカードの識別番号をサーバーに送信します。
- subject=subject
- [非推奨] i3
- href="mailto:～" でメールを送信する際の件名を指定します。
- body=body
- [非推奨] i3
- href="mailto:～" でメールを送信する際の本文を指定します。
- telbook=telbook
- [非推奨] i3
- 電話帳登録機能の名前(20バイト)を指定します。
- kana=kana
- [非推奨] i3
- 電話帳登録機能の半角カナ名(18バイト)を指定します。
- email=email
- [非推奨] i3
- 電話帳登録機能のメールアドレス(50バイト)を指定します。
- ista=id
- [非推奨] i4
- 起動するする iアプリを示す OBJECTタグの IDを指定します。
- ijam=id
- [非推奨] i3
- ダウンロードする iアプリを示す OBJECTタグの IDを指定します。
- ilet=id
- [非推奨] i5
- ダウンロード後、即起動する iアプリを示す OBJECTタグの IDを指定します。
- iswf=iswf
- [非推奨] i5
- インタラクティブ再生モードで配信する Flashコンテンツを指定します。
- irst=irst
- [非推奨] i5
- 赤外線送信するデータに対応した OBJECTタグの IDを指定します。
使用例
HTML
<a href="http://www.example.com/">リンク先にジャンプ</a>
<a href="index.htm">同フォルダの別ファイルにジャンプ</a>
<a href="../xxx/index.htm">別フォルダの別ファイルにジャンプ</a>
<a href="index.htm#XYZ">リンク先の特定位置にジャンプ</a>
<a href="#XYZ">同じファイル内の特定位置にジャンプ</a>
<a href="mailto:foo@example.com">メールアドレスにメール送信</a>
<a href="ftp://www.example.com/xxxx.zip">FTPを用いたダウンロード</a>
詳細
別ファイルへのリンク
<a href="...">の形式は、リンクを表示するのに用います。
HTML
<a href="http://www.yyy.zzz/xxx/yyy/zzz.html">ZZZ</a>
ファイルが同じサーバにある時は、http://～ を省略することができます。
HTML
<a href="/xxx/yyy/zzz.html">ZZZ</a>
ファイルが同じフォルダにある時は、/xxx/yyy/ の部分も省略することができます。
HTML
<a href="zzz.html">ZZZ</a>
ファイルがひとつ上のフォルダにある場合は、「ひとつ上の」を意味するドットドット(..)を用いて次のように表現します。
HTML
<a href="../index.html">戻る</a>
ひとつ上のフォルダの中の、xyz というフォルダの中の、index.html というファイルを参照するには次のようにします。
HTML
<a href="../xyz/index.html">ZZZ</a>
名前付け
古い HTML では名前付けに <a name="..."> を使用していましたが、現在では id 属性を使用します。id 属性で名前をつけ、href="#..." でリンク先として参照することができます。
HTML
<h4>目次</h4>
<ul>
<li><a href="#hajimeni">はじめに</a>
</ul>
<h4 id="hajimeni">はじめに</h4>
<p>この文章は...</p>
別のページの特定場所にジャンプさせるには、次のようにします。
HTML
<a href="betupage.html#ABC">別ページのABCにジャンプ</a>
ファイル名省略時の動作
http://～/ や、http://～/～/ のように、ファイル名を省略して指定した場合は通常、index.html、index.htm、default.htm などの省略時のファイルが表示されます。省略時のファイルが存在しない場合は、サーバーの設定によって、フォルダの中のファイルの一覧が表示されたり、エラーとなったりします。
フォルダの後ろのスラッシュ(/)
http://～/ディレクトリ名/ の最後のスラッシュ(/)は無くても動作しますが、極力指定するようにしましょう。これを省略すると、ブラウザとサーバーの間で「http://～/～ を頂戴」、「http://～/～/ じゃないとやだね」、「http://～/～/ を頂戴」....のように、無駄な通信が発生します。
例えば http://～/～/ を開くと http://～/～/index.html が読込まれますが、両者は別の URL として認識されますので、ブラウザのキャッシュが効きません。
<a href="index.html">[戻る]</a> とするところを <a href="./">[戻る]</a> とするとよいのですが、これだとローカルマシンでテストする際に不便なので困ったものです。
テクニック
リンク
Copyright (C) 1996-2022 杜甫々
初版:1996年9月10日 最終更新:2022年1月30日
https://www.tohoho-web.com/html/a.htm