디자인의 접근성: 웹을 디자인하기 전에 알아야 할 8가지 요소

팬데믹 이후 사람들은 웹에 지나치게 의존하게 되었습니다. 이 팬데믹은 온라인 쇼핑이나 활동이 에너지, 노력 및 시간을 얼마나 절약할 수 있는지 생각하게 했습니다. 따라서 그들은 웹에 더 의존하고 있습니다.

그러나 문제는 세계 인구의 5분의 1이 웹 상호 작용 중에 문제를 일으키는 장애 로 고통받고 있다는 것입니다. 따라서 대부분의 사람들이 웹 콘텐츠를 디자인할 때 간과하는 디자인에 대한 접근성을 가져올 때입니다.

이것이 바로 오늘의 블로그가 접근성, 중요성 및 지침에 관한 모든 것인 이유입니다. 따라서 디자인의 접근성에 대한 핵심 을 파헤쳐 보십시오.

디자인에서 접근성이란 무엇입니까?

접근성이란 장애가 있거나 제한 이 있는 사람들이 디자인을 이해 하고 사용할 수 있도록 하는 것을 말합니다. 모든 사람이 어려움을 겪지 않고 디자인을 이해할 수 있도록 합니다. 간단히 말해서 접근성이란 장애가 얼마나 심각한지 상관없이 누구나 이해하거나 사용할 수 있는 도구, 웹 사이트 및 기타 제품을 구축하는 것을 의미합니다.

UX 디자인에서 접근성의 정의는 이미 웹에 필요한 이유에 대한 아이디어를 제공합니다. 여전히 명확하지 않은 경우 다음 섹션으로 이동하여 디자인에서 접근성이 중요한 이유를 알아보세요.

디자인을 접근 가능하게 만들어야 하는 이유는 무엇입니까?

장애인을 위한 이해하기 쉬운 디자인을 만드는 것이 디자인에 대한 접근성을 높이는 유일한 목적은 아닙니다. 이와 함께 접근성을 통해 광범위한 사람들을 대상으로 하고 제품이나 서비스를 그들에게 마케팅할 수 있습니다. 그 외에도 다른 혜택을 제공합니다. 웹을 위한 접근 가능한 디자인의 필요성을 살펴보십시오.

• 더 많은 잠재고객을 타겟팅할 수 있으므로 전환 가능성 이 더 높아집니다.
• 비즈니스 목표 를 달성하는 것이 더 쉬울 것입니다.
• 매출과 ROI 가 증가할 것입니다.
• 방문자가 디자인을 통해 전달하는 내용을 쉽게 이해할 수 있으므로 더 높은 사용자 경험 을 제공합니다.

이것이 웹용으로 접근 가능한 디자인을 만들도록 강요하는 이유입니다. 이제 유익한 접근성 디자인 지침을 갖는 것은 어떻습니까? 꽤 도움이 되겠죠? 가장 효과적인 접근성 지침을 찾기 위해 계속 파고듭니다.

접근 가능한 디자인을 만드는 8가지 요소

여기에서 우리는 모든 WCAG 2.1 리소스를 조사했으며 액세스 가능한 웹 페이지, 도구 등을 만드는 데 도움이 되는 8가지 최고의 요소를 모았습니다. 따라서 다음 8가지 요소를 확인하고 UX 디자인의 접근성을 보장 하십시오.

적절한 색상 대비

색상 대비는 전경색과 배경색 간의 색상과 밝기의 차이를 나타냅니다. 웹 접근성에 따르면 색맹인 사람도 읽을 수 있는 콘텐츠를 제공하는 것을 의미합니다. 배경 이미지와 텍스트 사이에는 쉽게 읽을 수 있도록 고대비 색상을 사용하는 것이 좋습니다. 이미지 의 경우 색상 대비가 4.5:1 이어야 합니다. 게다가 이 비율은 일반 텍스트 에서도 동일합니다. 또한 굵거나 큰 텍스트의 경우 색상 대비를 3:1로 유지합니다.

텍스트와 이미지에 대해 위의 비율을 유지하면 모든 사람이 콘텐츠를 읽을 수 있습니다.

읽을 수 있는 콘텐츠

색상 대비가 콘텐츠를 읽을 수 있게 만드는 유일한 요소는 아닙니다. 또한 가독성을 높이려면 콘텐츠를 최적화하고 형식 을 지정해야 합니다. 더 높은 가독성을 위해 콘텐츠를 최적화하려면 아래 가이드를 따르세요.

1. 내용을 작성할 때 짧은 문장 과 단락을 사용하십시오.
2. 제목과 이미지 를 사용하여 콘텐츠를 확장 가능하게 만드십시오.
3. 콘텐츠에 복잡한 단어 를 사용하지 마세요.
4. 콘텐츠에 수동태 를 사용하지 마세요.

명확한 타이포그래피

디자인의 접근성을 높이려면 일부 내용이 읽기 어렵기 때문에 콘텐츠의 서체를 신중하게 선택해야 합니다. 콘텐츠를 이해하기 쉽게 만들기 위해 Sans Serif 글꼴 을 사용합니다. Times New Roman, Arial, Calibri 등과 같이 읽을 수 있는 Sans Serif 글꼴을 선택하는 것 외에도 몇 가지 사항을 염두에 두어야 합니다. 와 같은:

1. 콘텐츠에 다른 유형의 글꼴 을 사용하지 마십시오. 콘텐츠에 하나 또는 최대 두 개의 글꼴을 사용하십시오.
2. 글꼴 크기는 14-16pt 여야 합니다.
3. 애니메이션 텍스트 를 사용하면 콘텐츠 가독성이 떨어지므로 좋은 방법이 아닙니다.
4. 텍스트에 대문자 및 기울임꼴 스타일의 사용을 최소화하십시오.

