접근성을 진지하게 생각하십시오

일상 생활의 많은 부분에서 배제 된 사람들을 무시하지 마십시오.

Unsplash에 Jr Korpa의 사진

오늘 저는 우리가 사람들의 접근성 요구 사항에 대해 얼마나 많이 멈추고 생각 하는지를 상기시키는 트윗을 보았습니다.

이 글을 읽고 마음이 아팠습니다. 대중 교통이나 식료품 쇼핑과 같은 일상적인 활동뿐만 아니라 인터넷의 많은 곳에서 배제되는 것이 어떻게 느껴야할지 상상할 수 없습니다. 마음. 또는 더 나쁜 것은 당신이 시각 장애인이거나 기타 장애가 있다고해서 웹 사이트 나 앱을 사용하고 싶지 않다는 것입니다.

접근성 요구는 거의 고려되지 않습니다.

인터넷은 이론적으로 다양한 접근성 요구를 가진 사람들에게 적합하도록 조정할 수있는 장소입니다. 즉, 이론적으로. 충격적인 사실은 영국에서 웹 사이트의 70 %가 기본적인 영국 접근성 법률을 준수하지 않는다는 것 입니다. 당신을 염두에두고 설계되지 않은 웹 사이트에서 음식을 주문하거나, 청구서를 지불하거나, 뉴스를 읽으려고한다고 상상해보십시오. 보이지 않는 제출 버튼, 읽을 수없는 텍스트 또는 비어있는 전체 페이지를 상상해보십시오. 인생을 어떻게 살아야하나요?

보이지 않는 제출 버튼, 읽을 수없는 텍스트 또는 비어있는 전체 페이지를 상상해보십시오. 인생을 어떻게 살아야하나요?

자신, 동료 또는 테스트 참가자가 무엇이 필요한지 그리고 무엇이 필요하지 않은지 충분히 말하기에는 여전히 너무 많은 디자이너와 개발자가 있습니다. 하지만 접근성이 필요한 사용자를 대상으로 얼마나 자주 테스트합니까? 디자이너 또는 개발자로서 얼마나 자주 접근성에 대해 생각하지 않습니까? 웹 사이트를 접근성 도구와 함께 사용할 수있는 모든 방법을 알고 있습니까? 당신은 그것을 우선시합니까?

우리는 누구를 위해 디자인합니까?

대부분의 앱과 웹 사이트는 일반적으로 사용자가 다음과 같은 기능을 갖추어야하는 방식으로 설계되었습니다.

  • 시각적 인식 (텍스트, 색상, 모양, 이미지)
  • 청각 인식 (음악, 음성, 알림 소리)
  • 촉각 인식 (진동, 촉각 피드백, 압력 감도)
  • 운동 기능 (움직임, 터치 조작, 제스처)

우리는 "일반적인 사용자"를 위해 디자인 할 수있는 조건을 갖추고 있습니다. 쉽지 않을 수도 있고 대부분의 사람들에게 효과가있을 것이라고 믿기 때문일 수도 있습니다. 문제는 일반 사용자가 존재하지 않는다는 것 입니다. 일반 사용자를 위해 설계함으로써 대부분의 인구를 배제합니다. 그러나 우리가 장애인을 위해 디자인한다면 우리의 솔루션은 소위 일반 사용자 에게도 도움이 될 것입니다.

접근성이 필요한 사람들을 포함하는 데 도움이되는 디자인 습관 만들기

웹 사이트와 앱에 접근하기 어렵게 만드는 많은 것들이 있으며 대부분 해결하기 쉽습니다. 몇 가지를 간략히 설명하고 디자이너로서 제품의 접근성을 높이는 데 기여할 수있는 방법을 포함했습니다. 이러한 디자인 관행을 통합하면 더 나은 디자이너가되고 제품을 사용하는 접근성이 필요한 사람들에게 큰 도움이 될 것입니다.

하나 이상의 능력에 의존

색상별로 본문 텍스트와 만 다른 링크 스타일을 만드는 경우 색맹 사용자가 탐색하기에 충분하지 않습니다. 또 다른 예는 설명이없는 사진으로, 시력이 좋지 않은 사람은 액세스 할 수 없습니다. 청력이 약한 사람은 소리에만 의존하는 알림에 액세스 할 수 없습니다.

패턴이 보이기 시작 했나요? 사람들이 웹 사이트 나 앱을 이해하거나 탐색 할 수있는 능력 하나에 만 의존해서는 안됩니다. 동일한 지점을 가져 오는 데 사용할 수있는 백업 양식이 항상 하나 이상 있어야합니다. 소리를 사용 하시나요? 시각적 단서를 사용하십시오. 색상을 사용하십니까? 모양도 사용하십시오. 이것들은 단지 예일 뿐이지 만 하나의 양식에 의존하면 해당 양식을 관찰하거나 조작 할 능력이없는 사람을 자동으로 제외하게됩니다.

