웹 접근성을 향상시키는 6가지 간단한 방법

게시 됨: 2022-08-02

공개: 이 게시물에는 제휴사 링크가 포함될 수 있습니다. 이러한 링크 중 하나를 통해 제품을 구매하면 귀하에게 추가 비용 없이 수수료가 발생합니다.

웹사이트의 접근성이 좋지 않으면 많은 사람들, 특히 장애가 있는 사용자가 웹사이트를 효과적으로 사용할 수 없습니다.

비즈니스에만 나쁜 것이 아닙니다. 장애인에 대한 차별을 금지하는 법률인 미국 장애인법(ADA) 위반으로 회사를 고소할 수 있습니다.

소송을 완화하는 핵심은 모든 사용자가 웹사이트에 액세스할 수 있도록 하고 ADA를 준수하는지 확인하는 것입니다.

이것은 길고 복잡한 과정일 수 있지만 액세스 가능한 WordPress 테마를 사용하는 것과 같은 초기 단계를 수행하여 웹사이트의 접근성을 개선할 수 있습니다.

웹사이트의 접근성을 높이는 6가지 실용적인 방법으로 시작하세요.

1. 웹 접근성 테스트 실행

변경하기 전에 먼저 웹사이트의 접근성을 테스트하십시오.

결국 사이트에서 필요한 접근성 조정을 수행하기 전에 무엇을 변경하거나 수정해야 하는지 알아야 합니다.

신뢰할 수 있는 웹사이트 접근성 검사기 테스트 도구를 사용하십시오.

웹사이트의 URL을 제공하기만 하면 도구가 몇 분 안에 전체 웹사이트를 스캔합니다.

그런 다음 도구는 양식, 그래픽 및 메뉴와 같은 각 웹 사이트 요소 및 구성 요소가 액세스 가능하고 규정을 준수하는지 여부에 따라 점수를 매깁니다.

또한 접근성 지침 및 수정이 필요한 특정 문제에 대한 자세한 정보를 받게 됩니다.

안정적이고 정확한 웹사이트 접근성 검사기를 사용하면 사이트에서 접근성 오류를 빠르고 쉽게 찾아낼 수 있습니다.

특정 웹사이트 요소를 조정하거나 변경하여 ADA 및 WCAG(웹 콘텐츠 접근성 지침)를 준수하고 더 쉽게 액세스할 수 있는 사이트로의 여정을 시작하는 방법을 포함하여 정확히 조정해야 할 사항을 알게 될 것입니다.

2. 중요한 상호작용 요소를 상단에 배치

이 빠른 웹 접근성 연습 수행: 웹 사이트 사용자가 웹 페이지 내에서 액세스해야 하는 중요한 사용자 인터페이스 컨트롤 및 하이퍼링크를 결정합니다.

그런 다음 Tab 키를 눌러 해당 항목에 도달한 횟수를 계산합니다.

몇 번 누르거나 너무 많이 누르셨습니까? Tab 키를 누를 때 인터페이스 컨트롤의 하이퍼링크에 포커스가 있는 위치를 볼 수 있습니까?

하이퍼링크에 도달하는 데 너무 많이 눌러야 하고 포커스가 표시되지 않거나 강조 표시되지 않으면 키보드 탐색만 사용할 수 있는 사람들이 사이트와 상호 작용하는 데 어려움을 겪을 것입니다.

사이트에 액세스할 수 없게 만들고 방문자를 실망시키며 사용자 경험을 망치게 됩니다.

이 문제를 해결하려면 대화형 요소와 필수 링크를 웹 페이지의 상단 또는 더 높은 위치에 배치하십시오.

이렇게 하면 키보드 전용 사용자가 원하는 링크와 요소에 더 빠르고 쉽게 접근할 수 있습니다.

3. 페이지 제목을 뚜렷하고 의미 있게 만드십시오.

시각 장애인 및 심각한 시각 장애가 있는 사용자는 이미지 및 텍스트 콘텐츠를 점자 또는 음성 출력으로 렌더링하는 보조 기술인 스크린 리더 소프트웨어를 사용합니다.

간단히 말해서 화면 판독기는 사용자를 위해 웹 콘텐츠를 "읽습니다".

