ymrl

@ymrl

背骨が変な曲がり方しててずっと痛い。 UIデザイナー・フロントエンドエンジニア・アクセシビリティスペシャリスト共著書「Webアプリケーションアクセシビリティ」 Accessibility Visualizerとか作っています

316 Following444 Followers815 Posts

X X Bluesky

Is this your profile?Claim it and ymrl.dirty.social is yours.Claim profile

ymrl@ymrl· 13d

ワァ……

ymrl@ymrl· 14d

すいません本当にすいません

ymrl@ymrl· 23d

貰えるものは貰っとくかー

Fable 5が利用クレジット制に移行しました。$100 USD分のクレジットを無料でプレゼントします
Fable 5は7月19日までプロモーションとしてプランに含まれていましたが、現在は利用クレジットが必要です。中断なくご利用いただくために、$100 USD分の無料クレジットを受け取ってください。

クレジットを受け取ると、アカウントで利用クレジットが有効になり、すぐにご利用いただけます。プランの上限に達した場合にもクレジットをご利用いただけます。無料クレジットは9月17日に失効します。利用規約が適用されます
[後で][無料クレジットを受け取る]

ymrl@ymrl· Jul 10

駅の階段の上にある看板の写真。「顔認証も、アリゲイト」という広告の下に、「くだり」「のぼり」「のぼり」の表示。

ymrl@ymrl· Jul 7

いまどきのアルバイト採用、面接のかわりに自撮り動画を送らせるんだ

カフェバイトしませんか？
アルバイト募集
履歴書・面接不要！
自撮り動画を送るだけ
最短1日で内定が決まる！
LINEで友達追加
応募はこちら

ymrl@ymrl· Jul 4

「ライブリージョンのアナウンス」機能には今回、背景と文字それぞれの不透明度を設定できるようにして、文字の不透明度をデフォルトで100%としました。これまで半透明になっていた文字がくっきりと読めて、通知の「うるささ」の再現度が高まったはずです。 #AccessibilityVisualizer

Webコンテンツの上に、黒の半透明の長方形が被さっている。内部には白い文字で英文が書かれている
System Status: System Status: Processing data
System Status: System Status: Updating records

ymrl@ymrl· Jul 4

これまでAccessibility Visualizerは、inertを考慮した判定ができていませんでした。今回、inert属性またはCSSのinteractivityプロパティを、チップ表示やライブリージョン通知の判定条件に組み込みました。また、inertな要素には鬱陶しいほどに「inert」警告が表示されます #AccessibilityVisualizer

フォームのあちこちに「inert」の警告が表示されているスクリーンショット。英語で説明書きがある:
Form controls inside an inert subtree
Form controls placed inside a container with the inert attribute. They cannot be focused or edited, and they are removed from the accessibility tree.

ymrl@ymrl· Jun 10

Accessibility Visualizer 7.1.0をリリースしました。既にChrome/Firefoxのストアからインストールできます。このバージョンでは、ライブリージョンについて2つアップデートがあります。ひとつはaria-modalの取り扱いについて、もうひとつはariaNotify()への対応です。 #AccessibilityVisualizer

チェックの入った「ライブリージョンをアナウンス」チェックボックスの下に、一段インデントして小さい文字でチェックの入っていない「aria-modal外のライブリージョンも通知」と「ariaNotifyをアナウンス（β）」チェックボックスがある

ymrl@ymrl· Jun 10

6月がある

ymrl@ymrl· May 15

縦横比3:2の白い領域の中を、領域の縦の長さの5分の3の直径を持つ赤い円が動き回るので、それをなるべく中央に近いところで止めると高得点になるゲームです。 claude.ai/public/artif...

ymrl@ymrl· May 6

そして、やや毛色の違う機能ではありますが、押したキーを表示できるようにしました。デフォルトはオフです。キーボードでのWebの操作方法は、意外なことにあまり知られておらず、説明に苦労してきました。押したキーが表示されれば、多少は説明が楽なるかなと考えています #AccessibilityVisualizer

Shift + Cmd, Cmd, Cmd, Shift + Tab, Shift, Tab, Shift + Tab が縦に並んで表示されているブラウザのウィンドウの右上のスクリーンショット

ymrl@ymrl· May 6

これまではクロスオリジンポリシーにより、一部のiframe要素でAccessiblity Visualizerは動作しませんでした。この設計を見直して全てのiframeで動作できるようになりました。これにより、MDNやCodePenのサンプルをAccessibility Visualizerで確認できるようになりました。便利！ #AccessibilityVisualizer

