HTMLのリンク

リンク (ハイパーテキスト)

[26] ハイパーリンク (hyperlink) (リンク (link) ) は、ハイパーテキストにおいてある文書 (の一部) からある文書 (の一部) への関係を示したものです。

呼称

[3] 厳密にはハイパーリンクリンクの一種とされていますが、 現在、ハイパーテキストについて特に断りなくリンクという場合、 ハイパーリンクを指していることが多いようです。

[1] リンクは、接続連結などと訳すこともあります。

意味

[27] リンクハイパーリンクといった語の意味は、 とても広く、 それ自体ではあまり明確ではありません。

[47] 何かと何かの関係性を記述あるいは提示したものは、 何であってもリンクと呼ぶことができます。 そのような広い意味の言葉はほとんど何も言っていないのと同じなので、 用語・概念として存在意義があるのかどうかわかりませんが... Web およびその周辺領域では、その何らかの関係の一方または両方を URL を示すとき、 それをリンクと呼ぶことが多いように見受けられます。

[48] ハイパーリンクは、文章中の単語をクリックすると他の文書へと遷移する、 といったWebブラウザーなどでこんにちではありふれた動作に象徴されるような、 ハイパーテキストからハイパーテキストへの動線となるリンクを表しています。

[49] HTML でいえば a 要素のように他の文書に遷移するものがハイパーリンクであり、 img 要素のように画像を埋め込むものは、 当該文書から画像へのリンクではあるものの、 ハイパーリンクではない、と解されることがあります。

[50] しかし現在一般的な用法では、 a 要素ハイパーリンク (リンク) ですが、 img 要素リンクではないと解釈するようにも思われます。

[51] HTML では a 要素img 要素の差は明確とも思われますが、他のハイパーテキスト技術、 例えば XLinkHyTime では、リンクハイパーリンクの差がどこにあるのか、 より不明瞭です。

[52] あるいは、過度に一般化してハイパーリンクリンクの意味を拡大させすぎた結果が XLinkHyTime の失敗につながったのかもしれません。

[75] この過剰に意味の広いリンクは、 XLinkHyTime の失敗で影を潜めたかのように見えましたが、 一部でもてはやされているハイパーメディアと自称する Web API 設計技法の核としてひっそり使われています。

各種ハイパーテキスト技術におけるリンク

[70]

[53] リンクに関係するプロトコル要素

[42] HTML を初めとする WWWSGML 応用の多くにおいては、参照リンクの参照先指定には href 属性, 埋め込みリンクの参照先指定には src 属性を使っています。

[57] リンクに関係する処理:

[71]

HTML のリンク

[54] HTML ではリンクハイパーリンク外部資源へのリンクに大別しています。 どちらであるかは要素の種類とリンク型により決まります。一つの要素から両方の種類のリンクが同時に作成されることもあります。

[55] ある要素ハイパーリンクであるかどうかは、 base 要素target 属性の適合性に関わります。

[56] ある要素ハイパーリンクであるかどうかは、 要素ARIA役割の決定と適合性に関わります。

関連

[28] たまに URL と混同されます。

[29] 「画面上にURLが表示されます」と言われても、実際には URL ではなくハイパーリンクが表示されていることがあります。

複雑ネットワーク

歴史

いろいろな定義

[4] リンクは、2つ又はそれ以上の資源の間にある、1つ又は複数の (明示的又は暗示的な) 関係のことです。 http://www.w3.org/1999/05/WCA-terms/#Link

[2]

link
二つのアンカーの関係で、同じ又は異なるデータベースに蓄積される。 http://www.w3.org/Terms.html#link

[30]

Hyperlink

