javascript無効にしたときのユーザビリティとかについて
社内で話した内容で気づけてよかったことなのでまとめてみる。自戒も込めてます。
- 最近はjavascript無効な環境とかに対して優しくする意識はないのではないか
- SPAとかなんかjavascriptあり気なんだしでかいFlash１つ置いててiPhoneで見る場合のと同義っぽい（※SPAをdisってる訳ではない）
- javascriptでガッチリ組みすぎてるのもアレだけど、とはいえ今のレイアウトはjavascriptありきのものばかりだよね
- そうなるとjavascriptが動作してなくて崩れてたとしても情報はちゃんと見せてあげたい
- リッチな表現はjavascriptにのみ任せて、それ以外の基本動作は抜きでもちゃんと機能するようにしたい
- 以下例みたいな考え方をスタンダードにしたい
- アコーディオンは通常時は出しておき、javascript読み込みで非表示にする
- ローディングとかを入れる時、ローディング自体をすでに出しておきsetTimeOutで消えるみたいな処理にしない（消えなくなる）
- Googleとかのウェブフォントも極力js読み込みなどを避ける
- javascriptで動作しないと表示しないテキストをやめる（重要なやつだと特に）
- text()とかで出来る限り入れない・表示非表示で切り替える。
- formのバリデーションはブラウザのバリデーションも意識してやる（最低限required付けるとか）
- WAI-ARIAについても考えておく必要はある
- javascriptバリバリ使っているサイトだったら最低限の礼儀としてnoscriptタグをちゃんと使おう
結局のところマークアップなりの時点でHTMLの構造をしっかり作れという感じなのですが、デザインでもjavascript使えて当然なリッチなものも多いのでその辺意識しないと結構大変だなと思うようになってます。
まあ結局ケースバイケースでjavascriptやれる部分はjavascriptでやるという部分はやっておき、万一のことはnoscriptなりできっちり表示しといたほうがいいよなと感じます。
というか最近フロントエンド界隈でのフレームワークだのビルドツールだのどうだこうだの話もありますが、まずは根本の話をしませんか、という気持ちがあります。こちらからは以上です。