둘 이상의 양식사용 하여 사용자에게 신호를 보내는 것이 설계 관행의 표준 부분이되게하십시오 . 그리고 당신의 백업 방식이 일부 사람들이 관찰 할 수있는 유일한 방법이 될 수 있다는 것을 명심하십시오.

모바일과 웹 모두를위한 포커스 스타일 디자인

웹 사이트에서 탭 키를 누르면 일반적으로 선택한 단추 또는 링크를 설명하는 파란색 상자가 표시됩니다. 그런 다음 탭 버튼을 계속 눌러 링크 및 기타 클릭 가능한 개체를 탐색 할 수 있습니다. 그러나 일부 웹 사이트에서는 스타일이나 브랜드와 일치하지 않기 때문에이 키보드 포커스 표시기를 제거하기로 선택했습니다. 이것은 작게 보일 수 있지만 실제로는 탭 탐색에 의존하는 사람들 이 사이트를 사용 하지 못하도록하는 치명적인 움직임입니다 .

이 문제를 해결하려면 나머지 웹 사이트의 디자인과 더 잘 어울리는 포커스 스타일만들있습니다 . 디자이너에게 이것은 웹뿐만 아니라 모바일 디자인에서도 디자인 시스템의 일부가되어야합니다. 초점 상태로 명확하게 인식 할 수있는 윤곽선을 만들어야합니다. 이 포커스 상태는 항목에 포커스가 있음이 분명하다면 링크 및 버튼이나 이미지와 같은 기타 클릭 가능한 항목에 대해 다를 수 있습니다. 개발자는 새로운 CSS 포커스 스타일을 만들어이 새로운 스타일을 쉽게 구현할 수 있습니다 .

이 방법을 사용하면 포커스 표시기를 숨길 필요가 없으며 접근성이 필요한 사용자에게 멋지게 디자인 된 브랜드 내 탐색 환경을 제공 할 수 있습니다.

설명 링크 텍스트 사용

화면 판독기를 사용하는 사람들은 링크 만 읽도록하여 페이지를 탐색 할 수 있습니다. "여기를 클릭하십시오"라고만 표시된 링크를 디자인 한 적이 있다면 이로 인해 접근성 문제가 어떻게 발생하는지 이미 알고있을 것 입니다. 사용자가 링크에 대한 설명이 "여기를 클릭하십시오"라는 사실 만 알고있는 경우 해당 링크는 무엇이든 연결할 수 있습니다. 이제 특정 링크를 찾으려면 사이트를 탐색하기 위해 전체 페이지를 읽어야합니다.

이것은 고치기 쉬운 문제입니다. "여기를 클릭하십시오"비트를 연결하는 대신 전체 문장을 컨텍스트에 맞게 쉽게 연결할 수 있습니다. 또는 더 나은 방법은 링크가 이끄는 위치를 설명하는 방식으로 링크를 다시 작성하는 것입니다. 버튼도 마찬가지입니다. 여기에서도 설명 텍스트를 사용하고 싶을 것입니다.

충분한 색상 대비 및 글꼴 크기 사용

시각 능력이 저하되거나 색맹 인 사람들이 항상 보조 기술을 사용하는 것은 아닙니다. 대신 정보를보고 읽을 수 있도록 적절한 텍스트 크기와 색상 대비에 의존하는 경우가 많습니다.

색상 대비 및 텍스트 크기가 적절한 지 확인하려면 모든 유형의 디자인 소프트웨어에 사용할 수있는 여러 플러그인 중 하나를 사용할 수 있습니다. 제가 선택한 플러그인은 Stark입니다 . 이 플러그인은 디자인을 테스트하는 데 도움이되는 많은 무료 옵션을 제공하고 접근 가능한 디자인을 더 잘 이해할 수 있도록합니다.

페이지 시간 제한에 대한 디자인 유연성

많은 양식에는 보안 문제를 방지하기 위해 시간 제한이 설정되어 있습니다. 이것은 그 자체로 문제가되지 않지만, 사람들이 사용하는 보조 기술 때문에 할당 된 시간보다 오래 걸리면 문제가 됩니다 .

시간 제한이있는 양식을 디자인 할 때 남은 시간을 나타내는 명확한 표시기와 양식을 무효화하기 전에 확장 할 수있는 옵션도 디자인해야합니다. 이러한 옵션을 명확하게하면 다른 능력을 가진 사람들이 첫 번째 시도에서 양식을 완료 할 수 있습니다.

