[all that's jazz][wag][wag Accessibility セミナー]
Welcome(0) || Tag-SiteMap(9) || ブロックレベル要素 - その他(b) || インライン要素 - 置き換え(1)
HTML(Hyper-Text Markup Language)ならではの要素です。
その文書内にある文章から他の文書へ移動可能とする機能を実現します。
出発点の場合、href=""を指定、終着点ならば、HTMLの場合name=""を、XHTML1.0の場合、name="" id=""を指定します。
指定ページの指定箇所へ飛ぶ場合は、href="***.html#***"と指定します。
出発点、終着点両方指定も可能です。
終着点の場合、古いブラウザではname=""を認識、id=""は認識しません。
XHTML1.0対応ブラウザならば、a要素以外のid=""も認識し、終着点として指定可能です。
a要素に関するアクセシビリティとしては隣り合うリンクは境界を表示可能な文字で 明確にするというのがあります。
<a href="a.html">a</a><a href="b.html">b</a>
このようなリンクはクリック時に誤操作を引き起こしたり、リンクを捉えきれない場合もあり得るので、
<a href="a.html">a</a> | <a href="b.html">b</a>
などとしてリンク線の切れを明確にする必要があります。
単にスペースのみの
<a href="a.html">a</a> <a href="b.html">b</a>
これではスペース自体が表示を保障されていなく、ブラウザ側も境目を認識出来ない場合があるからです。
Bobby WorldWideでは単なる改行のみの他、<br> 段落区切り、定義リスト<dt> <dd>などでの区切りも無視されるようです。
画像のリンクに関してもその画像がリンクの要素を含んでいる事を明確にすべきとされており、borderを残すべきとされています。
＃同じ理由でリンクの下線をスタイルシートで消すべきではないとされてもいます。
更には画像を表示出来ない環境のためにも画像でのリンクが続く場合はその境界を表示可能な文字で明確にする必要があります。
そして、例えば「見本」などのリンクで異なる先へリンクを張る場合、a要素内のテキストが同じものの場合、混乱をきたすのでそれぞれ別なリンクである事が判るように記述しなければなりません。「見本a」「見本b」のように
a要素内のテキストで「ここをクリック」などの抽象表現も使用しない事。その前に説明がなされたとしても、リンクを示す要素の中で簡潔明確にリンク先を表現する事が望ましいとされています。
また、メールアドレスへのリンクの場合。mailto:以降はメール言語に対応したアドレスを指定しなければなりません。
例えば、そのページからメール発信した事をタイトル Subjectに記す場合、
<a href="mailto:***@***.com?Subject=From%20Page">E-Mail</a>
このようにスペース指定をメールの仕様にあわせた特殊文字で指定します。
そして、ページの長さが長くなる場合、ページ先頭にはそのページの目次を用意し、目次の行き先毎にdiv(囲み)でセッション分けし、その終端にはページ先頭に戻る事の出来るリンクを用意すると、ページ操作が容易になります。
URIにて終着点を指定する出発点を定義する属性。
終着点を定義する属性。
そのページの中で同じ名前は指定出来ず、重複しないようにして下さい。名前は大文字、小文字を区別します。XHTML1.0では使用可能ですが、XHTML1.1 XHTML Basicでは使用不可。id属性で指定します。
他の要素と同じく、固有の一を定義すると共に、XHTMLでは終着点を定義する属性。
古いブラウザでは認識しないので、XHTML1.0ではname属性を併用。その場合、name="名前" id="名前(識別子)" 同じ名前でなければなりません。
リンク先の文字コードを指定します。
リンク先の基本となる言語コードを指定します。
リンク先のMIMEタイプを指定します。
ブラウザが対応していない形式のデータを無駄にロードしてしまう事を避けるなどの目的で使用されます。指定する場合はMIMEタイプの指定間違いには注意が必要になります。
その文章から見たリンク先の文書の関係を示します。head部のlink要素を参考にして下さい。
リンク先から見たこの文書の関係を示します。head部のlink要素を参考にして下さい。
map要素内で利用され、クライアントサイド・イメージマップでユーザー操作に反応する領域の形状を指定します。詳しくはarea要素で解説します。
map要素内で利用され、クライアントサイド・イメージマップでshape属性で指定された各座標を「,」で区切り、指定します。詳しくはarea要素で解説します。
タブキーを押して項目間を移動させる場合、その順序を指定します。指定出来る値は0-32767。ただし、0を指定したり、指定ない場合は指定されているものの後に移動します。同じ値の場合はより前にあるものから順に移動します。上肢不自由な方の為のアクセシビリティとして、指定が推奨されています。（キーボードでの操作が容易になる）サイト構成を考える場合、統一されたページ操作を確保し、そのマニュアル的ページを提供すべきでしょうね。
文字コード中の任意の１文字を指定します。利用方法はOS、ブラウザなど環境に依存します。Windowsでは「altキー」、Macintoshでは「controlキー」を 同時に押し、利用します。上肢不自由な方の為のアクセシビリティとして、指定が推奨されています。（キーボードでの操作が容易になる）サイト構成を考える場合、統一されたページ操作を確保し、そのマニュアル的ページを提供すべきでしょうね。
この属性に関してはフレームの箇所を参照して下さい。
アクセシビリティでは新しいウィンドをむやみに開く事のないようにとなっています。これは一般的なブラウザではユーザーの意思によって新しくウィンドウを開けるのであり、提供側がそれを強要してはならないという事です。もし、ページ比較などで新しくウィンドウを開いた方がよい場合はその旨を記述し、ユーザーに「選ぶ」情報を与えるべきでしょう。
どちらにしてもtarget属性はStrictDTDでは使用不可となっている属性です。
既存のリンクでもアドレスバーやステータスバーにドラッグする事により、新しいウィンドを開かない工夫や、ブラウザ設定で新しいウィンドを開かない設定も可能ですが、提供側の配慮の一環として、守るべき事でしょう。
イメージマップにはクライアントサイド・イメージマップとサーバーサイド・イメージマップがあります。
アクセシビリティではクライアントサイド・イメージマップを使用するよう推奨されており、以下の利点があります。
map要素はクライアントサイド・イメージマップを定義する要素。
この要素の中にa要素やarea要素を配置し、ユーザーの操作に反応する領域を定義します。
map要素と関連づけ可能な要素はimg要素、object要素、input要素です。
この要素内で領域を定義するのはarea属性を使う方法とブロックレベル要素内にa要素を配置する方法があります。HTML4.01とXHTML1.1では両方を混在させての使用も可能ですが、XHTML1.0ではいずれか一方のみのしようとなっています。ただし、HTML4.01対応ブラウザでは混在する場合、area属性は無視されます。
＃WinIEの場合はa要素を使う方法は未対応になっています。
HTML4.01では省略は出来ません。
この属性で指定した名前はimg要素、object要素、input要素のusemap属性でも同じ名前を指定し、関連づけさせます。XHTML1.1ではid属性を使用します。
XHTML1.1では省略は出来ません。
この属性で指定した名前はimg要素、object要素、input要素のusemap属性でも同じ名前を指定し、関連づけさせます。
map要素の下位にのみ使用可能。
クライアントサイド・イメージマップのユーザーの操作に反応する領域とそのリンク先を設定する要素。
領域が重なる場合は先に指定された領域が優先されます。
省略は不可です。
イメージマップが表示されない場合、代わりに利用されるテキストを指定します。通常、リンク先などを指定すればよいでしょう。
クライアントサイド・イメージマップでユーザー操作に反応する領域の形状を指定します。
クライアントサイド・イメージマップでshape属性で指定された各座標を「,」で区切り、指定します。
起点は画像左上となります。
座標は仕様上は「ピクセル数」または「パーセンテージ」で指定可能ですが、一般的には「ピクセル数」多角形の場合は最初と最後の座標を同じくする事になっています。
領域に対応したリンク先を指定。
リンク先がない領域を示す属性。
XHTMLではnohref="nohref"と記述します。ただし、古いブラウザでは正しく解釈されない場合があります。
a要素参照
a要素参照
tabindex accesskey 共にアクセシビリティでは必須となります。上肢不自由な方など、マウス操作が困難な方がキーボード操作可能になるためです。また、area要素内に書かれたリンクをテキストとして、文書内に明示し、area要素内だけのリンク指定は避けるべきです。map テキスト両方によるリンク指定がよりアクセシビリティなものになる手段でもあります。
文章中の引用部分を示す要素で、前後に引用符が付け加えられます。ただし、現状未対応ブラウザの方が多いです。
暫定的な解決策としてはスタイルシートで
q span.tmp {display : none;}と設定する。
<q><span class="tmp">「</span>地球は青かった<span class="tmp">」</span></q>
- q要素を理解するスタイルシート対応プラウザではテキストとしての引用符が非表示になり、ブラウザにより引用符が付加される
- q要素未対応ならばテキストとしての引用符が表示される
引用元の文書や関連ページのURIを指定。
様々な目的に使用可能なインライン要素。
class属性、id属性、lang属性などとあわせ、任意のスタイルや言語指定などが可能になります。利用法として、ブロックレベル要素のdiv要素と似通っていますから、使い分けには十分注意が必要です。
また、span要素を使用する前に他の適切な要素がないか確認が必要です。
例えば、特定箇所のテキストに色を付ける場合、強調ならばstrong要素を使うべきです。
|
|
A8.net
|ＴＧ−アフィリエイトプログラム|アクセストレード|LinkShare(リンクシェア)
|
バリューコマース|TrustClick
|
|
|
|
|
|
||各ショップお勧め品
