マークアップの最適解はまだ見えない

HTML5 Experts.jpにマークアップについて書いた記事を起稿しました。

「続」とついてるのは1つ前に起稿した記事と同じく「MarkupCafe」からの内容なため。

MarkupCafeはhtml5jのマークアップ部の取り組みの一つで、お題となるデザインに対してグループワーク的な感じでマークアップを考えるイベント。

対象が

となってるんだけど、毎回すっごく詳しい人が紛れてて「そんなやり方があるのか…」と思わせるマークアップが出てくる。

このイベントの形式はイベントじゃなくてもできることなので、近くの人を集めてやってもかなり面白いと思う。
オフラインで集まらなくてもjsdo.itのようなサービスを使ってソーシャル上でやってもいい。

最初は「マークアップ大喜利」みたいなちょっと軽いノリにしたら盛り上がりそう。

マークアップについて思うこと

個人的に思ったこと。

前回のMarkupCafe#1ではnav、article、section、addressなんかの、使いどころ自体が難しい要素に焦点を当てていたと思う。
今回は使い方とか具体的なことじゃなく、アクセシビリティとかユーザビリティっつーポイントに焦点を当てていたように感じた。

参加者が特に意識してたと思ったのは「スクリーンリーダ」など音声による読み上げ。
「読み上げる際にノイズとなるものは擬似要素で追加する」とか、フォームでは「注意事項は入力項目の前に置く」とか。

あと今回のイベントでは今まで自分になかった考え方が色々あって尊敬に近いものを感じた。

この考え方はかなり衝撃というか軽い感動を覚えた。
そもそもHTMLは文書構造を表すためのもので、見た目はCSSでというのが今の原則なはずだ。
そう考えるとこの考えもかなり合点がいくというか、むしろ当たり前にすら感じてしまう。

ただCSSでスタイルをつけるにしても、今のHTMLとCSSの機能的には順番通りにマークアップするほうが色々と早い。

Flexboxが普通に使えるようになれば、あるチーム(というかmyakuraさん)がやってたように見た目と構造の分離をもっと意識したマークアップが主流になるのかなーとうすーく思ってる。

マークアップを綺麗にちゃんと(セマンティックに)書く理由って”マシンリーダブル”にして検索エンジンにちゃんと解析してもらうとか、文書を再利用しやすくするっていう観点からだと思ってたけど、”アクセシビリティ”っていう軸も大事だなと。

ダレのためのアクセシビリティかは時と場合によるけど、そのときに一番合ったマークアップができるようにちゃんと勉強しておけばいいんじゃないかな。