모바일 접근성: 모든 사용자에게 적합한 앱을 만드는 방법

우리는 웹에서 많은 진전을 이루었으며, 모든 사람이 쉽게 사용할 수 있는 디지털 제품을 만드는 데 접근성이 중요하다는 것이 일반적으로 받아들여지고 있습니다. 

반면 모바일 접근성은 여전히 ​​많은 문제점을 안고 있습니다. 모바일 앱이 우리 일상생활에서 중요한 역할을 하고 있지만, 대부분의 앱은 어느 정도 접근성이 낮습니다.

사실, 지안 와일드, 컨설팅 회사 CEO 접근성오즈, 모바일은 사용성과 접근성 측면에서 아직 암흑기에 있다고 생각합니다. 마치 2000년대 초반의 웹과 비슷합니다.

"모바일 기기의 접근성 기능은 훨씬 뛰어납니다."라고 Wild는 설명합니다. "하지만 사이트와 앱 자체에는 많은 문제가 있습니다. 사용자가 특정 구성 요소에 갇히는 함정과 같은 접근성 오류는 데스크톱 웹에서는 수년 동안 볼 수 없었던 현상인데, 모바일 사이트와 네이티브 앱에서도 흔히 볼 수 있습니다. 모바일 기기의 접근성 기능이 아무리 뛰어나더라도, 사이트나 앱에 제대로 적용되지 않는다면 (대부분의 경우 그렇지 않습니다) 아예 없는 것과 마찬가지입니다."

앱 디자이너와 개발자로서 우리는 모든 작업에 기본적으로 접근성 모범 사례를 포함시키는 큰 책임을 지고 있습니다.

접근성 기준을 준수하면 의도치 않게 사용자를 배제하는 상황을 방지하고 고객 만족도를 높이고 유지율을 높일 수 있습니다. 이는 모바일 환경에도 적용됩니다.

"앱 디자이너 및 개발자로서 우리는 우리가 하는 모든 일에 기본적으로 접근성 모범 사례를 포함시키는 데 큰 책임이 있습니다."라고 지적합니다. 스콧 빈클, 플랫폼 접근성 전문가 Shopify.

그는 그것이 몇 가지 이유 때문에 중요하다고 말합니다.

• 포괄적인 접근성을 제공하면 도움이 됩니다. 장애인—전 세계 인구의 약 15%—가 독립적이고 존엄하게 살 수 있는 권리를 가지고 있습니다.
• 이 소득 증가 가능성 더 많은 사람들이 앱을 성공적으로 사용할 수 있게 되면 앱에서 더 많은 성과를 얻을 수 있습니다.
• 장애인 차별 금지 누구에게 의지하는가 보조 기술 긍정적인 대중 인식을 구축하는 데 도움이 됩니다.
• 앱에 접근성을 구현하면 판매자가 다음을 피할 수 있습니다. 디지털 접근성 기반 소송.

이 기사에서는 접근성 전문가, 엔지니어, 제품 디자이너들이 더욱 접근성 있고, 포괄적이며, 사용하기 편리한 앱을 만드는 데 대한 최고의 팁을 제공합니다.

당신은 또한 같은 수 있습니다 : Shopify 앱 구축 방법: 완전 가이드 – 접근성 원칙.

접근성에 대한 접근 방식을 고려하세요

접근성은 여전히 ​​소수만이 혜택을 얻는 관행으로 규정되는 경우가 많기 때문에 이 용어는 점점 더 "포괄적인 디자인. "

"접근성"이라는 단어에는 많은 의미가 담겨 있습니다. 로빈 크리스토퍼슨영국 기술 자선 단체의 디지털 포용 책임자 AbilityNet. "장애인 사용자를 돕기 위해 고려해야 할 까다로운 체크포인트와 관련이 있습니다."

크리스토퍼슨은 접근성에 대한 인식된 태도는 종종 그것이 중요하다는 것을 암묵적으로 인정하는 것이지만, 의무적인 것이 아니기 때문에 다른 사람의 책임이라고 말합니다.