始点対象の2つのアンカーの間の関係。 リンクは始点から対象に向かう。始点はとも呼び、 対象は終点ともいう。 (ISO‐HTML http://purl.org/NET/ISO+IEC.15445/15445.html#DEFS 4.12 参照。)

[31]

ハイパーリンクとは、主として人間利用者に対して表現することを目的とした連結である。 http://www.w3.org/TR/xlink/#dt-hyperlink

[20]

3.44 ハイパーリンク (hyperlink)
2つ以上の物体関係表現する情報構造

注意30. ハイパーリンクによって関連付けられる物体ハイパーリンクと呼びます。 リンク端点というハイパーリンク特性により識別されます。

注意31. ハイパーリンクには HyTime を使う応用体系によりリンク型名前割当てることができます。

注意32. SGML文書ハイパーリンク以外の手段によっても関係表現できます。 例えば、文書構造下位兄弟関係マークタグの位置によって表現されます。

出典: ISO/IEC 10744:1997 http://www.y12.doe.gov/sgml/wg8/docs/n1920/html/clause-3.html#def-3.44

ハイパーリンクと理論(?)

[35] ハイパーテキストにおけるリンクの自由性

[36] HTML のリンクなんかは、「リンク」という語の故になんだか誤解されてるきらいがある、という指摘があるね。たとえばa要素を消すことを「リンクを切断」と言う人がいるけど、この言い方はどうも気に入らない。確かに動詞「切断」は「リンク」に呼応する, 日本語文としては適切な語法だとは思うんだけど、技術的に考えて受け入れがたい。

[38] >>37 曰く「ハイパーリンクは、ウェブサイトの生命線」

[76] Describing and Linking Web Resources, , https://www.w3.org/Architecture/NOTE-link.html

HTML4 のリンク

[59] 連結 (リンク) (ハイパーリンク, Web 連結) は、 HTML の特徴の1つであり、ウェブ成功の鍵でもあります。 連結は、2つの端点を持ちます。1つは始点アンカーで、 連結の出発点です。もう1つは終点アンカーで、 連結の向かう先です。終点は、どんな Web 資源でも構いません。 文章かもしれませんし、画像、音声、動画、プログラムかもしれません。 文章の一部分かもしれません。 [HTML4 12.1]

[60]

・・・ HTML と他のほとんどのマーク付け言語を分かつものは、 ハイパーテキストと対話的文書の機能である。 この章では連結 (ハイパー連結, ウェブ連結) という、基本ハイパーテキスト構造を導入する。 連結は、一つのウェブ資源から他の資源への接続 (連結 (connection) ) である。連結は単純な概念ではあるが、ウェブを成功に導いた主要な力の一つでもある。

連結は2つの端点 (アンカーと呼ぶ。) と方向を持つ。・・・

HTML 4 12.1 Introduction to links and anchors https://www.w3.org/TR/html4/struct/links.html#links

[61] 連結に関連付けられた既定の振舞いは他の Web 資源の取出し (retrive) です。 この挙動は、連結の選択 (活性化 (activate) 。 マウスのかちっ, 特定の打鍵, 音声による指示など) によって行われるのが普通です。 [HTML4 12.1.1]

[62] もっとも広く行われている連結の使用法は >>61活性化したら関連する資源を取出すですが、 連結型を指定することで、著者は他の関係を表現することもできます。 [HTML4 12.1.2]

例えば、連結型 prev を使って、 文書群の中で次にあたる文書を示すことができます。

[63] HTML 文書の中の要素を終点アンカーにすることができます。 このためには、 a 要素と name 属性を使うか、ほとんどの要素型にある id 属性を使うかします。 始点アンカー側では、 URI参照素片識別子を指定します。 [HTML4 12.1.2] 詳しくはそれぞれの説明を見てください。

[64] HTML の連結要素型には、 a, link, img, form などがあります。 [HTML4 12.1.3]

href 属性つきの a は始点アンカーになります。 name 属性つきの a は終点アンカーになります。 [HTML4 12.1.3]

link 要素は現在の文書から他の資源への連結を表します。 link の連結は文書の内容としてはレンダリングされませんが、 UA の誘導棒などとしてレンダリングされるかもしれません。 [HTML4 12.1.2, 12.1.3]

[65] 利用可能・型識別可能でない資源への参照は誤りです。 UA は誤りをどう処理しても構いませんが、次の処理が推奨 (recommend) されています。

  • [66] 資源が利用でないときには、利用者に警告するべきです。
  • [67] 資源の型が識別できないときには、それでも処理しようと試みるべきです。 また、利用者に警告するべきですし、 利用者が処理に介入して文書型を識別することが可能でも構いません。

XML でのハイパーリンク

[12] XLink

  • XML名前空間の元で使う汎用の属性群で、どのような文書型でも名前空間 (の属性) を追加するだけで使えるようになります。
  • 1つの要素に1つのハイパーリンクしか作れないという問題点があります。 例えば、クリックしたら移動するハイパーリンクである画像 (埋め込みリンク) を (1つの要素で) 表現できません。
    • 2つの要素の入れ子にするとか、始点アンカーでも終点アンカーでもない要素でリンクを定義する仕組みを使うとかすれば表現できますがね。

[43] HLink

  • 要素(・属性)にハイパーリンクであるとの定義を与える、一種のスキーマです。
  • 従来の WWWブラウザは HTML の img 要素が画像 (埋め込みリンク) であるということを知っていましたし、 href 属性のある要素がクリックで移動するハイパーリンクであることを知っていました。 このリンクであるという知識を教えるのが HLink 文書です。

[44] CSS による関連付け

[45] DOM, XBL, XSLT...

  • 少し趣は異なりますが、 XML とハイパーリンクということで紹介しておきます。
  • WWW ブラウザに対して XML の要素をハイパーリンクと知らせたい場合、その文書 (のインスタンス) が特定の目的 (普通は表示。) にしか用いないのなら、もうその文書は「破壊」しても良いことになります。
  • そこで、任意の XML の構成要素を、ブラウザが既にリンクであると知っているもの、例えば HTML の a 要素に変換してしまえば、ハイパーリンクであることを知らせるという点では十分です。
  • ですからこれらの技術も、 ad hoc ながら XML でハイパーリンクを実現するための手段といえます。
  • [46] Minutes of 16 Jan 2003 discussion on Linking in XML Documents http://www.w3.org/2003/01/16-tag-xlink
  • [14] Clink http://people.opera.com/howcome/2000/css3/clink-nov-6.html
    • [13] なぜか W3C members only note なのに公開されていますが、 Opera の人で、 CSS でのハイパーリンク指定の CSS3 への提案のようです。 Opera 独自拡張属性の説明も付録でついています。
  • [16] Clink は現時点の >>14 の案では多分使い物にならないのが出てくると思います:)
  • [17] で、物理マーク付け的 XLink と、ずばり CSS の Clink, (CSS in XML 的意味で) XSL 的な HLink が出揃ったわけですが。
  • [18] >>17 物理マーク付けがそれなりに成功していて、 CSS が元気を出してきて、 XSL は標準化が遅れてなんだかなあていう感じのところまでそっくりだ:)
  • [19] という三つ巴をどうするかを話し合ったのが >>13TAG 会合。結論は出てないような木が。