시간 및 모션 조정

대부분의 사람들은 콘텐츠를 독특하고 세련되게 만들기 위해 텍스트에 모션을 추가합니다. 그러나 모션을 추가하는 동안 콘텐츠 의 접근성을 방해합니다 . 따라서 장애인은 웹 콘텐츠를 읽는 데 어려움을 겪고 있으며 여기에서 시각 장애 또는 실명을 가진 사람의 수는 22억 입니다.

이것은 청중의 청크가 당신의 콘텐츠를 읽을 수 없기 때문에 웹 콘텐츠를 작성하는 목적을 파괴합니다.

비디오 및 오디오 제어

웹에 비디오를 업로드하는 동안 자막 이 추가되었는지 확인하십시오. 또한 비디오 및 오디오 콘텐츠에 대한 스크립트를 제공 해야 합니다. 또한 청중을 짜증나게 할 수 있으므로 비디오에 대한 자동 재생 설정을 중지 하십시오. 청중에게 비디오 및 오디오 재생 및 일시 중지를 완전히 제어할 수 있습니다.

일관된 탐색

웹 접근성은 또한 접근성 디자인을 만들기 위해 다음 사항을 염두에 두어야 하는 사이트 탐색에 따라 달라집니다.

• 페이지 제목 은 설명적이어야 합니다.
• 웹사이트에 의미 있는 링크 와 사이트맵 을 추가하십시오.
• 메뉴 는 모든 사람이 페이지의 내용을 이해할 수 있도록 현명하게 추가해야 합니다.
• 문서의 페이지 레이아웃 과 제목 에 특히 주의하십시오.

변환 버튼

CTA가 웹사이트의 가장 중요한 섹션 중 하나인 웹사이트 또는 콘텐츠의 모든 섹션을 최적화해야 합니다. 따라서 방문자의 관심을 끌 필요가 있습니다. 큰 글꼴과 의미 있는 단어 를 사용하여 클릭 유도문안의 전환율을 높이십시오. 게다가 적절한 색상 대비 를 유지하지 않으면 CTA가 청중에게 표시되지 않습니다.

따라서 UX 디자인의 접근성을 높이려면 색상 대비와 글꼴 크기를 잘 유지해야 합니다.

텍스트가 아닌 콘텐츠

제품, 서비스 또는 사이트에 대한 접근성을 높이려면 텍스트 기반 콘텐츠뿐만 아니라 텍스트가 아닌 콘텐츠도 최적화해야 합니다. 이제 아이콘 및 이미지와 같은 텍스트가 아닌 콘텐츠를 최적화합니다. 아래 지침에 따라 추가해야 합니다.

• 관련 텍스트와 함께 눈에 보이는 아이콘을 사용하여 누구나 이러한 아이콘을 사용하는 배경을 이해할 수 있도록 합니다.
• 텍스트가 아닌 콘텐츠의 색상 대비 를 유지해야 합니다.
• 아이콘 크기 는 텍스트보다 커야 합니다.
• 텍스트가 아닌 콘텐츠 에 대체 텍스트를 추가 하는 것을 잊지 마십시오.

자주 묻는 질문

접근성과 사용성은 비슷합니까?

접근성과 사용성은 비슷하지 않습니다. 접근성이란 장애인을 포함한 전 세계 모든 사람이 웹 콘텐츠와 디자인을 이해할 수 있도록 만드는 것을 의미합니다. 반면에 사용성은 사용자가 웹사이트와 상호 작용하는 방식과 완전히 연결됩니다.

사용성을 높이 려면 접근성 디자인 지침 이 제대로 유지되는지 확인해야 합니다. 간단히 말해 접근성과 사용성은 서로 연결되어 있습니다. 디자인에서 접근성을 유지하지 않으면 웹 콘텐츠가 완벽한 사용성을 얻을 수 없습니다.

일반적인 접근성 문제는 무엇입니까?

사용자는 제품 및 서비스와 상호 작용하는 동안 다양한 접근성 문제에 직면할 수 있습니다. 예를 들어, 사람들은 색맹 , 이동성 , 청각 및 발작 문제 로 인해 제품과 상호 작용하지 못하게 되어 큰 손실을 입을 수 있습니다.
이제 이러한 접근성 문제를 해결하려면 위에서 설명한 접근성 디자인 지침을 따라야 합니다. 따라서 웹사이트가 타겟 고객뿐만 아니라 장애가 있는 사용자에 대해서도 생각하도록 만드십시오.

마무리

전 세계 인구의 상당 부분이 장애인이기 때문에 디자인에 대한 접근성을 제공하는 것은 큰 관심사입니다. 웹 콘텐츠에 액세스할 수 없으면 시장이 자동으로 축소됩니다. 따라서 전 세계의 모든 사람들을 생각하는 웹 디자인을 준비하고 가능한 한 접근 가능하고 포괄적으로 만드십시오.

그리고 좋은 소식은 이미 방법을 알고 있다는 것입니다! 위에서 언급한 모든 접근성 요소를 웹 콘텐츠, 제품 또는 서비스에 하나씩 적용합니다. 또한 웹에서 접근성 디자인 예제를 확인하여 더 많은 아이디어를 얻을 수도 있습니다. 따라서 더 접근하기 쉬운 웹 콘텐츠 또는 제품을 만들기 위한 조치를 취하십시오.