"접근성을 볼트온 활동으로 간주하는 한, 결국 볼트로 고정된 것도 버려지거나 아예 잊혀질 수 있습니다."라고 그는 말합니다.

접근성을 볼트온 활동으로 간주하는 한, 결국 볼트로 고정한 것도 버려지거나 아예 잊혀질 수 있습니다.

크리스토퍼슨은 모바일 중심의 세상에서 접근성은 더 이상 장애가 있는 사람들만을 위한 것이 아니라, 모든 사람에게 중요한 관심사라고 주장합니다. 접근성은 이제 매일 모든 사람에게 영향을 미칩니다.

"우리 모두는 매시간, 심지어 매분마다 장애의 스펙트럼을 오르락내리락합니다."라고 그는 지적합니다. "오늘 여러분 중 몇 분이나 한 손으로 휴대폰을 사용하셨나요? 그건 손재주가 손상된 겁니다. 산책할 때 휴대폰 화면을 마지막으로 곁눈질한 게 언제였죠? 바로 일시적인 시력 손상이죠. 계속 말할 수 있을 것 같습니다."라고 크리스토퍼슨은 말합니다.

"그런 순간에는 장애가 있는 사람과 똑같은 배려가 필요합니다."라고 그는 덧붙입니다. "그리고 물건들이 너무 가까이 있어서 잘못된 물건을 두드렸을 때 장애가 있는 사람만큼이나 좌절감과 불편함을 느끼게 됩니다. 전혀 차이가 없습니다."

제품 디자이너 루이스 아브레우, 저자 iOS 접근성 핸드북 및 유지 관리자 @모바일앱파11y 트위터 계정에서 우리 모두가 접근성의 이점을 누릴 수 있다는 데 동의합니다. 접근성은 앱을 효과적으로 사용할 수 있게 해 주고 동시에 고객 기반과 만족도를 높여 줍니다.

"접근성은 장애가 없거나 경미한 사람들에게는 편리함과 편안함을 제공할 뿐만 아니라, 많은 사람들에게는 독립성을 제공합니다."라고 그는 설명합니다. "주변이 너무 시끄러워서, 또는 헤드폰이 없어서 주변 사람을 방해하고 싶지 않아서 자막을 켜둔 적이 몇 번인지 기억도 나지 않습니다." [스크린 리더] 음성 제어 iOS에서는 요리할 때도 아주 유용해요!”

또한, 우리 모두 나이가 들면서 더 강하고 영구적인 장애를 갖게 되는 만큼, 장애인 차별을 고려한 디자인은 근시안적인 전략입니다. 처음부터 포용적인 디자인을 염두에 두세요.

당신은 또한 같은 수 있습니다 : 유니버설 디자인: 사이트와 앱의 접근성을 높이는 11가지 실용적인 팁.

접근성 계획

접근성과 포용성에 대해 처음부터 생각하는 것은 실제로 모든 사람이 앱을 사용할 수 있도록 하는 데 가장 중요한 단계라고 믿습니다. 롭 휘태커, iOS 소프트웨어 개발 엔지니어 캐피탈 원 UK 및 작성자 포괄적인 모바일 앱 개발 뿐만 아니라 모바일 A11y 블로그.

"곧 만들려는 기능에 대해 생각해 보세요."라고 그는 조언합니다. "능력과 환경이 다른 사람들이 이 기능을 어떻게 경험하게 될까요? 누군가를 배제하고 있나요? 모든 사람에게 동등한 경험을 제공하고 있나요?"

휘태커는 이러한 질문들을 고려하는 좋은 방법으로 사용자 프로필을 만드는 것을 권장합니다. 예를 들어, 새로 아이를 낳은 부모로서 다른 곳에 관심이 있고 한 손만 자유롭게 사용할 수 있는 사람의 프로필을 만들 수 있습니다. 또는 청각 장애가 있어 청각 신호나 말을 듣지 못하는 사람의 프로필을 만들 수도 있습니다.

"장애는 시스템이 다른 사람들에게 어떤 영향을 미칠지 고려하지 못할 때 발생합니다."라고 휘태커는 설명합니다. "처음부터 접근성을 고려하면 기능의 접근성이 높아질 뿐만 아니라, 여러 문제를 다시 해결해야 하는 번거로움이 없어 시간과 비용 효율성도 높아집니다."