メモ

[77] null, https://web.archive.org/web/20001029045127/http://www.bath.ac.uk/~py8ieh/internet/projects/old-stuff/xlink.txt

[78] >>77 初期 Ian Hicksonリンク

[5] リンクをクリックしやすくする、ちょっとした工夫 | Blog hamashun.com (2007-03-11 08:36:19 +09:00 版) http://www.hamashun.com/blog/2007/03/post_23.html (名無しさん 2007-03-11 01:12:59 +00:00)

[6] リンクは張る?貼る? - サーチマーケティングのヒント (2007-03-18 12:13:29 +09:00 版) http://www.seo-service.net/seo-blog/memo/post_33.html (名無しさん 2007-03-18 03:14:29 +00:00)

[7] Simple Questions of Languages 14 ( 版) http://www5b.biglobe.ne.jp/~aiida/gimon14.html#1 (名無しさん 2007-03-18 03:15:41 +00:00)

[21] Publishing and Linking on the Web ( ( 版)) http://www.w3.org/TR/2013/NOTE-publishing-linking-20130430/

[32] URLs are parsed and produce records · whatwg/html@30bc255 ( 版) https://github.com/whatwg/html/commit/30bc2557105ad62881ec9670f253febbc9761b44

[33] ハイパーリンク (略してリンクとも呼ばれる。) はハイパーテキストの本質といえましょう。

[34] たとえば >>33 の文のうち、「ハイパーテキスト」という部分が、お使いの UA では色が変わっているなどの効果がついていると思います。 この部分はハイパーリンクになっていて、「ハイパーテキスト」 についての話題に飛ぶことが出来ます。

このように、文章中のある部分から他のどこかへ飛ぶことが出来るのが、ハイパーリンクであると (とりあえず) 理解して構わないでしょう。

[22] ハイパーリンクをより良い物に - Personnel http://members.jcom.home.ne.jp/jintrick/Personal/yk_hyperlink.html

[15] スラッシュドット ジャパン | 「CDからのハイパーリンク特許」侵害で訴訟発生 ( 版) http://slashdot.jp/it/article.pl?sid=07/04/20/0820218&from=rss (名無しさん 2007-04-21 03:02:04 +00:00)

[23] 楽天vs店舗 外部リンク禁止を巡って裁判沙汰が進行中 ( 版) http://neta.ywcafe.net/000498.html

[24] HTML5 Revision Tracker ( 版) http://html5.org/tools/web-apps-tracker?from=5247&to=5248

[25] Web Applications 1.0 r7794 Rewrite the link following stuff to better match reality. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=7793&to=7794

[69] ページ単位の広告の設定方法 - AdSense ヘルプ () https://support.google.com/adsense/answer/6245305?hl=ja&ref_topic=1307438

モバイル全画面広告の場合、広告内で表示可能なページ上のすべてのリンクがプレビュー ツールによりハイライト表示されます。これらのリンクをクリックして、モバイル全画面広告のテストを実施します。ただし、「ストップワード」を含むリンクはプレビュー ツールでハイライト表示されないので注意が必要です。AdSense では一般的な操作に関連する「ログアウト」などの言葉が「ストップワード」のリストに含まれています。そうしたストップワードを含むリンクではモバイル全画面広告は表示されません。

[72] [css-ui-4] Require cursor:pointer for hyperlinks (frivoal著, ) https://github.com/w3c/csswg-drafts/commit/fc83249fefcf5872b24d83b7523ddc6fd38897e4

[73] [css-ui-4] Require link-pointer when pointer is over a link · Issue #2664 · w3c/csswg-drafts () https://github.com/w3c/csswg-drafts/issues/2664

[74] Describing and Linking Web Resources () https://www.w3.org/Architecture/NOTE-link.html