web-dev-qa-db-ja.com

アンカーリンクにaltタグを使用するのは正しいですか？

アンカーリンクにaltタグを使用するのは正しいですか？

<a href="#" class="test" alt="Something" src="sfasfs" ></a>
htmlanchoralt
116
user2067736

そのようなことは、公式の仕様を見ることで最もよく答えられます：

  1. 仕様に進みます： https://www.w3.org/TR/html5/

  2. 「a element」を検索： https://www.w3.org/TR/html5/text-level-semantics.html#the-a-element

  3. a要素に許可されているすべての属性をリストする「コンテンツ属性」を確認します。

    • グローバル属性
    • href
    • target
    • download
    • rel
    • hreflang
    • type

  4. リンクされた「グローバル属性」を確認してください： https://www.w3.org/TR/html5/dom.html#global-attributes

ご覧のとおり、alt属性はa要素では許可されていません。
また、src属性も許可されていないことに気付くでしょう。

HTMLの検証 により、このようなエラーが報告されます。

上記はHTML5であり、これは 2014年からのW3CのHTML標準 。 2016年、HTML 5.1は 次のHTML標準 になりました。許可された属性の検索も同様に機能します。 a要素には、HTML 5.1で別の属性revを設定できることがわかります。

W3CのHTMLの現在のステータス ですべてのHTML仕様（最新の標準を含む）を見つけることができます。

124
unor

アンカーの場合は、代わりにタイトルを使用する必要があります。 altはaの有効な属性ではありません。 http://w3schools.com/tags/tag_a.asp を参照してください

55
tomis

「タイトル」はブラウザに広く実装されています。試してください：

<a href="#" title="hello">asf</a>
22
Pablo Pazos

いいえ、HTML仕様またはドラフトのalt要素にはa属性（タグではなく属性になります）を使用できません。そして、それはどんなブラウザによっても重要性を持っていると認識されていないようです。

人々がそれを使用しようとする理由は少し謎ですが、おそらく、alt要素のimg属性を使用して、マウスオーバーで「ツールチップ」が表示されることを期待しているからです。これには2つの問題があります。まず、各要素には独自の属性があり、各要素の仕様で定義されています。第二に、一部の古代のブラウザでのalt属性の「ツールチップ」レンダリングは、予期されるものではなく、奇妙であり、バグでさえありました。 alt属性は、何らかの理由で画像自体が表示されない場合にのみ、ユーザーに表示されることになっています。

「ツールチップ」を作成するには、代わりにtitle属性を使用するか、Googleの「CSSツールチップ」を使用して、好みのCSSベースのツールチップを使用します（マウスオーバーで表示される「レイヤー」として表示できます）。

6
Jukka K. Korpela

Alt属性の場合と同様に説明情報を適用する場合は、アンカータグのtitle属性を使用する必要があります。 title属性はアンカータグで有効であり、リンクされたページに関する情報を提供する以外の目的には使用されません。

W3Cは、title属性の値がリンクされたドキュメントのタイトルの値と一致することを推奨していますが、必須ではありません。

http://www.w3.org/MarkUp/1995-archive/Elements/A.html

あるいは、より有益である可能性が高いため、ARIAアクセシビリティ属性aria-labelを使用できます（aria-labeledbyと混同しないでください）。 aria-labelは、画像のalt属性と同じ機能を提供しますが、非画像要素に対して機能し、スクリーンリーダーの最適化以降の最適化の手段を含みます。

http://www.w3.org/WAI/GL/wiki/Using_aria-label_to_provide_labels_for_objects

ただし、アンカータグを記述したい場合は、通常relまたはrevタグを使用するのが適切ですが、特定の値に限定するため、人間が読める記述には使用しないでください。

Relは、リンクされたページと現在のページの関係を説明するのに役立ちます。 （たとえば、リンクされたページが論理シリーズの次の場合、rel = nextになります）

Rev属性は、本質的にrel属性の逆の関係です。 Revは、現在のページとリンクされたページの関係を説明します。

有効な値のリストは、ここで見つけることができます： http://microformats.org/wiki/existing-rel-values

5
davidcondrey

私はタイトルを使用しましたが、うまくいきました！

Title属性は、リンクのタイトルを提供します。 1つの例外を除き、それは純粋に助言です。値はテキストです。例外はスタイルシートリンクの場合で、タイトル属性は代替スタイルシートセットを定義します。

<a class="navbar-brand" href="http://www.alberghierocastelnuovocilento.gov.it/sito/index.php" title="sito Dell'Istituto Ancel Keys">A.K.</a>
4
Giovanni Gianni