앱에서 일반적인 접근성 문제를 확인하세요.

포괄적 디자인 및 접근성 옹호자 에릭 베일리 장애인을 대상으로 앱을 테스트하기 전에(그리고 테스트 시간에 대한 비용을 지불하기 전에) 일반적인 접근성 문제가 있는지 확인하는 것이 좋습니다.

"이렇게 하면 검사를 실시하는 사람이 보조공학 기기를 매일 사용하지 않는 사람으로서는 인지하지 못할 수 있는 더 세부적인 문제에 집중할 수 있습니다."라고 그는 지적합니다. 베일리는 다음 체크리스트를 따르라고 제안합니다.

1. 앱이 휴대폰이나 태블릿을 가로 모드로 회전하는 것을 지원하나요? 지원하지 않는다면, 업데이트해야 할 거야.
2. 앱에서 텍스트 크기 조절을 지원하나요? 지원한다면, 크기 조절 후 다른 UI 요소에 의해 텍스트가 가려지나요?
3. 인지 장애가 있는 분들에게는 도상학이 정말 중요하므로, 아이콘에 라벨이 있는지 확인하세요. 사용하는 아이콘이 의미가 통하는가요? 너한테 그게 필요한 거야??
4. 각 이미지에 해당 내용을 정확하게 설명하는 간결한 대체 설명이 있나요?
5. 앱이 일반 사용자를 대상으로 하나요? 그렇다면 짧고 간단한 문장을 사용하고 있나요? 수정이 가능한 복잡한 개념이나 전문 용어가 있나요?

대니 랭커스터, 인간 중심 연구, 디자인 및 개발 회사의 테스트 분석가 넥서 디지털 앱에서 텍스트 크기를 사용자가 선호하는 대로 자동으로 업데이트하는 옵션은 많은 사람에게 필수적인 기능이지만, 모든 앱에서 이 기능을 허용하는 것은 아니라는 데 동의합니다.

"이 옵션을 항상 사용할 수 있도록 해야 하지만, 텍스트가 읽기 어려워 보일 수 있으므로 이 옵션에만 의존할 수는 없습니다."라고 그는 조언합니다. "수동으로 테스트하고 다양한 텍스트 크기를 조정해 보는 것을 권장합니다."

기준 요구 사항을 충족하는지 확인하세요

Shopify 한편, 접근성 전문가인 Scott Vinkle은 다음과 같은 모범 사례를 높은 수준에서 따르는 것이 좋다고 제안합니다.

• 마우스로 완료할 수 있는 작업은 마우스로도 완료할 수 있습니다. 키보드만.
• 초점 가능한 컨트롤에는 다음이 있습니다. 눈에 보이는 초점 표시기 및 논리적 순서로 흐름.
• 확인 색상 대비가 충분하다 읽을 수 있도록.
• All 이미지에는 텍스트 대체가 있어야 합니다.; 이미지에 대한 설명이거나 장식용 이미지의 경우 빈 값입니다.
• 제목이 존재합니다 그리고 논리적인 순서대로.
• 모든 양식 필드 라벨이 보이고 연결되어 있습니다 관련 입력 내용에 대해.
• 사용자 정의 구성 요소 정확한 역할, 상태를 전달하고 예상되는 키보드 상호 작용을 지원합니다.