웹 페이지 로드가 완료된 후 화면 판독기 사용자가 일반적으로 처음 접하는 것은 <title> 태그 사이의 텍스트입니다.

웹 페이지에 제목 태그가 없거나 다른 모든 페이지에서 동일한 태그를 사용하는 경우 스크린 리더 사용자는 자신이 어느 페이지에 있는지 알 수 없습니다.

스크린 리더는 HTML 마크업에 의존하므로 시각 장애가 있는 사용자는 적절한 제목 태그 없이 사이트를 효과적으로 탐색할 수 없습니다.

사용자 경험을 망치고 웹 접근성을 떨어뜨릴 수 있습니다.

한 가지 해결책은 페이지 제목을 명확하고 간략하게 유지하여 화면 판독기 사용자에게 설명을 제공하는 것입니다.

의미 있는 제목 속성을 사용하여 클릭 시 화면 판독기 사용자가 하이퍼링크로 이동하는 위치를 설명합니다.

링크 텍스트와 동일한 제목 속성은 사용자에게 의미 있는 설명을 제공하지 않으므로 사용하지 마십시오.

또한 화면 판독기 사용자가 페이지에서 웹 링크를 찾기가 더 어려워질 수 있습니다.

4. 적절한 제목 사용

제목은 웹 페이지의 개요를 설명하고 적절한 구조를 제공하며 텍스트 블록을 논리적 하위 섹션으로 나눕니다. 이를 통해 방문자는 콘텐츠를 이해하고 소화할 수 있으므로 더 쉽게 액세스할 수 있습니다.

제목의 제목 표제, 첫 번째 부제목의 H1, H2 등과 같은 적절한 부제목을 사용하여 웹 콘텐츠에 논리적 구조를 적용하십시오.

적절한 섹션과 제목 태그를 사용하면 스크린 리더 사용자가 웹사이트에서 원하는 섹션으로 빠르게 건너뛸 수 있습니다.

원하는 섹션에 도달하기 전에 모든 콘텐츠를 헤매지 않아도 되므로 원활한 액세스가 가능합니다.

5. 양식 요소에 레이블 지정

HTML 웹 양식은 사용자가 웹사이트와 상호 작용하는 주요 방법이므로 액세스할 수 있도록 하는 것이 중요합니다.

포괄적인 유니버설 디자인을 보장하려면 올바른 마크업을 사용하세요. 설명적이고 의미 있는 텍스트로 양식의 입력 요소에 레이블을 지정하십시오.

이렇게 하면 방문자, 특히 스크린 리더 사용자에게 제공해야 하는 특정 정보가 명확해집니다.

CSS(Cascading Style Sheets)를 사용하면 레이블 요소를 아이콘으로 디자인할 수 있습니다. 필요한 경우 브라우저 뷰포트를 밀어서 레이블 요소를 일반 보기에서 숨길 수도 있습니다.

6. 탐색 건너뛰기 허용

스크린 리더 사용자 및 키보드만 사용할 수 있는 사용자는 원하는 웹 페이지 섹션이나 정보로 이동할 수 없습니다.

예를 들어, 스크린 리더 사용자는 웹 페이지를 스캔할 수 없기 때문에 전체 HTML 문서를 살펴봐야 합니다.

탐색 건너뛰기를 통해 화면 판독기 및 키보드 전용 사용자는 긴 링크 목록을 건너뛰어 원하는 섹션으로 빠르게 이동할 수 있어 웹 접근성이 향상됩니다.

탐색 건너뛰기는 사용자가 클릭하거나 액세스하여 콘텐츠 섹션을 표시할 수 있는 웹 페이지 상단의 링크입니다.

사용자는 전체 웹사이트를 거치지 않고도 목록을 빠르게 살펴보고 원하는 콘텐츠나 정보로 건너뛸 수 있습니다.

웹사이트의 접근성 향상

웹 사이트에 액세스할 수 있도록 하는 방법과 복잡성 수준은 다양합니다.

완전한 접근성을 달성하는 것은 종종 단기간에 이루어지지는 않지만 간단하고 초기 조정부터 시작할 수 있습니다.

이 가이드의 팁으로 작업을 시작하고 올바른 웹 접근성 솔루션을 활용하고 전문가와 협력하여 웹 사이트에서 모든 사용자에게 동등한 액세스 권한을 제공하도록 하십시오.