D2D アクセシビリティ勉強会 ～WAI-ARIAでアクセシブルにしてみよう～
-
- いいね！16
SAWADA STANDARD DESIGN
@SawadaStdDesign
@SawadaStdDesign @_tsmd さんよりChromeのタブが複数選択できることを教わりまして、「multiselectable」な状態で「selected」なタブが複数あっても「expanded」ではない状態も存在することを体験しましたので。 #d2draft
2017-03-10 15:07:32
SAWADA STANDARD DESIGN
@SawadaStdDesign
@SawadaStdDesign w3.org/TR/wai-aria-1.…はSHOULDなので「必須」ではなく、同#aria-multiselectableはtablistに限る話ではないのでaria-expandedに関する言及がないことも納得。（今頃か #d2draft
2017-03-10 15:07:10
SAWADA STANDARD DESIGN
@SawadaStdDesign
tablistロールの要素にaria-multiselectableを使った際の子要素にaria-expandedは必須か？という問いに対しては「必須ではないがtabpanelの開閉状態を示すために使う"べき"」という答えになりました。 #d2draft （WAIには聞かずじまい
2017-03-10 15:06:48
SAWADA STANDARD DESIGN
@SawadaStdDesign
閲覧者の方から指摘がありましたので、スライドの一部（P.17、P.23、P.30、P.77）を加筆修正しました。 #d2draft slideshare.net/nozomisawada96…
2017-03-09 09:16:22
みるく/milk
@milk54
けど、今回のアコーディオンは 澤田さんが返事されているように role="tab" にするより元の要素のセマンティクスを優先すべきでした。 #d2draft
2017-03-08 16:02:14
みるく/milk
@milk54
グループDのこの問題、@shima_x_o さんは role="tab"が原因だと思われてましたが、そうではなく aria-hoge の付ける位置を変えとaria-controlsを使う事で開閉状態も読み上げます。jsdo.it/milk55/mzu0 #d2draft twitter.com/luchino__/stat…
2017-03-08 15:58:34
るっちん
@luchino__
ただ、アコーディオンにロールでtabを追加しても、読み上げでアコーディオンの時のように「下位項目が隠されました」とは読んではくれなかった #d2draft
2017-03-05 18:07:11
SAWADA STANDARD DESIGN
@SawadaStdDesign
宿題「アコーディオンUIに対してtablistロールを使ってもよい？」 回答：元の要素のセマンティクスを優先すべき（見出しをボタンにしてる等）場合はNG。元の要素のセマンティクスを優先する必要性が低い（divとか）場合はOK。 #d2draft
2017-03-08 01:02:08
SAWADA STANDARD DESIGN
@SawadaStdDesign
宿題「tablistロールで定義されるタブを複数同時に開くことはアリなのか？」 回答：aria-multiselectable属性を設定すれば、アリです。その際aria-expanded属性が必須なのかどうかは、仕様上グレーな部分があるので後日WAIに聞きます。 #d2draft
2017-03-08 00:54:10
SAWADA STANDARD DESIGN
@SawadaStdDesign
「D2D アクセシビリティ勉強会 ～WAI-ARIAでアクセシブルにしてみよう～（3月5日）」で使用したスライドを公開しました。 #d2draft #a11y #accessibility slideshare.net/nozomisawada96…
2017-03-07 23:43:54
小畑 タカユキ🌴🍺👕⚽🥊
@kobatatakayuki
今日は #サイボウズ さんにて #アクセシビリティ な一日でした。 #d2draft pic.twitter.com/RHxcWMeDxK
2017-03-06 00:17:34
拡大
SAWADA STANDARD DESIGN
@SawadaStdDesign
歯切れが悪かったり、うまく答えられなかった点もありましたが、概ね理解してもらえたみたいで良かったです！（能天気 #d2draft
2017-03-05 23:01:22
るっちん
@luchino__
ただ、アコーディオンにロールでtabを追加しても、読み上げでアコーディオンの時のように「下位項目が隠されました」とは読んではくれなかった #d2draft
2017-03-05 18:07:11
るっちん
@luchino__
単一表示のものがタブ？複数表示できるものがアコーディオン？と思っていたがWAI-ARIAの原文と日本語の翻訳とは少しニュアンスが違うような感じがするとの意見もあり。回答は後日… #d2draft
2017-03-05 17:57:11
トミー
@SaekiTominaga
「タブ」とは何かという話。WAI-ARIA仕様を確認中。 momdo.github.io/wai-aria-1.1/#… #d2draft
2017-03-05 17:51:45
SAWADA STANDARD DESIGN
@SawadaStdDesign
もくもくタイム（あと5分！！ #d2draft pic.twitter.com/B3oGXMKgig
2017-03-05 16:30:37
拡大
トミー
@SaekiTominaga
Windows 10 でデフォルトで読み上げソフトが入っているのは知らなかった。設定から「ナレーター」を有効にすると。 #d2draft pic.twitter.com/yMm5bg42hl
2017-03-05 16:16:14
拡大
SAWADA STANDARD DESIGN
@SawadaStdDesign
「タブメニューと新着情報」か、「アコーディオンと新着情報」のどちらかにWAI-ARIAを足して、アクセシブルにする！ #d2draft
2017-03-05 15:30:46