이러한 항목을 돕기 위해 Vinkle은 다음과 같은 코드 린터를 사용하여 일상 업무 흐름에 도구를 포함하는 것을 권장합니다. 웹힌트또는 브라우저 확장 프로그램(예: 도끼. 자동화 도구와 수동 도구 페어링 키보드 테스트 및 스크린 리더 테스트 접근 가능한 사용자 경험을 제공하는 데 큰 도움이 될 것입니다.

모바일 접근성 테스트 지침을 따르세요

The 웹 콘텐츠 접근성 지침 (WCAG) 모바일 사이트와 네이티브 앱에도 적용되지만, 개발 당시에는 모바일이 지금처럼 널리 사용되지 않았습니다. 따라서 이 지침이 모바일 접근성의 모든 측면을 포괄하지 않기 때문에, 단순히 WCAG2(또는 WCAG 2.1)를 준수하는 것만으로는 장애가 있는 사용자에게 완전히 접근 가능한 환경을 제공할 수 없습니다.

따라서 AccessibilityOz 창립자 Gian Wild는 모바일 사이트 하위 위원회의 의장을 맡았습니다. ICT 접근성 테스트 심포지엄 개발하다 모바일 사이트 및 네이티브 앱 테스트 방법론 크리에이티브 커먼즈 라이선스에 따라 제공됩니다.

전 세계에서 인정된 모바일 접근성 테스트 표준을 통합한 이 가이드라인은 WCAG와 함께 사용하여 모바일 및 태블릿 기기를 사용하는 장애인이 사이트와 앱에 접근할 수 있도록 보장하는 것을 목적으로 합니다.

"이 가이드는 모바일 웹사이트와 네이티브 앱을 사용하는 장애가 있는 사용자의 고유한 요구를 명확히 하고 웹 개발 커뮤니티의 기준을 높이기 위해 작성되었습니다."라고 Wild는 설명합니다. "위원회로서 우리는 기술 발전만큼이나 정기적으로 업데이트되는 일종의 가이드라인이 필요하다고 생각했고, WCAG가 충분히 빠르게 발전하지 못하고 있다고 생각했습니다."

"실제로 모바일 사이트나 네이티브 앱의 접근성을 높이기 위해 해야 할 한 가지 일은 시뮬레이터가 아닌 실제 기기를 사용하는 것입니다."

Wild는 실제 기기에서 테스트하는 것이 매우 중요하다고 강조합니다. 실제로 모바일 사이트나 네이티브 앱의 접근성을 높이기 위해 꼭 해야 할 일이 있다면, 바로 시뮬레이터가 아닌 실제 기기를 사용하는 것입니다.

방법론에 따르면 모바일 사이트 테스트에는 네 가지 주요 테스트 방법이 있습니다.

1. 실제 모바일 및 태블릿 기기에서 테스트
2. 보조 기술이 있는 장치에서 테스트
3. 데스크톱에서 반응형 크기의 창 테스트
4. 데스크톱에서 테스트

기본 앱은 다양한 기기와 보조 기술을 사용하여 테스트해야 합니다.

모바일 사이트를 테스트하는 단계는 다음과 같습니다.

1. 장치 식별
2. 신원 사이트 유형 및 변형
3. 중요한 문제 테스트
4. 모바일 특정 문제 테스트
5. 모바일 보조 기술 및 기능 지원 테스트

네이티브 앱 테스트의 단계는 2단계를 제외하고는 모두 동일합니다. XNUMX단계는 네이티브 앱 테스트의 경우 "애플리케이션 기능 정의"입니다.

저작 도구 접근성

앱이 웹 콘텐츠 작성을 지원하는 경우(예: 제품 리뷰Scott Vinkle은 또한 ATAG(Authoring Tool Accessibility Guidelines)를 준수해야 한다고 조언합니다.

이에 따르면 ATAG 사양WCAG를 충족하고 포괄적인 디자인을 도입하도록 앱을 디자인하는 것은 좋은 시작입니다. 또 다른 중요한 부분은 앱이 콘텐츠 제작자가 접근 가능한 콘텐츠를 제작할 수 있도록 지원하는 것입니다.

모바일 기기의 보조 기술을 사용하여 앱을 테스트하세요

최신 모바일 장치에는 다양한 내장 접근성 기능이 포함되어 있습니다(참조: iOS 및 Android 개요)를 통해 광범위한 능력을 지원합니다.

"iOS 설정 앱의 모든 옵션을 거미줄처럼 그려 보면, 절반 이상의 항목이 '접근성'에 있다는 것을 알 수 있습니다."라고 크리스토퍼슨은 지적합니다. "이 멋진 기능들을 무시하고 싶으시다면, 메시지를 받아쓰기해 본 적도 없고, 카메라 스냅으로 인쇄 문서에서 텍스트를 가져와 본 적도 없고, 이미지 검색을 해 본 적도 없고, 심지어 다크 모드를 사용해 본 적도 없는 경우에만 그렇게 하세요. 이 모든 기능은 원래 접근성 기능에서 시작되었습니다."

앱이 예상대로 작동하는지 확인하고 사람들이 앱을 어떻게 경험할지 더 잘 이해하려면 iOS에서 VoiceOver 및 음성 제어와 같은 도구를 활성화하여 테스트하십시오. TalkBack에 및 음성 액세스 Android의 경우, 지원되는 기기에서 접근성 설정을 살펴보세요.

"기능을 탐색해 보세요."라고 휘태커는 권장합니다. "기대했던 모든 기능에 접근할 수 있나요? 모든 기능이 제대로 구성되어 있나요? 앱이 의도한 대로 디자인되고 기능하나요? 인터페이스에서 탐색하기 어려운 부분이 있나요?"

데본 퍼싱, 접근성을 위한 기술 프로그램 관리자 Shopify, 동의하지만 개발팀은 종종 화면 판독기에만 집중하여 가정에 이르게 할 수 있다는 점에 주의를 줍니다.

"장애가 있는 사람들과 동료이자 사용성 테스터로서 함께 일하면 더 넓은 시야를 확보할 수 있습니다."라고 그녀는 설명합니다. "예를 들어, 디자이너와 개발자는 사람들이 여러 유형의 보조 기술을 동시에 사용할 수 있다는 사실을 미처 깨닫지 못할 수도 있습니다. 편두통이나 뇌 손상이 있는 사용자는 눈의 피로를 줄이기 위해 애니메이션을 끄고 색상을 조정할 수도 있습니다. 시력에 문제가 있는 사용자는 앱의 글꼴 크기를 키우고 확대 기능을 사용할 수도 있습니다. 개인의 선호도는 장애 경험만큼이나 다양합니다."

개인의 접근성 선호도는 장애 경험만큼이나 다양합니다.

개발자는 지원하는 기기의 모든 접근성 기능을 숙지해야 한다고 퍼싱은 권장합니다. 사용자가 모션 활성화 또는 선택한 색상이 표시되지 않은 상태에서도 앱을 사용할 수 있도록 하세요. 컨트롤에 명확한 레이블을 지정하고, 콘텐츠의 시각적 순서를 정할 수 있도록 뷰를 구성하세요. 이 작업을 수행하는 방법을 잘 모르는 경우, 제공된 단계별 지침을 참조하세요. 모바일 사이트 및 네이티브 앱 테스트 방법론.

당신은 또한 같은 수 있습니다 : 즐겁고 사용자 친화적인 웹 애니메이션을 만드는 10가지 방법.

접근성 감사 도구를 사용하여 일찍 자주 테스트하세요

잠재적인 접근성 문제를 일찍 자주 포착하는 좋은 방법은 개발 워크플로에 감사 도구를 통합하는 것입니다. 풀스택 엔지니어가 조언합니다. 에린 도일, 누가 운영하는가 React를 사용하여 접근 가능한 웹 앱을 개발하는 온라인 과정.

특히 그녀는 Continuous Integration 솔루션에서 자동화할 수 있는 다음 도구를 제안합니다.

• ESLint 플러그인 eslint-플러그인-jsx-a11y 정적 코드의 문제를 분석하고 포착하려면
• 접근성 테스트 라이브러리 @axe-core/리액트 런타임에 DOM에서 사용 가능한 요소를 감사하려면
• 농담 도끼 단위 테스트에 추가하려면
• 사이프러스 도끼 및 @axe-core/웹드라이버js 엔드투엔드 테스트를 위해
• A 플러그인 을 통한 스토리 북 UI 구성 요소의 접근성 문제를 테스트하려면
• Lighthouse 전체 페이지를 테스트하려면

도일은 "감사 도구는 흔히 발생할 수 있는 잠재적 접근성 문제를 조기에 포착하는 데 큰 도움이 되지만, 수동 테스트를 대체할 수는 없습니다."라고 경고합니다. "이 도구만으로는 잠재적 문제의 약 20~30%만 포착할 수 있습니다."

도일은 감사 도구를 사용하여 "쉽게 따낼 수 있는 목표"를 찾는 것을 권장합니다. 이렇게 하면 다양한 데스크톱 및 모바일 브라우저에서 다양한 화면 판독기를 사용하여 수동 테스트를 수행할 때 발견해야 할 문제가 줄어듭니다.

수동 테스트에는 데스크톱 애플리케이션의 경우 키보드로만 테스트하고, 운영 체제에 내장된 고대비 도구나 모드를 사용하여 앱에 색상 대비 문제가 없는지 확인하는 것도 포함되어야 합니다.

React 작업 시 모바일 접근성을 고려하세요

React로 앱을 개발할 때, 마크 스테드먼Deque의 접근성 개발자 서비스 컨설턴트는 모바일에서 콘텐츠에 접근할 수 있도록 다음 사항을 주의 깊게 살펴볼 것을 제안합니다.

• 모든 페이지에 제목이 있는지 확인하세요. React에서는 기본적으로 제목이 없으므로 개발자가 직접 처리해야 합니다.
• React에서는 페이지 간 라우팅 시 포커스 제어가 표준이 아니므로, 페이지 간 라우팅 후에는 포커스가 어디로 가는지 제어해야 합니다.
• 상태 메시지와 같은 모든 동적 콘텐츠에는 적절한 안내가 있어야 합니다.
• 삶을 편리하게 만들고 가능한 한 의미론적 HTML을 사용하세요., , ) 모든 접근 가능한 혜택을 받으세요.
• 가능한 한 조각을 사용하여 추가 기능을 활용하세요.

  페이지에 적절한 HTML 마크업을 손상시킬 수 있는 s가 추가되지 않습니다.

Steadman의 동료이자 접근성 개발자 서비스 컨설턴트인 그는 "동적 ARIA[Accessible Rich Internet Applications] 속성도 알고 있어야 합니다."라고 말했습니다. 테일러 리차드 "때로는 화면 판독기를 혼란스럽게 만들어 사용자에게 제대로 읽히지 않을 수도 있습니다."라고 덧붙였습니다.

이것은 일반적으로 true 또는 false 사이를 전환할 때는 해당되지 않지만 ID가 필요한 특정 ARIA 속성의 경우(예: describedby or labelledby리차드는 스크린 리더가 로드하기 전에 해당 ID가 DOM에 있는지 확인해야 한다고 말했습니다.

React Native Accessibility API를 활용하세요

React Native를 사용하여 네이티브 앱을 빌드하는 경우 레오니 왓슨접근성 컨설팅 디렉터 테트라로지컬, 다음을 확인하는 것이 좋습니다. 접근성 API Android 및 iOS 플랫폼 접근성 API와 호환됩니다. 이를 통해 해당 기기에서 스크린 리더와 같은 접근성 서비스를 사용하는 사용자도 사용할 수 있는 앱을 만들 수 있습니다.

Android 및 iOS 기기 모두에서 접근성 서비스에서 사용할 수 있는 여러 속성이 있습니다. 여기에는 다음이 포함됩니다.

• 접근 가능 속성은 요소에 접근 가능함을 나타내는 부울 속성입니다. accessible={true} 이 설정되면 해당 요소와 그 자식 요소는 접근 가능하고 포커스를 받을 수 있는 단일 요소로 처리됩니다.

• The accessibilityLabel 속성은 요소에 접근 가능한 이름을 제공하는 문자열입니다. accessibility={true} 설정되어 있으면 이를 제공하는 것이 좋습니다. accessibilityLabel 화면 판독기에서 알려주기 때문이죠.

• The accessibilityHint 속성은 요소의 접근 가능한 설명으로 사용되는 선택적 문자열을 설정합니다. accessibilityLabel 요소가 무엇을 하는지에 대한 추가 힌트를 제공함으로써.

• The accessibilityRole 속성은 요소의 역할을 설정합니다. 요소의 역할은 접근성 서비스에 해당 요소가 무엇인지 알려줍니다. API에는 27가지 역할이 있습니다. 예를 들어, accessibilityRole={checkbox}, accessibilityRole={button}및 accessibilityRole={alert}.

• The accessibilityState 객체에는 요소의 상태를 설명하는 여러 부울 속성이 있습니다. 예를 들어, checked, disabled, expanded or selected.

• The onAccessibilityTap 속성은 접근성 서비스를 사용하는 누군가가 요소를 두 번 탭할 때 트리거되는 사용자 지정 기능을 할당합니다.

React Native Accessibility API의 불일치 사항 이해

왓슨은 Android와 iOS 기기 모두에서 접근성 서비스에 사용 가능한 속성 외에도 React Native 접근성 API에는 각 플랫폼에 고유한 속성도 있다고 지적합니다.

이러한 속성에는 다음이 포함됩니다.

Android

• The accessibilityLiveRegion 속성은 요소의 콘텐츠가 스크린 리더 사용자를 위한 알림임을 나타냅니다. 웹의 라이브 영역과 마찬가지로 accessibilityLiveRegion 설정할 수 있습니다. none, polite및 assertive.

• The importantForAccessibility 속성은 뷰에서 접근성 이벤트를 발생시킬지 여부와 접근성 서비스에 보고될지 여부를 제어합니다. UI에서 겹치는 형제 요소 간의 충돌을 방지하는 데 사용되며, 다음과 같이 설정할 수 있습니다. yes, no및 no-hide-descendants.

iOS

• The accessibilityIgnoresInvertColors 이 속성은 색상 반전에 대한 사용자 기본 설정을 무시해야 함을 나타냅니다. 색상 반전으로 인해 콘텐츠를 사용할 수 없게 되는 경우(예: 사진 보기)에만 사용해야 합니다.

• The accessibilityViewIsModal 부울 속성은 형제 요소의 자식을 무시해야 함을 나타냅니다.

• The accessibilityElementsHidden 부울 속성은 요소의 접근 가능한 자식 요소를 접근성 서비스에서 숨겨야 하는지 여부를 나타냅니다. 예를 들어, accessiblityElementsHidden={true} 보기 A에서는 보기 A의 접근 가능한 모든 자식을 숨깁니다.

• The onAccessibilityEscape 이 속성은 사용자 정의 함수에 기본 iOS 이스케이프 제스처(화면에 그려진 Z 모양)에 대한 지원을 추가합니다.

• The onMagicTap 속성은 사용자 지정 함수에 iOS 매직 탭 제스처 지원을 추가합니다. 매직 탭 제스처는 두 손가락으로 두 번 탭하여 뷰와 가장 관련성 높은 동작(예: 수신 전화 받기 또는 현재 통화 종료)을 트리거하는 제스처입니다.

모바일 중심의 세상을 위한 앱 개발

모바일 접근성이 느리게 진전되는 이유는 많은 개발자와 제품 팀이 장애인에게 '모바일 우선'이 얼마나 적용되는지 깨닫지 못하기 때문입니다.

"이제 거의 모든 것을 모바일에서 할 수 있습니다. 모바일 기기는 접근성 지원과 기능이 뛰어나기 때문에 장애인들이 일반 사용자보다 훨씬 더 많이 모바일 기기를 사용하고 있습니다."라고 와일드는 말합니다. "따라서 데스크톱 사이트의 접근성을 높이는 것만으로는 충분하지 않습니다. 휴대폰으로 사이트나 앱에 접속하는 사용자에게는 전혀 도움이 되지 않습니다!"

모바일 기기에서 콘텐츠 접근성을 보장하는 방법은 여러 가지가 있습니다. 앱을 개발할 때 위에 설명된 팁을 염두에 두고 팀원과 이해관계자들에게 문제에 대한 인식을 제고하세요. 우리 모두 함께, 모두에게 도움이 되는 더욱 접근성 높은 모바일 웹을 만들어 나갈 수 있습니다.

우리의 친구들에게 특별히 감사드립니다. Shopify 파트너 블로그 이 주제에 대한 통찰력에 감사드립니다.