Creative for Life !

バドミントンクリエイターを目指す学生のブログ

「公開アップルップル社内勉強会 Vol.25」に参加しました

6月20日(月)にベースキャンプ名古屋で開催された、株式会社アップルップル主催の社内勉強会へ参加しました。勉強会では発表者の方々がそれぞれのテーマで、仕事の中での体験や経験をもとにためになるお話をしていただきました。

今回はマークアップエンジニアの森田さんがお話された「マークアップの最適解を見つける方法」が特に印象に残っていたので内容を紹介しながら思ったことをまとめたいと思います。

マークアップの本質

Webアクセシビリティからみるマークアップ

マークアップはどんなデバイスで見ても全ての人に伝わるように思いをとどけること

ただコードを仕様書通りに書いてもその内容がすべての人に伝わるとは限りません。マークアップの先にあるWebをみる人たちにちゃんと伝えたい思いをとどけられることが重要になってきます。そのためにはWebアクセシビリティに対しても理解を深めていく必要があります。たとえば書いたものがスクリーンリーダーを使っても伝わるのか、RSS/リーダーから見たときに表示されない重要な情報がないかなど、きちんと伝えるためには仕様書以外にも注意する点はたくさんあります。

何を基準にするかで最適解をみつける

マークアップに正解はない

マークアップしている人ならば誰もが悩むのがコードの書き方です。liタグにするかolタグにするかなど悩みどころはたくさんあります。正しいと思うものが複数あった場合には何を基準にするかを事前に決めておくことで迷うことなく最適解をみつけることができます。主な基準としては、"W3Cの仕様書","Webアクセシビリティ","SEO"の3つをベースとして優先順位を決めておくとマークアップがしやすくなります。

マークアップの最適解とは

RSS/リーダーから"要素の重要性"を知る

RSS/リーダーのツールはそれぞれ見る人に重要な部分を抜き出して情報を表示してくれます。その重要な部分はRSS/リーダーによって基準が異なります。その違いをみるとマークアップの構造やタグの使い方に注意する点が見えてきます。

Safariのリーダーを使うとBODYタグ直下のaタグは表示されません。これは、W3Cの仕様を基準にリーダーが重要ではないと判断したためです。ブログの最初に目次などを作ってリンクを貼る際には気をつける必要がありそうです。

スクリーンリーダーから"要素の解釈"を知る

スクリーンリーダーを使うと同じ見た目のデザインでもタグの使い方によって解釈の仕方が違うことがわかります。liタグではリスト数を読み上げてくれますが、olタグでは読み上げてくれないのでスクリーンリーダーを使う人にはどこまで続くのか分からずに読むべき内容か判断ができなくなってしまいます。サイトをみるだけではそういった解釈を知ることはできません。スクリーンリーダーを使ってタグがどのような解釈をしているのかを知ることでどのタグを使うのが最適なのか判断することができます。

おわりに

勉強会は終始和やかなムードでプレゼンも分かりやすく内容も理解しやすかったです。マークアップの重要性をRSS/リーダーから読み取っていくという考え方は自分には思いつかなかったので、参考にして様々な視点でマークアップを考えていくきっかけにしていきたいです。

株式会社アップルップルが主催する社内勉強会は毎月第3月曜日にベースキャンプ名古屋で行われています。社外の方でも参加できるみたいなので興味がある方はぜひ参加してみてはいかがでしょうか?

【勉強会情報のリンク】 公開アップルップル社内勉強会 - Doorkeeper


blog comments powered by Disqus
桂川涼伊の画像

桂川涼伊(Katsuragawa Ryoi)

Badminton Creator

バドミントンクリエイターを目指す放送大学4年生。
バドミントンのコーチを5年間努めた経験を活かし、バドミントンのWebサービスやアプリの制作に取り組んでいます。

エントリーリスト

お探しの記事は見つかりませんでした。

カテゴリーリスト

タグクラウド