マテリアルデザインのスタイルガイドを見ていたら、ボタンの高さは36dpとあり、さらにクリッカブルな領域は48dpにするという記述を見つけました。
https://material.io/guidelines/components/buttons.html#buttons-style
だとすると、button要素内に透明の領域を‥‥、とかspanやdivなど親要素つけてそこに判定を‥‥、というよりはlabel要素使うのがマークアップとしては素直かな？と思いました。
先頭のsubmitボタンはクリック（タップ）しなくてもclickイベントが発火する時がある
発生する条件は、テキストフィールドなどでEnterキーやGoボタンなどを押下したときです。その場合、直接formに対してsubmitイベントが走るかと思いきや、フォーム内のsubmitボタンを探してクリックイベントを発火させていました。 “先頭のsubmitボタンはクリック（タップ）しなくてもclickイベントが発火する時がある” の続きを読む
ブラウザーのアクセシビリティチェックツール
Web Accessibility Advent Calendar 2016の14日目の記事です。
普段は受託でウェブサイトやウェブアプリケーションの制作を行っていますが、制作時には気をつけているつもりでも、やはり抜けもあります。余裕がなくなってくるとなおさらです。実際には実装屋のみでできる範囲には限界はありますが、それでも、実装屋でもなんとかなる範囲だけでもやろうと思った際に、コード書くときの心構えだけではなかなかうまく行きません。
そういった面において、Developer Toolsなどで一緒にチェックできるツールというのは、ひとつの助けになるだろうということで紹介します。 “ブラウザーのアクセシビリティチェックツール” の続きを読む
Sublime Text の Gistパッケージ
便利っすよ。
Atomにも同様の機能ありそうですが、手が慣れているのでこっちでついつい編集してしまいます。
ざっくり使い方解説しますが、手取り足取り書かないのでこれ見て分かる人が興味あったら使ってみるのも一興かと。