タグ

Accessibilityとあとで読むに関するhooooopのブックマーク (6)

  • お前らはまだ img タグの alt 属性の付け方を間違っている - Qiita

    1行で alt属性は、「全ての 画像をそのalt属性のテキストに置き換えたときにページの意味が変わらない 」ようにつける。 (HTMLの標準規格書より) マジでこれに尽きる。 具体例 例1:ロゴ ❌ 間違ったマークアップ

    お前らはまだ img タグの alt 属性の付け方を間違っている - Qiita
  • キーボード操作を意識したHTML/CSSコーディング

    この記事は 「Webアクセシビリティ Advent Calendar 2020」 5日目の記事です。 アクセシビリティ Advent Calenderの記事を寄稿するにあたり、少しの工夫であらゆるユーザーに対して優しいWebサイトを作れるようなHTML/CSSコーディングの方法についてまとめました。より多くの人にとって優しい・使いやすいWebサイトを作ることは訪れてくださるユーザーの方々だけでなく、クライアントにとってもユーザーの機会損失を防ぐことができるので多大なるメリットがあります。(よくコードが適当でもデザインが見えていれば良いって意見を聞くけれどそんなことはない) ただ、アクセシビリティを意識したHTML/CSSコーディングについてのまとめだと内容量が非常に多くなりZennなら記事よりで出したほうがベターになってしまうので、今回は数あるアクセシビリティの視点から「キーボード操作で

    キーボード操作を意識したHTML/CSSコーディング
  • 「この機能のアクセシビリティどうしよう」と思ったら

    こんにちは、この記事は Webアクセシビリティ Advent Calendar 2020 の6日目です。 すこし前に、同僚のエンジニアに「Webアプリケーションにドラッグ&ドロップを使う機能を作ろうとしているんだけど、アクセシビリティは何をすればいいのかわからない」という相談をされる機会がありました。そのときの回答が、実はアクセシビリティを考える上ですごく大事なことだなと思ったので、ちょっと文章化してみることにしました。 相談されたのは「新しい機能で直感的な操作を実現するためにドラッグ&ドロップを使いたいが、アクセシビリティチェックをパスできない気がする」というような内容でした。たしかに私の会社で運用しているチェックでは、キーボードやスクリーンリーダーによる動作チェックを行っているので、それらではドラッグ&ドロップの操作ができそうには思えません。 彼のこの相談内容からは「良いものを作ろう」

    「この機能のアクセシビリティどうしよう」と思ったら
  • アイコンと用途・代替テキスト対応表を作った話

    この記事は「Webアクセシビリティ Advent Calendar 2020」 13日目の記事です。 「虚空」について 見える人には見える、見えない人には伝わらない、「虚空」という存在をご存知でしょうか。 さっき会社で、アイコンフォントだけがリンクやボタンになっていてテキストノードがないものを「虚空」と呼ぶことになった — Rikiya Ihara (@magi1125) March 1, 2019 会社とは freee 株式会社のこと。 関連リンク:freee アクセシビリティー・ガイドライン「アイコン」 アイコンは、要素の機能や意味を図で表すことで直感的な操作や伝達を助けてくれるものです。 しかしアイコンにテキストが併記されておらず、アイコン画像に代替テキストが付与されていないと、画像が見えない人にはそれが何を表すかが伝わりません。操作可能な要素なのに、スクリーンリーダーでは意味の分か

    アイコンと用途・代替テキスト対応表を作った話
  • アクセシビリティからデザインを学ぼう

    福岡のWebアクセシビリティ/フロントエンドエンジニア。株式会社ディーゼロ所属。Webにインクルーシブな未来を夢見てる人。よりセマンティックでアクセシブルなHTMLをマークアップできるように開発者を手助けするmarkuplintというオープンソースツールを個人の活動として開発しています。 これはエンジニアである僕がアクセシビリティを学ぶことによりデザインの知識と理解が深まったという経験談です。もしも今、あなたがデザインに関わっていく上で物足りなさやスキルの向上に伸び悩んでいるのであれば、アクセシビリティの知識がその助けになるかもしれません。広範囲でしかも大袈裟な話に聞こえるかもしれませんが、気になったところからちょっとずつ覗いてみるだけでもいいと思います。 アクセシビリティとは Accessibilityは英語なので人によって訳や解釈が若干異なりますが、これから話すアクセシビリティは、一般

    アクセシビリティからデザインを学ぼう
  • 目の見えない人との歩き方とバリアフリー図書|mjmjsachi|note

    これは「Webじゃないアクセシビリティ Advent Calendar 2018」19日目の記事です。いずいずさんから紹介いただきました、まじまじ(@mjmjsachi)です。高知市でウェブやDTPのデザインをしています。 先日、高知の図書館文化施設オーテピアで開催された「ルミエールフェスタ」に行ってきたので、そこでの体験や感じたことについて書きます。 ルミエールフェスタとはルミエールフェスタは、視覚障害のある方の日常生活をサポートする道具の展示販売や、盲導犬教室、バリアフリー映画の上映など様々な催しが行われるイベントです。 “日一のバリアフリー図書館”オーテピアでの開催ルミエールフェスタの会場となったのは、今年7月にオープンしたばかりのオーテピア。「日一のバリアフリー図書館」を掲げており、館内には点字ブロックが設置されていたり、車椅子の方、聴覚障害、精神障害、知的障害のある方、高齢

    目の見えない人との歩き方とバリアフリー図書|mjmjsachi|note
  • 1