AccessKey

accesskey や tabindex(navindex) は今までどうにも使う気になれなくて敬遠していたのだけれども、WAIで奨められている事なので（優先度3だが）導入を検討してみる事にした。
しかしただ付けただけでは、全くその存在にすら気が付かない事が判明。メニュバーのように括弧付きでキーが明示されると助かるのだが。というわけで作ってみる。

if(document.getElementById){

 var objAnc = document.getElementsByTagName("a");

  for(i=0;i<objAnc.length;i++){ 

    if(objAnc.item(i).accessKey){

      objKey = document.createElement("kbd");

      txtKey = document.createTextNode(objAnc.item(i).accessKey.toUpperCase());

      objKey.appendChild(txtKey)

      objAnc.item(i).appendChild(document.createTextNode("("));

      objAnc.item(i).appendChild(objKey);

      objAnc.item(i).appendChild(document.createTextNode(")"));

    }

  }

  document.styleSheets.item(0).addRule('a kbd','text-decoration: underline');

}

label やら input やらは面倒なので今回は省略。と言うか単純に a[accesskey]:after{ content: "(" attr(accesskey) ")"; } で済む話だな、これは。IEには無視されるけど。
しかしいざ設定してみると、面白いほどブラウザ側のメニュバーと競合してしまう。[alt]キー以外にアクセスキー用のキーを割り当てる事は出来ないのだろうか。手持ちのブラウザを片っ端から開いてみると、メニュバーと確実に競合しないのは

• J
• K
• Q
• X
• Y
• Z

のたったの6種類だけだった。これでは当分使う気になれない予感。