アクセシビリティを気にし出したエンジニアへ、強制カラーモードの紹介

2024/12/10 10 users エンジニア 紹介

この記事は、アクセシビリティ Advent Calendar 2024 - Adventar の10日目の記事です。 初めまして、たじまん です。zennのブログ投稿デビューします。 私はとある会社でアクセシビリティエンジニアという名前で、プロダクトチームのイネイブリングなどをするお仕事をしています。 このブログを書くことになったきっかけ... 続きを読む

共通管理基盤サービスに SAML 認証を導入した話 - freee Developers Hub

2024/12/09 13 users freee shikakun SAML おか 認証

こんにちは。 この記事は freee Developers Advent Calendar 2024 - Adventar 12/09(9日目)の記事です。 今日は「共通管理基盤開発チーム」の "にいおか" が担当します。 昨日は shikakun さんの freeeで1年間働いてわかった「ふつう」のアクセシビリティ - freee Developers Hub でした。shikakun さんが入社して1年弱... 続きを読む

freeeで1年間働いてわかった「ふつう」のアクセシビリティ - freee Developers Hub

2024/12/07 17 users freee shikakun ソフトウェアデザイナー 向上

はじめまして！ shikakun といいます。freeeのデザインシステムの開発に携わっている、ソフトウェアデザイナーです。2024年1月に中途採用で入社しました。 freeeで働くことを決めた理由のひとつは、freeeがアクセシビリティの向上に積極的に取り組んでいる印象を持っていたからでした。アクセシビリティとは、「（製品や... 続きを読む

UI 開発における ヘッドレス UI ライブラリの重要性とデザインシステムへの取り入れ方

2024/11/23 118 users ライブラリ 取り入れ方 ヘッドレス 開発 デザインシステム

昨今の Web 開発における UI はますます複雑化し、アクセシビリティの重要性が高まっています。ブラウザの標準機能だけでは実現できない複雑な UI を実装する際、アクセシビリティに関する誤った実装が原因で、ユーザー体験を損なう可能性があります。ヘッドレス UI ライブラリは、あらかじめアクセシビリティ… 続きを読む

アクセシビリティが考慮された React Aria のドラッグアンドドロップ

2024/09/07 51 users ドラッグアンドドロップ React Aria React

アクセシビリティが考慮された React Aria のドラッグアンドドロップ 2024.09.07 React Aria は Adobe により提供されている React 用のコンポーネントライブラリであり、アクセシビリティを最優先した設計となっています。本記事では、React Aria により提供されているドラッグアンドドロップ機能を紹介します。 ドラッ... 続きを読む

「絶対にdisabled属性を避けて、aria-disabled属性を使わなければならない」わけではありません - Qiita

2024/09/07 68 users Qiita ARIA スク HTML 主張

「絶対にdisabled属性を避けて、aria-disabled属性を使わなければならない」わけではありませんHTMLアクセシビリティWAI-ARIA 最近、「アクセシビリティのために、HTMLの disabled 属性ではなく、aria-disabled 属性を使うべき」という主張を見かけますが、本当にそうなのでしょうか？ disabled属性を使っていても、スク... 続きを読む

「Xbox Adaptive Joystick」は，Xboxのアクセシビリティへの考えが詰まったコントローラ用アクセサリ。ドイツで実機をお試し［gamescom］

2024/08/23 12 users gamescom xbox ゲーマー しょ 制約

「Xbox Adaptive Joystick」は，Xboxのアクセシビリティへの考えが詰まったコントローラ用アクセサリ。ドイツで実機をお試し［gamescom］ 編集部：Junpoco Microsoftが2024年8月21日（海外時間）に発表した新プロダクト「Xbox Adaptive Joystick」は，身体の動きに制約のあるゲーマーのニーズに応える形で設計されたジョ... 続きを読む

スクリーンリーダーの操作にはTab以外のキーも必要です - Qiita

2024/08/08 21 users tabキー 見出し Qiita 大抵 web

Webのアクセシビリティの確認としてスクリーンリーダーを使った動作確認もしてもらうと 「リンクとかボタンしか読まれず、見出しや説明文がスキップされてしまいました」 という報告をされることが時々あります。 これは大抵、スクリーンリーダーを起動して、Tabキーだけを繰り返し押してしまっていることによって起こり... 続きを読む

任天堂とアクセシビリティ

2024/07/10 621 users N-Styles 任天堂 質疑応答 株主総会 最初

