Upgrade to Pro — share decks privately, control downloads, hide ads and more …

1からはじめるアクセシビリティ / beginner-for-accessibility

Avatar for taki4227 taki4227
April 03, 2019
Programming
0
140

1からはじめるアクセシビリティ / beginner-for-accessibility

2019/04/03 渋茶駒玉川エンジニアLT会 #3
Avatar for taki4227

taki4227

April 03, 2019
Tweet

More Decks by taki4227

See All by taki4227
Firebaseでここまでできる / Firebase we can do
Avatar for taki4227 taki4227
0
230
Relax site Flux
Avatar for taki4227 taki4227
0
140
Tensorflow Lite
Avatar for taki4227 taki4227
0
91

Other Decks in Programming

See All in Programming
猫と暮らす Google Nest Cam生活🐈 / WebRTC with Google Nest Cam
Avatar for Yutaro Muta yutailang0119
0
120
データの民主化を支える、透明性のあるデータ利活用への挑戦 2025-06-25 Database Engineering Meetup#7
Avatar for Kentaro Yoshida y_ken
0
360
なぜ適用するか、移行して理解するClean Architecture 〜構造を超えて設計を継承する〜 / Why Apply, Migrate and Understand Clean Architecture - Inherit Design Beyond Structure
Avatar for shiro seike seike460
PRO
3
770
git worktree × Claude Code × MCP ～生成AI時代の並列開発フロー～
Avatar for hisuzuya hisuzuya
1
570
たった 1 枚の PHP ファイルで実装する MCP サーバ / MCP Server with Vanilla PHP
Avatar for Shohei Okada okashoi
1
260
初学者でも今すぐできる、Claude Codeの生産性を10倍上げるTips
Avatar for Oikon s4yuba
16
11k
AI駆動のマルチエージェントによる業務フロー自動化の設計と実践
Avatar for 岡本秀明 h_okkah
0
150
Azure AI Foundryではじめてのマルチエージェントワークフロー
Avatar for 瀬尾佳隆 seosoft
0
170
VS Code Update for GitHub Copilot
Avatar for 74th(Atsushi Morimoto) 74th
2
650
RailsGirls IZUMO スポンサーLT
Avatar for 16bit_idol 16bitidol
0
190
Google Agent Development Kit でLINE Botを作ってみた
Avatar for Kento.Yamada ymd65536
2
250
Python型ヒント完全ガイド 初心者でも分かる、現代的で実践的な使い方
Avatar for MIKIO KUBO mickey_kubo
1
120

Featured

See All Featured
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
695
190k
Visualization
Avatar for Eitan Lees eitanlees
146
16k
The Language of Interfaces
Avatar for Des Traynor destraynor
158
25k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
43
7.6k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
35
2.4k
Statistics for Hackers
Avatar for Jake VanderPlas jakevdp
799
220k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
45
7.5k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
42
7.4k
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1370
200k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
86
4.7k
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
613
210k
Building Adaptive Systems
Avatar for Chris Keathley keathley
43
2.7k

Transcript

  1. 1からはじめるアクセシビリティ @taki4227

  2. • 名前 ◦ @taki4227 • 所属 ◦ ユアマイスター株式会社 • やっていること

    ◦ ミツモ！の Android / iOS / バックエンド やっています 自己紹介
  3. None

  4. アクセシビリティって？

  5. あらゆる人が どのような環境でも 同じように利用できること

  6. あらゆる人？ どのような環境？？

  7. • 高齢者や子供 ◦ 年齢に関わらない • 障害者や怪我を患っている人 ◦ 健康状態に関わらない あらゆる人 とは？

  8. • 運転中や満員電車の中 ◦ 通常操作ができない環境 • 日中の外、暗い部屋の中、電波状況が悪い ◦ 周りの環境 • 画面が大きい、画面が割れている

    ◦ 端末状況 どのような環境 とは？

  9. どうやって同じように利用でき るようにするのか？

  10. iPhoneの機能例

  11. アクセシビリティ機能 VoiceOver Siri AssistiveTouch

  12. + Bluetoothデバイス スイッチコントロール 「Made for iPhone」 補聴器

  13. 詳しく見たい方は

  14. iOSアプリでできることは？

  15. • Dynamic Type • Preserve Vector Data • Smart Invert

    Colors • Voice Over 対応できるアクセシビリティ(iOS11〜)

  16. • ユーザの設定によって、文字の 大きさやマージンが変わる • 文字の変更はシステム設定や コントロールセンターから可能 • アプリではレイアウトを崩れな いよう組む必要あり Dynamic

    Type

  17. • ベクター画像が利用できるように なる • これまで1x, 2x, 3x 画像が必要 だった •

    Dynamic Typeとともに、画像サイ ズも変えられる Preserve Vector Data

  18. • ユーザの設定によって、色を反 転する • 色反転の変更はシステム設定 から可能 • アプリでも対応が必要 (何もし ないと、画像も色反転してしま

    う) Smart Invert Colors

  19. • ジェスチャー操作をすることで画面を読み上げる ◦ テキストやボタンをタップすると、音声で読み上げる • 今までのシングルタップの操作は2回タップに変わる • アプリでは読み上げる対象か対象外かを作る必要あり VoiceOver

  20. 実はミツモ！でも アクセシビリティやっています！

  21. • Dynamic Type • Preserve Vector Data • Smart Invert

    Colors • Voice Over ミツモ！でやっているアクセシビリティ

  22. ミツモ！ TOP画面