MDNの「<button>: ボタン要素」の画面で、サンプル部分にあるボタンにAccessibility Visualizerがアクセシブルネームを表示している

ymrl@ymrl· May 4

健康的な連休生活を送っています

プラン使用制限Pro
現在のセッション
2時間49分後にリセット
100% 使用済み

ymrl@ymrl· Apr 26

ymrl@ymrl· Apr 12

設営完了してます #技術書典

技術書典のブース。「Accessibility Visualizerの本」と「アクセシビリティを考えはじめるための本」の見本やお品書きパネルがディスプレイされている

「Webアプリケーションアクセシビリティ」のアクリルスタンド、「Accessibility Visualizerの本」、「アクセシビリティを考えはじめるための本」

ymrl@ymrl· Apr 11

あしたの技術書典20オフライン会場のおしながきです。ブース番号は「う09」サークル名は「20 Hour Exception」です。お待ちしてます。 #技術書典

う09 20 Hour Exception

新刊
Accessibility Visualizerの本 800円本文60ページ
ブラウザ拡張機能「Accessibility Visualizer」の開発者本人による、Accessibility Visualizerはじめての、非公式な本。
2000人を超えるユーザーがいて、仕事に活用する人もたくさんいるのに、個人開発なので、ドキュメントが充分にあると言える状態にない。開発者本人しか知らないはずのことがたくさんある。
しかし、ちゃんとしたドキュメントを一人で整備するのはとても大変。そこでまずは気ままにエッセイとして書きました。この形式なら書けるので。
Accessibility Visualizerの様々な機能の話、開発中のエピソード、Webの技術、スクリーンリーダーの事情やWAI-ARIAの仕様など、Webアクセシビリティの深いところを彷徨う本です。

Accessibility VisualizerについてはWebサイトをご覧ください。
https://ymrl.github.io/a11y-visualizer/ja/

既刊（技術書典17 2024年11月）
アクセシビリティを考えはじめるための本
800円本文66ページ
「アクセシビリティ、って何？儲かるの？」「大事そうだけど、何からやればいいかわからない」「いつかやらなきゃ、とは思っているんだけど」……という人のための本です。
実は、アクセシビリティは、みなさんの身近にあふれています。特にインターネットやソフトウェアに関わっているなら、実はすでに誰かにとってのアクセシビリティを提供できているかもしれません。あるいは、ほんの少し手を加えればより幅広い人に届くものかもしれません。
コードは一行も出てきません。アクセシビリティについて、読んですぐに考えはじめられるようになれる本です。

タッチ決済(Visa, Mastercard)・現金使えます
技術書典アプリ以外でお支払いの方には電子版のダウンロードカードをお渡しします

ymrl@ymrl· Mar 27

20260327

ymrl@ymrl· Mar 26

Xプレミアムが1年間40%の割引
Xプレミアムをもう少し利用し続けたい方のために、ちょっとしたプレゼントとしてこちらの割引をご用意しました。
✔ ￥9,180 → ￥5,508（1年間）
✔ 1回限りの限定プロモーション
✔ Xプレミアムのすべての機能に引き続きフルアクセス可能
割引は、次の課金サイクル以降適用されます。
[プロモーションを利用する]
[続行してキャンセル]

ymrl@ymrl· Feb 12

旅先で寄りたい場所

ymrl@ymrl· Feb 11

とても寒い

りんごと桃を左右の手に持った「ももりん」（うさぎのキャラクター）の形をしたオブジェ。りんご・桃・お腹に水道の蛇口がある。胸のところに張り紙がある。背後に「ようこそ花と果物のまち福島へ」と書かれた看板がある。

ymrl@ymrl· Nov 27

最近オフィスの前の噴水が鳩の水浴びスポットになっててめっちゃいい

ymrl@ymrl· Nov 25

「大きくて摩擦係数の高いマウスパッドがほしい」って言ってたら @tdtds.jp さんに（有償で）作ってもらえて大満足

ベージュ色の革製のマウスパッドの上に、黒いLogicoolのマウスが置かれている。木目調の机の上で斜めに撮影してある。

ymrl@ymrl· Nov 17

これは明らかに飲酒運転やってる車

「ちいかわ」の「くりまんじゅう」のトミカ。奥にトミカの入っていた箱。トミカはボンネット部分が栗まんじゅうの顔になっている

ymrl@ymrl· Nov 2

#技術書典17 オフライン会場 [さ13] 20 Hour Exception お品書き画像です。「アクセシビリティを考えはじめるための本」を出品します。コードの出てこない、アクセシビリティという「視点」を獲得するための本です。 #技術書典オンライン販売はこちらです techbookfest.org/product/2KX3...