先日、任天堂の株主総会が行われた。例によって詳細をまとめているので前回の記事をご覧いただきたい。 任天堂株主総会レポート2024 | N-Styles 株主総会レポートでも記載したが、質疑応答で最初に指名された質問者が「任天堂は視覚障害者対応が遅れているのではないか」と指摘し、私はこの質問に非常に驚いた。 なぜな... 続きを読む

デザインシステム浸透の取り組み：目安箱の運用とデザインシステム株主総会 - enechain Tech Blog

2024/06/20 23 users enechain Tech Blog 運用 目安箱 fix

はじめに なぜ民主化か 目安箱の設置と対応件数 デザインシステム株主総会の開催 第一回：前期の事業報告と今期の事業計画について 第二回：プロダクトAで先行して実装した新・共通UIと今取り組むべきアクセシビリティ 第三回：プロダクトBで取り組んでいたカレンダーコンポーネントのFIXまでのプロセス振り返りとユーザ... 続きを読む

文部科学省チャレンジクイズ：文部科学省

2024/06/12 13 users 文部科学省 050-3772-4111 100-8959

サイトマップ 災害関連情報 官公庁等リンク集 English キーワード 御意見・お問合せ プライバシーポリシー リンク・著作権について アクセシビリティへの対応について 文部科学省 〒100-8959 東京都千代田区霞が関三丁目2番2号 電話番号：03-5253-4111(代表) 050-3772-4111 (IP 電話代表) 法人番号 7000012060001 案内図 続きを読む

デジタル庁デザインシステムβ版

2024/05/30 660 users インタラクション ユーザビリティ UIコンポーネント 実装

デジタル庁デザインシステムは、スタイリングの考え方を提供するデザイン言語、情報の視覚表現とインタラクションを具現化するUIコンポーネント、ユーザビリティとアクセシビリティを踏まえた設計や実装のためのガイドラインから構成されるデザインアセットです。 デジタル庁のミッションである「誰一人取り残されない、... 続きを読む

少しの記述でユーザビリティやアクセシビリティを向上させるHTML/CSSテクニック集 – TAKLOG

2024/05/18 102 users 独断 TAKLOG 登壇 偏見 CSSテクニック

少しの記述・工夫でユーザビリティやアクセシビリティを向上させるHTML/CSSテクニックを独断と偏見で集めてみました。最近クローズドな場所で登壇を行ったのですが、そちらで話した内容を纏めたものにいくつか内容を追加したものとなります。 原則的にこのブログで取り入れられている手法だったり過去の記事で触れた手法... 続きを読む

アップル、目で iPhoneやiPadを操作するアイトラッキングを追加。乗り物酔い防止や振動で感じる音楽などアクセシビリティ機能強化 | テクノエッジ TechnoEdge

2024/05/16 21 users iPhone GAAD TechnoEdge サイエンス 振動

ガジェット全般、サイエンス、宇宙、音楽、モータースポーツetc... 電気・ネットワーク技術者。実績媒体Engadget日本版, Autoblog日本版, Forbes JAPAN他 アップルは、毎年5月に行われれる世界各地でアクセシビリティを考える一日（Global Accessibility Awareness Day：GAAD）に合わせ、障害を持つ人たちに新たな体験を... 続きを読む

HTMLを直接読み書きせず、スクリーンリーダーも使わずに、アクセシビリティを向上させられないだろうか（と思ってブラウザ拡張を作ってる）

2024/05/07 10 users 障壁 Webアクセシビリティ HTML スクリーンリーダー

HTMLを直接読み書きせず、スクリーンリーダーも使わずに、アクセシビリティを向上させられないだろうか（と思ってブラウザ拡張を作ってる） これまでの何年間か、Webアクセシビリティまわりのことをやってきた中で、「Webアクセシビリティに取り組む」上でいろいろな障壁を感じてきました。 「なぜWebアクセシビリティを... 続きを読む

アクセシビリティを考慮したUI/CSSフレームワーク・ライブラリ選定

2024/04/19 11 users CSSフレームワーク ライブラリ選定

BARフロントえんどう #2 「CSS Library / Framework」での登壇資料 続きを読む

テーブルの仮想スクロールとスクリーンリーダー向けのアクセシビリティ

2024/03/24 14 users DOM レンダリング テーブル 負荷 テクニック

Webアプリケーションで、大量のデータを表示したいときに使われる、「仮想スクロール」と呼ばれるテクニックがあります。 大量のデータを素直にDOMに挿入してしまうと、レンダリングの処理に非常に負荷がかかり、場合によってはブラウザをフリーズさせてしまったりします。そこで使われるのが「仮想スクロール」です。ス... 続きを読む

