A11Y Style Guide
This application is a living style guide or pattern library, generated from KSS documented styles...with an accessibility twist. No matter your level of development or accessibility expertise, there are ways to help contribute to the a11y style guide. Why did this project start? We wear a lot of hats as front-end developers. Depending on the client or company you work for, you may be the designer,
WAI-ARIA対応のタブメニューを4種スクリーンリーダーで読み上げた検証結果2 - White Stage
WAI-ARIA対応のタブ型 UI を4種スクリーンリーダーで読み上げた検証結果2 WAI-ARIA対応のタブ型 UI を4種スクリーンリーダーで読み上げた検証結果1の検証2で使わせてもらったAccessible jQuery-ui Components Demonstrationでは、PC-Talker7/Internet Explorer11の環境でキーボード操作が出来ないという不具合がありましたので、HeydonWorks | The works, workings and reckonings of HeydonのPractical ARIA Examples「Simple ARIA tab interface」を使用させていただき、それを Tabs | jQuery UI(Query UI - v1.12.1 - 2016-09-14 )と同じWAI-ARIAの記述になるよう改変
WAI-ARIAの考え方と使い方を整理しよう
（※ P.17、P.23、P.30、P.77を加筆修正しました。2017-03-09） 2017-03-05（日）にサイボウズ大阪オフィス セミナールームにて行われた「D2D アクセシビリティ勉強会 2017」でのスライドです。
Developer's guide to accessibility mechanics
From The Front, Bologna 2016 @LeonieWatson Platform controls Role is "checkbox" Accessible name is "Bold" State is focused, checked, focusable Web control <input type="checkbox" id="bold"> <label for="bold">Bold</label> Role is "checkbox" Accessible name is "Bold" State is focused, checked, focusable HTML Accessibility API Mappings (AAM) The relationship between platform objects and web objects is
既存 Web アプリケーションのアクセシビリティを向上させるときによくあるヤツと対応方針
アクセシビリティ向上メモ 最初から考慮されているのが一番ですが、そうでもなかったプロダクトに手を入れるときのあるあるを記録します。既存プロダクトはモノが出来上がってしまっているため根治的なリファクタリングよりも基本的には省力で済ませたいので、今回書いた対応方法も完璧よりは省力路線です。 HTML やらセマンティクスに関する知識はそれなりにあるつもりでしたが、AT やマシンリーダビリティを念頭に勉強し直すと自分で作ったものも至らなかったなと振り返らざるを得ない今日この頃。初期設計のときの考慮範囲が拡がったように思うので善きかなです。 各項目について、もっと良い解法や誤り等あれば twitter とかでご指摘ください。 1. 画像に alt 属性がない場合 付けましょう。付けます。はい。 昔から基本とも言うべき、HTML/CSS 書きとしては耳にたこができるほど言われてきたことなので今更感もあ
Blogリデザインしてみた - Archiva
Make a note of it: Web tech, montaineering, and so on. version.3.0のスクリーンショット Ver.3.0 なのです。Ver.2.1にしたのが2007年だったようなので、実に8年ぶりの改装となります。これだけ長いと流行り廃りも激しくて面白い。 解りやすいのがモバイル事情で、iPhone3Gが出たのが2008年7月。 日本初のAndroid携帯(HT-03A)が出たのが2009年7月。 jQuery mobile 1.0.0 RC1 が出たのが2011年9月。 貴サイトのモバイル・ユーザビリティに問題がありますよー、とウェブマスターツールから警告のメールが来たのが、この2月末。 あとはSassが使われ出してから3年以上経ってるとか、CSS3の接頭字もだいぶ外れてきたよなーとか、非プログラマがGulpとかGitみたく黒い画面を使うシ
aria-live: the good, the bad and the ugly
Almost all web sites and web applications today are heavily reliant on JavaScript to provide rich interactions for the user. But how can we make these interactions accessible for assistive technologies such as screen readers? The answer is WAI-ARIA – and in many cases, the aria-live property. The presentation will explore the use of WAI-ARIA and the aria-live property to alert screen readers to ch
DRAGON99BET: Daftar Situs Judi Slot Online Gacor Mudah Menang
⚡️ Gates Of Vigor (Zeus), 🍭 Sweet Bonanza, 🎰 777 Mega Deluxe, 🤡 Super Joker. Selamat datang di situs slot online gacor hari ini Dragon99bet yang menyediakan beragam kumpulan Daftar Nama Situs Judi Slot incaran bettor terbaik dan mengandalkan fasilitas kami sediakan untuk memberikan informasi seputar judi slot online terbaik. Sebelum bisa menjalankan slot online yang sering kasih jackpot tentuny
Accessible Footnotes with CSS — SitePoint
I was playing with CSS counters the other day and thought about using them to deal with footnotes. According to Plagiarism which has a surprisingly long entry on the matter, footnotes are: […] notes placed at the bottom of a page. They cite references or comment on a designated part of the text above it. You often see them in papers when the author wants to add a piece of information or cite a ref
WAI-ARIAで実現するマルチデバイス環境のWebアプリケーション
2015年5月14日に開催された書籍出版記念イベント「Webサイト設計・UI実装・アクセシビリティのモダンアプローチ」のセッション2で使用した資料です。Read less
W3CがARIA in HTMLの最初の草案を公開 | アクセシビリティBlog | ミツエーリンクス
4月14日、W3CはARIA in HTMLの最初の草案を公開しました。この仕様はHTMLでWAI-ARIAを使った場合に、制作者と適合性チェッカー（Conformance Checker）が守らなくてはならない要件をまとめています。 HTMLでWAI-ARIAを利用する際の要件は、HTML5では仕様そのものに記述されています（3.2.7、日本語訳）。しかし、2015年4月13日付とされているHTML 5.1の草案では、該当部分（3.2.7）はARIA in HTMLとHTML Accessibility API Mappingsを参照するように変更されています。HTML Accessibility API Mappingsはブラウザーなどの要件を定めた仕様ですので、制作者は今後、ARIA in HTMLを参照してゆくことになるでしょう。 現時点ではHTML5とARIA in HTMLに大
WAI-ARIA - an introduction to accessible rich internet applications (1 day workshop) / Darmstadt / 22 January 2015
WAI-ARIA - an introduction to accessible rich internet applications (1 day workshop) / Darmstadt / 22 January 2015 This document introduces the Accessible Rich Internet Applications (ARIA) specification. It discusses: 1) The need for ARIA to make complex web applications accessible to assistive technologies like screen readers, as traditional HTML elements may not adequately convey semantics. 2) C
Accessible Rich Internet Applications (WAI-ARIA) 1.0 日本語訳
[contents] Accessible Rich Internet Applications (WAI-ARIA) 1.0 W3C Recommendation 20 March 2014 This version:http://www.w3.org/TR/2014/REC-wai-aria-20140320/Latest version: http://www.w3.org/TR/wai-aria/ Previous version:http://www.w3.org/TR/2014/PR-wai-aria-20140206/Editors:James Craig, Apple Inc. Michael Cooper, W3CPrevious Editors: Lisa Pappas, Society for Technical Communication Rich Schwerdt
Using WAI-ARIA Landmarks - 2013 - TPGi
Adding ARIA landmarks to your existing site, or to a site you are developing, provides useful global navigation features and aids understanding of content structure for users. Over time the necessity of explicitly assigning landmarks will lessen as browsers build in ARIA landmark roles to newer HTML element semantics. There is widespread support for ARIA landmarks in browsers and screen readers. H
ARIA Techniques | Techniques for WCAG 2.0
ARIA Techniques for WCAG 2.0This Web page lists ARIA Techniques from Techniques for WCAG 2.0: Techniques and Failures for Web Content Accessibility Guidelines 2.0. Technology-specific techniques do not replace the general techniques: content developers should consider both general techniques and technology-specific techniques as they work toward conformance. Publication of techniques for a specifi
I am mitsuruog | HTML5のセマンティックとWAI-ARIAでWebの未来がおもしろい件
このエントリはHTML5 Advent Calendar 2013 ３日目の記事です。 前後の記事はこちらです ← youhei.iwasaki8 [iwahei の日記]geolocation api を使った位置情報取得 → あおいたん [GCG 研究所]手元にあった HTML5 アプリを FxOS と Tizen で動かしてみるの巻 「Internet of Things」と呼ばれる「モノがインターネットする」時代のコンテンツは、人が目にして理解できる程度では十分ではありません。すべてのモノが理解できるコンテンツ、その鍵は HTML5 が持つ「セマンティック」と「WAI-ARIA」での仕様の標準化だと思います。 このエントリでお伝えしたいこと。 たまに目にする「role=""」の意味を理解して欲しい。 「aria-」で意味付けすることで、ちょっと得することがある。 「セマンティック」
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://pauljadam.com/demos/ariasupport.html
FRESH! と AbemaTV の WAI-ARIA 事例
Extended HTML - WAI-ARIAとMicrodataでHTMLを拡張する
http://blog.e-riverstyle.com/2014/12/svg.html
