HTML 5でのリンクアンカー。

従来の<a>要素の定義。

従来、HTML 4/XHTML 1に於いては、リンクアンカーである<a>要素は、インライン要素と定義されておりました。

内容モデルは<a>要素の入れ子を禁じている事を除けば、通常のインライン要素同様インライン要素に限られると言うものでした。

と言う事は、誤って不正にブロックレヴェル要素を<a>要素の下に置いた場合(※ 1)、文書そのものをエラーとするのでない限り、そのブロックレヴェル要素の直前で当該<a>要素は強制終了しなければならない筈です。

ですが、実際のウェブブラウザなどは、その殆どが<a>要素の終了タグが見付かるまでをアンカーと見なして処理していたのです。

XHTML 2で検討されたhref属性のグローバル属性化。

一方、西暦2009年12月17日に正式に廃案となったXHTML 2では、全ての要素をリンクアンカーに出来るよう、href属性をグローバル属性化する事を検討しておりました。

• XHTML Hypertext Attributes Module

確かに、あらゆる要素をアンカーに出来れば便利ではあります。

ですが、現実問題として href属性のグローバル属性化には無理がありました。

• 一つは、実装が対応していない事…もっとも、XHTML 2.0は仕様草案の冒頭の方で後方互換性を考える必要はなくなった(キリッ)と嘯いているので、現行のユーザエージェントで実装出来なくても良いのでしょうけど(JAVAスクリプトを用いて擬似的に実現する事は可能ですが、JAVAスクリプトが使えない環境ではリンクの機能を与える事が出来ません)。
• もう一つは、HTML 5のワーキングティームが問題視した事ですが、閲覧者の操作が可能な要素(HTML 5に於けるインタラクティヴ内容となる要素)では問題が起こる事が挙げられます。例えば、<input type="submit">要素は、フォーム投稿ボタンとなりますが、これにhref属性を与えてハイパーリンクを実現したとしたら、どう言う事になるでしょう？　クリックすると投稿ボタンとしての機能を優先すべきか、陸アンカーとしての機能を優先すべきか、と言う問題が生じます。

HTML 5草案での<a>要素の定義変更点。

これらの点を踏まえて、HTML 5では、以下のように<a>要素の定義を変更しました。

カテゴリ

フロウ内容で且つインタラクティヴ内容。

• 要素内容がフレージング内容のみの場合はフレージング内容ともなる。

つまり、従来の概念で言えば、ブロックレヴェル要素としても認めたと言う事です。

• もっとも、HTML 4/XHTML 1とHTML 5では概念が全く異なるものなので、安易に対比して良いと言えませんが。

当該要素の存在が許される箇所

• 要素内容がフレージング内容要素の場合は、フレージング内容要素が存在し得る箇所。
• その他の場合は、フロウ内容要素が存在し得る箇所。

フレージング内容要素はフロウ内容要素でもあるので、上記からは、結局フレージング内容要素以外の内容を持つ場合はフレージング内容要素以外が入りえない箇所(<p>要素内など)に置けない、つまり従来の概念で言えばブロックレヴェル要素を含んだ場合はブロックレヴェル要素が入り得ない箇所には置けないと言う事になります。

内容モデル

透明な内容。但し、インタラクティヴ内容要素を子孫に含めてはならない。

つまり、他の<a>要素や<input>要素など、閲覧者が操作可能な要素を含めない限りは、当該<a>要素の開始タグと終了タグを取り除いても文法違反にならない範囲で内容を取る事が出来ると言う事になります。

ちなみに、このルールは、現存する殆どのウェブブラウザの実装に即したものとなっております。

• 否、HTML 3.2の策定以前のウェブブラウザだったネットスケープ 3.0でもこの実装でした。

従来の概念を用いてまとめますと、HTML 5に於いては、

• <a>要素はブロックレヴェル要素にもなり得る
• <a>要素はブロックレヴェル要素を内容としても良いが、その場合はインライン要素しか入れられない箇所には置けない
• また、<a>要素には他の<a>要素など閲覧者の操作が可能な要素を含んではならない

と言う事になるのです。

HTML 5草案での変更がもたらす効用。

さて、このように<a>要素の定義が変更される事で、どのような効用が生じるでしょうか。

従来のような単純なフレーズでは示し切れないリンク先の内容を明らかにする事が可能になりますが、制作者が思い付いたものとしては、特に以下のような場合に有効と思われます。

コンピュータ言語のコードをごっそりリンクする

コンピュータ言語のコードは殆どの場合整形済みテキストにしたうえで<pre>要素としてマークアップしますが、この<pre>要素をごっそりアンカーにする事で、オリジナルコードの公開先の解説文書や配布先などにリンクする事が可能になります。

<a href="http://www.code.uso/javascript/uso800.html">
    <pre class="JAVAScript">
       …
       </pre>
    </a>

ブロック単位での引用元に直接リンクする

一応<blockquote>要素には cite 属性があり、これに依って引用元を明示する事が可能になっておりますが、実用と言う面ではまだ実装が不充分と言えます。

そこで、引用文にアンカーが全く含まれていないのであれば、当該<blockquote>要素をまるまるアンカーとする事も考えられます。

• ただ、一部の携帯電話のウェブブラウザには、<blockquote>要素の cite　属性がそのようなリンクとして機能するように出来ているものがあるので、ちょっとその辺りが問題になるかも知れません。もっとも、<blockquote>要素にcite 属性があるからと言って、従来も<blockquote>要素の内容要素に<a>要素を含んではならないとされていた訳でもないので、今更問題にする事もないと思いますが。