axe-core/playwrightとmarkuplintを導入しアクセシビリティの自動テストをできるようにした

2024/03/17 26 users playwright インスト web 自動テスト 興味

Web アクセシビリティに興味があったので、まず機械的なチェックツールから学んで知識を増やそうということでこのサイトに @axe-core/playwright と markuplint を導入してみました。 @axe-core/playwright のセットアップ 既に Playwright が導入されている状況を想定し進めます。まず@axe-core/playwright をインスト... 続きを読む

プレースホルダーのアクセシビリティ上の課題と解決策 - SmartHR Tech Blog

2024/03/12 65 users プレースホルダー ユーザビリティ アクセシビリティ上 課題

こんにちは！SmartHRプロダクトエンジニアのhimiです。 この記事ではプレースホルダーのアクセシビリティとユーザビリティについての課題と、その解決手段についての話を書きます。 プレースホルダーって何？ Webアプリでよく見る、フォームコントロールに値が無いときに表示するテキストのことです。 主な用途としては... 続きを読む

ウェブアクセシビリティ対応、どうすれば？　法改正のポイントと5つのステップを解説｜Goodpatch Blog グッドパッチブログ

2024/03/11 29 users ステップ グッドパッチブログ Goodpatch Blog

アクセシビリティ？　ウチの会社のウェブサイトは大丈夫なの──。 法改正によって、障害のある方への「合理的配慮の義務化」が、2024年4月1日をもって民間企業にも適用されることを受け、ウェブデザイン分野ではアクセシビリティ対応の機運が高まっています。 とはいえ、「法改正で何が変わったのかよく分からない」「ウ... 続きを読む

<button>とかのスタイルを消して書き直すときに考えることの備忘録

2024/01/01 12 users Button unset 備忘録 分岐 Chrome

all: unset; などを使ってUAスタイルシートを消してまっさらな場所からスタイルを当てるのは気持ちがいいですが、アクセシビリティ等の観点から重要な分岐が見落とされる可能性があります。 ここではChromeのUAスタイルシートを参考に、検討しておいたほうがいい状態をいくつかリストします。 (もちろん、既存のUIコンポ... 続きを読む

freee、デザインシステム「vibes」を公開　アクセシビリティをはじめとするフロントエンド開発のノウハウが満載 | プレスリリース | freee株式会社

2023/12/19 119 users freee プレスリリース freee株式会社 ノウハウ 組織

freee、デザインシステム「vibes」を公開　アクセシビリティをはじめとするフロントエンド開発のノウハウが満載 ■マジ価値サマリー（このお知らせでお伝えしたいこと） ・freeeのアクセシビリティをはじめとするフロントエンド開発のノウハウが詰まったデザインシステム「vibes」を公開します ・あらゆる組織でシステム... 続きを読む

Access Accepted第778回：ゲーム業界で急速に進むアクセシビリティへの動き

2023/12/12 33 users インタラクティブエンタテインメント 奥谷海人 歳月 ソニー

Access Accepted第778回：ゲーム業界で急速に進むアクセシビリティへの動き ライター：奥谷海人 ソニー・インタラクティブエンタテインメントが先日リリースした「Access コントローラー」は，誰もが不自由なく楽しめるように5年の歳月をかけて開発されたデバイスだ。アクセシビリティに対するゲーム業界の動きは以前か... 続きを読む

ウェブコンテンツアクセシビリティガイドライン（WCAG）は何が難しいのか、あるいは難しさに立ち向かう方法 - 水底の血

2023/11/12 89 users WCAG 水底 文言 スライド ハードル

LINEヤフーにおけるこれからのアクセシビリティというスライドで「WCAGはハードルが高い」という文言を見かけました。どうしてハードルが高い、言いかえるならば難しいとされるのか、その難しさはどこから来るのかをちょっと深掘りしてみようと思います。 WCAGという言葉について、改めて見ておきましょう。WCAGはもっぱ... 続きを読む

ウェブアクセシビリティ検証ツール「Stark」 | Accessible & Usable

2023/09/22 14 users Accessible Stark figma Sketch

公開日 : 2023年9月22日 カテゴリー : アクセシビリティ 「Stark」というウェブアクセシビリティ検証ツールがあります。各種ブラウザ (Chrome、Firefox、Safari、Edge) の拡張機能として、あるいは各種デザインツール (Figma、Sketch、Adobe XD) のプラグインとして、色覚シミュレーションや色のコントラスト比のチェッ... 続きを読む