Accessibility Visualizerを活用したアクセシビリティチェック
Webページのアクセシビリティチェック用のツールとして、Accessibility Visualizerというものを作っています。これはブラウザ拡張として提供され、アクセシビリティに関係する情報...
18
5
Comment0
22 search resultsShowing 1~20 results
Stocked
You need to log-in
Qiita FM #63 『「誰もが使える」サービスへ：アクセシビリティで開発者の目が変わる理由』書き起こし
Qiitaのポッドキャスト「Qiita FM」にゲストとして呼んでいただいた回を、許可を得たうえで音声メディアの代替として書き起こしテキストを投稿します。 前回の分に関しては Qiita FM ...
2
0
Comment0
Qiita FM #64 『日常に潜む壁：気づきが変えるアクセシビリティの視点』書き起こし
Qiitaのポッドキャスト「Qiita FM」にゲストとして呼んでいただいた回を、許可を得たうえで音声メディアの代替として書き起こしテキストを投稿します。 #62 流され続けて辿り着いた「全部や...
3
0
Comment0
Qiita FM #62 『流され続けて辿り着いた「全部やる」エンジニアデザイナー』書き起こし
先日、Qiitaのポッドキャスト「Qiita FM」にゲストとして呼んでいただき、いろいろとお話をしてきました。全3回配信される予定です。 現在、音声メディアでしか配信されていないため、許可を得...
3
1
Comment0
Webアクセシビリティ用語「アクセシブルな名前（アクセシブルネーム）」の解説
「アクセシブルな名前」「アクセシブルネーム」という用語は、WebアクセシビリティやWAI-ARIAの解説にしばしば登場します。しかし、英語の「Accessible Name」をそのままカタカナ混...
22
18
Comment0
Webアクセシビリティにおける、ロール（role）の解説
アクセシビリティを考慮したWeb開発の話題で、しばしば 「ロール（role）」 というものが登場します。 role="button" のような role属性 として紹介されていることもあります。...
39
25
Comment0
背景に画像のある場所で、コントラスト比の基準を満たす
文字の色と背景色の間には、一定以上のコントラスト（明るさの差）がなければ、文字の可読性が低くなります。特に老眼や弱視など、見えづらさを抱えている人は、文字の色のコントラスト比の低さの影響を受けや...
9
4
Comment0
Webサイトのアクセシビリティにどう向き合う？
11月23日に開催されたMTDDC Meetup Tokyo 2024で、「Webサイトのアクセシビリティにどう向き合う？」というタイトルで登壇しました。参加者の皆様からの投票で、この日の3人の...
38
34
Comment3
リンクの下線は消してもいいの？
WCAGの達成基準 1.4.1 色の使用には、以下のように書かれています。 達成基準 1.4.1 色の使用 (レベル A) 色が、情報を伝える、動作を示す、反応を促す、又は視覚的な要素を判別する...
208
112
Comment5
aria-labelでなんでも解決しようとしない
「スクリーンリーダーではこう読んでほしい」という意図で、aria-label属性が使われている場面をたまに見ます。 <!-- 注意: これは適切でない例です。理由は後述します -->...
40
21
Comment0
role 属性とは、aria-* 属性とは、WAI-ARIA とは、いったい何なのか、いつ使うべきなのか
最近、いくつかの場面でWebアクセシビリティについて、コーディングに関する技術的な説明をする機会がありました。そのなかで、そもそもWAI-ARIAというものが、どういう立ち位置のものなのかがわか...
112
89
Comment1
「絶対にdisabled属性を避けて、aria-disabled属性を使わなければならない」わけではありません
最近、「アクセシビリティを向上させたいなら、HTMLの disabled 属性ではなく、aria-disabled 属性を使うべき」という主張を見かけますが、本当にそうなのでしょうか？ disa...
273
123
Comment22
スクリーンリーダーの操作にはTab以外のキーも必要です
Webのアクセシビリティの確認としてスクリーンリーダーを使った動作確認もしてもらうと 「リンクとかボタンしか読まれず、見出しや説明文がスキップされてしまいました」 という報告をされることが時々あ...
107
61
Comment2
「住所は英数字もすべて全角で入力してください」はなぜそうなったのか
Webサービスのフォームに住所を入力するとき、丁目や番地などを入れる欄について、数字やハイフンを全角で書かなければいけない「全角縛り」をやっているフォームをよく見ます。半角文字を入力してしまって...
530
270
Comment31
入力欄のプレースホルダーって結局どうなの
入力欄のプレースホルダーの話をします。プレースホルダーというのは、フォームの入力欄で、ユーザーが入力するまでの間に表示されているテキストのことです。 <label>入力欄: <...
186
124
Comment0
macOS の VoiceOver で Web サイトのスクリーンリーダー対応をはじめよう
開発している Web アプリケーションをスクリーンリーダーでも扱えるようにするにあたって、 VoiceOver を使いはじめてみたら思ったより簡単だったので、やり方についてまとめてみます。 この...
31
16
Comment0
フロントエンドエンジニアがサーバーサイドエンジニアとペアを組む話
この記事は freee Engineers Advent Calendar の1日目です。 こんにちは。freee株式会社でフロントエンドエンジニアをしている @ymrl です。freeeでは給...
101
35
Comment0
Rubyの正規表現の/[\p{katakana}]/ ってなんなの
会社の人が書いたRubyのコードの正規表現で /[\p{katakana}]*/みたいなのがでてきて、なんだこれって思ったので調べた。 へー 'アイウエオ' =~ /\A[\p{katakana...
74
59
Comment8
フロントエンド開発における革命とスタイルシートの管理
こんにちは、freee株式会社 の @ymrl です。フロントエンドエンジニアなるものをしています。 この記事は freee Engineers Advent Calendar の2日目です。 ...
101
95
Comment0
HTML/CSSで簡単な吹き出しの作り方
社内向けに書いたドキュメントが好評だったので公開しちゃいます。 基本編1 本体と三角形を分けて実装します <div class="balloon"> こんにちはこんにちは！ <...
232
229
Comment3
22 search resultsShowing 1~20 results
Qiita is a knowledge sharing service for engineers.
- You can follow users and tags
- You can stock useful information
- You can make edit suggestions for articles