<a href="http://www.uso800.uso/articles/horikita_maki.html">
    <blockquote cite="http://www.uso800.uso/articles/horikita_maki.html">
       …
       </blockquote>
    </a>

href属性値と直下の<blockquote>要素のcite属性値が全く同じURLとなっている事に注意してください。

尚、これはあくまでも閲覧者に対する便宜としてのマークアップに過ぎないものであり、実際には<a>要素が<blockquote>要素の引用元を表す事を明示する事は出来ないと言う点は忘れないでください。

HTML 5草案での変更でも対応出来ない場合の対策。

しかし、あくまでも従来の実装を追認したものであるので、文法上あらゆる要素をアンカーに出来るという訳でもないのです。

インタラクティヴ内容要素を内容にするのは前置きで述べた通り宜しくないのですが、それ以外にも文法上記述出来ない箇所があります。

それは、以下のものです。

リストでの複数の項目

<ul>要素及び<ol>要素では二つ以上の<li>要素、<dl>要素の場合は<dt>要素か<dd>要素が二つ以上の場合(特に<dt>要素と<dd>要素の組会せ)をまとめて一つのアンカーとする事は出来ません。

このような場合には、各項目ごとにアンカーとするのが順当でしょう。

勿論、該当する項目を独立したリストとしてそれをアンカーとする方法もありますが、マークアップの観点から出来ないと言う事も考えられます。

例えば、以下のようなマークアップは文法違反です：

<dl>
    <a href="http://www.horikita-love.uso800.uso/">
        <dt>堀北真希</dt>
        <dd>昭和63年10月6日、東京都清瀬市生まれのトップアイドル。制作者の俺の嫁。</dd>
        </a>

    …
    </dl>

そこで、どうしてもこの二つをアンカーにしたいのであれば、以下のように各項目ごとにアンカーとしてマークアップする事になります：

<dl>
    <dt><a href="http://www.horikita-love.uso800.uso/">堀北真希</a></dt>
    <dd><a href="http://www.horikita-love.uso800.uso/">昭和63年10月6日、東京都清瀬市生まれのトップアイドル。制作者の俺の嫁。</a></dd>

    …
    </dl>

或いは、無理でなければ以下のように独立したリストに切り離してマークアップする事も考えられます：

<a href="http://www.horikita-love.uso800.uso/">
    <dl>
        <dt>堀北真希</dt>
        <dd>昭和63年10月6日、東京都清瀬市生まれのトップアイドル。制作者の俺の嫁。</dd>
        </dl>
    </a>
<dl>
    …
    </dl>

テーブルでの複数セル

これもリストの複数項目と同様に、各セル毎にアンカーとする事が考えられます。

• 流石に多重テーブルにしてまでまとめるのはどうかと思いますが。

テーブルでの行単位

これについては、JAVAスクリプトを用いて実現する方法が挙げられております。

ただ、この方法はJAVAスクリプトが使えない場合には意味がないので、一部のセルにアンカーを降ろすなど、何らかの対応が必要になるでしょう。

以下は、JAVAスクリプトに対応していない場合には、見出しセルがアンカーとして機能するようにしております：

<table>
    <tr onclick=" location.href='http://horikita-love.uso800.uso/'; ">
        <th scope="row"><a href="http://horikita-love.uso800.uso/">堀北真希</a></th>
        <td>昭和63年10月 6日</td>
        <td>東京都清瀬市</td>
        <td>B型</td>
        …
        </tr>
    …
    </table>

href属性がない<a>要素。

従来のHTML 4/XHTML 1には、href属性が附与されていない<a>要素についての扱いは明確にされておりませんでした(※ 2)。

しかし、HTML 5ではhref属性を持たない<a>要素はプレイスホルダ、すなわち現時点ではアンカーとしていないが、アンカーとして用いる事を想定して予約された文字列となります。

これは、

• HTML文書のテンプレートなどに用いたり、
• 制作途中でありながらも公開が可能なウェブサイトに於いて、まだ完成していない文書へのアンカー予定文字列として予約したり、
• DOM操作でアンカーを新たに作り出したり

する事を想定してのものと思われます。

ping属性について。

平成23年 5月 1日現在のWHATWGのHTML草案には、<a>要素に ping属性が追加されております。

但し、同日付のW3C版HTML 5草案には、ping属性は<a>要素以外の要素にも定義されておりません。

• WHATWGは既にHTML 5の先を見据えて仕様案の編纂を行っているようですので、ping属性はHTML 5の正式勧告には含められない事が考えられます。

ping属性は、閲覧者が当該リンクを指定した際にその旨をPINGで通知する通知先となるURLの集まりです。

• PING通知先URLが複数ある場合は、空白文字で区切って並記します。

例えば、以下のようなアンカーがあったとします。

<a href="HOTIKITA_Maki.html" ping="/cgi-bin/count.cgi?n=HORIKITA_Maki">堀北真希ちゃんについて</a>

閲覧者がこのアンカーを指定し、リンク先が正しく処理出来る場合、ping属性の値となるURLを評価し、そのURLに対してHTTPリクエストを送信します。

• 使い方としてはアクセス解析やアクセスカウンタなどに使えそうですが、まだ全く実装がないようですので、残念ながら当てには出来ないでしょう。そもそも、HTML 5の正式勧告に入るかどうかさえ分かりません。