HTML解体新書 輪読会 実施レポート vol.3

はじめに

こんにちは。ラクス フロントエンドチームの伊藤です。

週末、最強のリザードンに勝ってきました。
偶然にも(?)レベル100のニンフィアが手持ちにいたのでサクサクで快適でした。はかいこうせんの音が病みつきになってしまう・・・。

さて、今回は HTML解体新書輪読会 の実施レポートvol.3です。

読書範囲

今回の読書範囲は P106~P133(Chapter3-3 ~ 3-4の途中まで) です。

議論・意見交換

3-3 セクション

• 学んだこと

  • P115 aria-level属性で7以上のランク表現できるのを知らなかった

    • 現実的に7以上を使うことはなさそう

• 疑問に思ったこと

  • セクションを意識してコーディングした経験があまりないのですが、SEOとかアクセシビリティの観点で重要なのか？

    • コンポーネントレベルでもやれるところからやる、みたいな記事はありました

    • サービスによって重要度が変わってくるイメージ

      • web検索されるアプリケーションやサイトなど

      • 読み上げされることを意識するサービスなど

• その他（感想・共有など）

  • 読み飛ばしやジャンプ(p114)について、MDNとかもやってる、初期表示時にtabを押すとメインコンテンツまで飛ばしてくれるのが便利

    • この機能私は知りませんでした・・・

3-4 グルーピングコンテンツ

• 学んだこと

  • P122 hrタグ「段落レベルのテーマの区切りを表します」「この要素は線を表す目的で使うべきではありません」 今は使う機会無いけど昔線出すのに使ってた。。。

    • スクリーンリーダーで読ませると無意味な「区切り」の読み上げ多そう。

• 疑問に思ったこと

  • P128 ol要素 reversed属性やstart属性の存在を初めて知りました。実用例があったら教えていただきたい。

    • 順位などのカウントダウンなど？

• その他

  • ol = oredered list / ul = unoredered List とか何の略だか書いてくれればより分かりやすいと思った

    • 私も初見どっちがどっちかわからなくなりましたが、意味を知ってから悩まなくなりました

おわりに

回を追うごと全体的に、徐々にアクセシビリティへの意識が高まってきているような気がします。
BtoBだとあまり意識する機会は多くないですが、フロントエンドエンジニアとして押さえておきたいですね。

今後も隔週で輪読会を実施していきます。
次回開催は 12/12(月) になるので、それ以降にまた更新します！お楽しみに！

< 前の記事

次の記事 >

---

採用情報

https://career-recruit.rakus.co.jp/engineer_jobs/frontend_tokyo/

https://career-recruit.rakus.co.jp/career_engineer/

イベント情報

https://rakus.connpass.com/