ハンバーガーメニューの奥の深さ

みなさま、こんにちは。

前回のコーディングでは「ハンバーガーメニュー」を後回しにして

制作を進めていたのですが、

そのつけが回り、ハンバーガーメニューの奥深さを思い知ることになりました。

ハンバーガーメニュー

1. PC版では、グローバルナビゲーション→SPでハンバーガー
2. 初めからハンバーガーボタン

のパターンがあったり、

アコーディオンメニューと組み合わさったり、

いろいろございますね～。

すべてを理解するのは苦しいと思いますが、

一度じっくり取り組む価値はあると思います。

 

一気に「エンジニア」っぽくなってきた

スクリーンリーダーとは視覚などに障害があるユーザーにために

スクリーンに表示させる項目を読み上げるソフト、のことです。

なるほど。「人に優しいエンジニアであれ」。ですね。

そして。

WAI-ARIAとは

「WAI-ARIA」を利用してHTMLコーディングだ、「aria-contorols」で

コンテンツが制御されている要素を識別（！？）だとか、

？？？

「aria-controls」の使いかたはわかったけど、

「aria-expanded」は？

ハンバーガーメニューをよりカッコよく

よりカッコよくするためには、スマートなアニメーションが欠かせません。

アクセシビリティの向上も狙いたいところです。

「::before」「::after」をうまく使ったcssでアニメーションできたら

かっこいいですよね。

終わりがないくらい気になるところがありますが、

 
でも、わかりやすかった。