HTMLスタイルガイド
ボタン
ボタンタイプ
W3CのHTML仕様では、ボタンタグにはtype
属性が必要です。
// bad
<button></button>
// good
<button type="button"></button>
ボタンのロール
HTML要素にonClick
ハンドラがあるが、ボタンでない場合は、role="button"
。 この方がアクセスしやすいでしょう。
// bad
<div onClick="doSomething"></div>
// good
<div role="button" onClick="doSomething"></div>
リンク集
ブランクターゲット
リンクが新しいウィンドウで開くときは、rel="noopener noreferrer"
、つまりtarget="_blank"
を使用してください。 これは、JitBitによって文書化されたセキュリティの脆弱性を防ぐためです。
// bad
<a href="url" target="_blank"></a>
// good
<a href="url" target="_blank" rel="noopener noreferrer"></a>
偽リンク
リンクがJavaScriptのクリックイベントハンドラを呼び出すだけなら、buttonタグを使いましょう。
// bad
<a class="js-do-something" href="#"></a>
// good
<button class="js-do-something" type="button"></button>