アンカーリンクにaltタグを使用することは正しいですか?
<a href="#" class="test" alt="Something" src="sfasfs" ></a>
アンカーリンクにaltタグを使用することは正しいですか?
<a href="#" class="test" alt="Something" src="sfasfs" ></a>
回答:
そのようなことは公式の仕様を見ることによって最もよく答えられます:
仕様に移動します:https : //www.w3.org/TR/html5/
「a
要素」を検索:https : //www.w3.org/TR/html5/text-level-semantics.html#the-a-element
a
要素に許可されているすべての属性をリストする「コンテンツ属性」を確認します。
- グローバル属性
href
target
download
rel
hreflang
type
リンクされている「グローバル属性」を確認してください:https : //www.w3.org/TR/html5/dom.html#global-attributes
ご覧のとおり、このalt
属性はa
要素では許可されていません。
また、src
属性が許可されていないことにも気づくでしょう。
することで、あなたのHTMLを検証し、これらのようなエラーがあなたに報告されています。
上記は2014年のW3CのHTML標準であるHTML5の場合であることに注意してください。2016年、HTML 5.1は次のHTML標準になりました。許可された属性の検索は同じ方法で機能します。要素がHTML 5.1では別の属性を持つことができることがわかります。a
rev
W3CのHTML Current Statusで、すべてのHTML仕様(最新の標準を含む)を見つけることができます。
アンカーの場合は、代わりにタイトルを使用する必要があります。altはaの有効な属性ではありません。http://w3schools.com/tags/tag_a.aspを参照してください
「タイトル」はブラウザに広く実装されています。試してください:
<a href="#" title="hello">asf</a>
title
ますが、HTML5の仕様によれば(ほとんどのブラウザーで実装されていますが)、それは誤りです。
いいえ、alt
属性(タグではなく属性)はa
、HTML仕様またはドラフトの要素では許可されていません。また、どのブラウザにも重要なものとして認識されていないようです。
人々がそれを使おうとするのは少し不思議ですが、おそらくマウスオーバー時に「ツールチップ」が表示されることを期待してalt
、img
要素の属性を使用してアナログで使用していると考えられます。これには2つの問題があります。まず、各要素には、各要素の仕様で定義された独自の属性があります。第2に、alt
一部の古いブラウザでの属性の「ツールチップ」レンダリングは、予想されるものではなく、奇妙な、またはバグでさえありました。alt
何らかの理由で画像自体が提示されない場合に限り、属性がユーザーに提示されることになっています。
「ツールチップ」を作成するには、title
代わりに属性を使用するか、または「CSSツールチップ」にGoogleを使用し、好みのCSSベースのツールチップを使用します(マウスオーバーで表示される非表示の「レイヤー」として特徴付けることができます)。
alt属性の場合と同様に説明情報を適用する場合は、アンカータグの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
タイトルを使ってうまくいきました!
title属性はリンクのタイトルを与えます。1つの例外を除いて、それは純粋に助言です。値はテキストです。例外はスタイルシートリンクで、title属性は代替のスタイルシートセットを定義します。
<a class="navbar-brand" href="http://www.alberghierocastelnuovocilento.gov.it/sito/index.php" title="sito dell'Istituto Ancel Keys">A.K.</a>
タグでのalt
属性の使用が無効であることを示すすべての回答を見て驚いています。これは間違いです。a
HTMLは属性の使用をブロックしません。
<a your-custom-attribute="value">Any attribute can be used</a>
alt
属性を使用することが意味的に正しいかどうかを尋ねるとa
、私は言うでしょう:
番号。画像の説明を設定するために使用されます<img alt="image description" />
。
それは、属性をどうするかという問題です。次に例を示します。
a::after {
content: attr(color); /* attr can be used as content */
display: block;
color: white;
background-color: blue;
background-color: attr(color); /* This won't work */
display: none;
}
a:hover::after {
display: block;
}
[hidden] {
display: none;
}
<a href="#" color="red">Hover me!</a>
<a href="#" color="red" hidden>In some cases, it can be used to hide it!</a>
繰り返しになりますが、カスタム属性を使用することが意味的に正しいかどうかを尋ねると、次のようになります。
いいえdata-*
。セマンティック用途に属性を使用します。
おっと、質問は2013年に尋ねられました。
title
で、属性a
のグローバル属性は、それが右のように使用することtitle
で属性をa
か?