이것이 웹 접근성에 대한 첫 번째 소개라면 W3C 웹 접근성 이니셔티브에 대해 배우는 것이 좋습니다 . 웹 접근성의 표준이며 자료를 읽으면 많은 것을 배울 수 있습니다. 접근성 요구 사항에 대한 이해하기 쉬운 매뉴얼에 대해서는 Microsoft의 포괄적 디자인 지침 만큼 좋은 것은 없다고 생각 합니다. 장애가있는 사람들이 직면하는 문제뿐만 아니라 접근성 문제를 해결하는 방법이 더 많은 인구로 확대 될 수 있다는 점을 완벽하게 강조합니다. 또 다른 훌륭한 리소스는 접근성을 위해 모든 디자인 구성 요소를 어떻게 고려해야하는지에 대한 자세한 기사입니다 .

접근성을위한 디자인이나 개발 경험이 거의 없다면 처음에는 상당히 힘들 수 있습니다. 더 간단하게 만들기 위해 디자인중인 항목에 액세스 할 수 있는지 정신적으로 확인할 수 있습니다. 웹 접근성의 네 가지 양식 (시각적 지각, 청각 적 지각, 촉각 지각 및 운동 기능)을 고려하고 이러한 네 가지 능력을 모두 갖추지 않은 경우 웹 사이트 또는 앱에 액세스 할 수 있는지 상상함으로써이를 수행 할 수 있습니다. 그 외에 접근성 플러그인을 사용하고 접근성이 필요한 사용자를 테스트하고 계속 학습하세요!

Suggested posts

벨크로의 발명에 영감을 준 관찰

벨크로의 발명에 영감을 준 관찰

벨크로는 어디에서나 볼 수 있으며 거의 ​​무한한 수의 응용 프로그램에 사용할 수 있지만 한 사람이 단순한 관찰이 아니었다면 이러한 유형의 패스너를 사용하지 않았을 수 있습니다. Velcro에 대한 아이디어는 Georges de Mestral이라는 스위스 엔지니어가 사냥 여행 중에 숲을 하이킹을하다가 그의 옷과 개에 숫돌이 붙어 있음을 발견했을 때 시작되었습니다.

디자인 시스템 생성을위한 궁극적 인 가이드 — 3 부, 복잡한 버튼

디자인 시스템 생성을위한 궁극적 인 가이드 — 3 부, 복잡한 버튼

워크 플로의 속도를 높이고 일관성을 개선하며 창의적인 작업을 바로 시작할 수있는 강력한 디자인 시스템을 원하십니까? simplekits를 확인하십시오! 이 시리즈는 자신 만의 적응 형 디자인 시스템을 만드는 데 도움을주기위한 것입니다. 앞으로 나아갈 필요에 맞게 만들고, 편집하고, 조정할 수있는 하나! 그러나 나는 디자인 시스템이 큰 투자가 될 수 있고 약간 어려울 수 있다는 것을 알고 있습니다.

Related posts

전문적인 UX 작성 네트워크를 구축하는 5 가지 방법

전문적인 UX 작성 네트워크를 구축하는 5 가지 방법

작성자 Alexandra Duncan 귀하의 포트폴리오를 만들었고 벨트 아래에 약간의 경험이 있습니다. 그럼 다음 단계는 무엇입니까? UX 작가로서 네트워크를 구축 할 시간입니다! 물론, 기술을 마스터하는 것을 대체 할 수는 없습니다. 당신이 확고한 UX 전문 가라하더라도 좋은 네트워크는 업무 수행에 필요한 기술 부족을 보충 할 수 없습니다.

Blinkist에서 가장 큰 고객 불만을 해결하여 전환율이 23 % 증가한 방법

디자인을 통해 비즈니스와 고객 모두를위한 가치를 창출합니다.

Blinkist에서 가장 큰 고객 불만을 해결하여 전환율이 23 % 증가한 방법

Blinkist에서 우리는 모든 사람이 자신의 삶에 맞는 학습을하고 논픽션 책과 팟 캐스트에서 15 분 요약을 제공하기를 바랍니다. 우리 제품에 대부분 만족하는 1,600 만 명의 사용자가 있지만 일부는 구독 프로세스 때문이 아닙니다.

부정적인 피드백에 긍정적 인 영향을 미치는 방법

부정적인 피드백에 긍정적 인 영향을 미치는 방법

우리 모두는 긍정적 인 피드백을 받기를 좋아합니다. 학교에서, 직장에서, 친구와 동료로부터, 심지어 스마트 워치에서 실행중인 앱을 통해 잘하고 있음을 알려줍니다.

나는 디자인과 헤어졌지만 이제 우리는 다시 합쳐지고있다

나는 디자인과 헤어졌지만 이제 우리는 다시 합쳐지고있다

SXSW는 2021 년 3 월이므로 연간 CX.Report가 곧 나올 예정입니다.… 저는 지난 몇 년 동안 디자인 공간에서 벗어난 것 같습니다.