사이트에 쉽게 액세스할 수 있는 몇 가지 방법

게시 됨: 2017-02-15

페이지와 그 자산을 구조화하면 그 기계가 무엇이든 간에 적절하게 기계 친화적으로 만듭니다. 사용자(장애가 있는 사용자 포함)와 기계가 의미 있는 콘텐츠에 바로 접근할 수 있도록 하는 일종의 상식적인 기술을 추가하고 사이트를 쉽게 액세스할 수 있고 검색 엔진에 친숙하게 만드는 방향으로 나아가고 있는지 확인하십시오.

우리 모두는 초보자 또는 비 기술적인 사람이 자신의 웹 자산을 디자인하고 개발할 수 있도록 하는 WordPress의 힘에 익숙합니다. 이 플랫폼은 설정이 간단하고 방문자에게 콘텐츠와 기능이 어떻게 진행될지 결정하는 테마 및 플러그인에 대한 견고한 프레임워크를 제공합니다.

장애가 있는 개인이 사이트에 액세스할 수 있도록 하려면 기본 WordPress에 액세스 가능한 웹사이트 개발을 촉진하는 데 필요한 많은 기능이 있으며 플러그인과 좋은 기술.

시작하기 전에 알아야 할 두 가지 중요한 요소가 있습니다. 첫째, 이 네 가지 기술만 구현하면 필요한 모든 요구 사항을 준수하는 정도까지 모든 사람이 웹사이트에 완전히 액세스할 수 있게 되는 것은 아니지만 웹 액세스에 대한 가장 일반적인 장벽을 해결하고 훨씬 더 큰 접근성을 제공할 것입니다.

둘째, 접근성은 디자인, 개발 및 최상의 콘텐츠 저작 방식의 협력을 통해서만 달성될 수 있다는 점을 이해하는 것이 중요합니다. 디자이너는 접근 가능한 테마를 디자인할 수 있고 개발자는 접근 가능한 기능을 추가할 수 있지만 콘텐츠 작성자가 alt 태그 없이 의미 있는 이미지를 삽입하면 웹 페이지의 전체 의미에 접근할 수 없게 됩니다.

이를 염두에 두고 사이트에 쉽게 액세스할 수 있는 4가지 팁을 소개합니다.

이미지의 대체 텍스트

웹 접근성에 대한 가장 큰 장벽은 웹 페이지의 이미지를 설명하기 위해 대체 텍스트를 적절하게 사용하는 것이라는 사실은 잘 알려져 있습니다. 웹 사이트를 구축하는 모든 사람이 이 단일 지점을 해결한다면 가장 많은 접근성 불만을 근절할 것입니다. 이것이 바로 우리가 이미지에서 누락된 alt 태그의 공백을 메워주는 놀라운 플러그인 SEO Image Optimizer를 개발해야 한다는 충동을 느낀 이유입니다.

이해해야 할 기본 요점은 사이트에 이미지를 삽입하려는 경우 대체 텍스트로 이미지에 올바르게 레이블을 지정하는 것이 필수적이라는 것입니다. 즉, 온라인에 올리는 모든 이미지에는 로봇이 검색 엔진에 이미지를 나열할 수 있는 의미가 있어야 합니다.

alt 태그의 정보는 화면 판독기(시각 장애가 있는 사용자에게 웹 페이지를 소리내어 읽어주는), 텍스트 전용 브라우저 및 이미지를 로드하지 않는 느린 연결의 사용자가 이미지가 전달하는 정보를 이해할 수 있도록 합니다.

이미지에 의미가 없는 경우(예: 순수하게 장식용으로 사용되는 경우) 두 가지 방법으로 처리할 수 있습니다. CSS를 사용하여 배경 이미지로 로드하면 스크린 리더가 무시하고 이미지에 alt 태그가 필요하지 않습니다(이것은 의미 있는 이미지에도 적용되므로 주의하세요. 백그라운드에서 로드하면 스크린 리더는 이를 무시합니다. ). 이미지가 HTML을 사용하여 표시되지만 순수하게 장식적인 경우에는 alt 태그를 사용하되 비워 두십시오. 이는 스크린 리더에 이미지가 있지만 사용자에게 의미가 없으며 무시할 수 있음을 알려줌으로써 독자가 사이트에 더 쉽게 액세스할 수 있도록 합니다.

이미지에 레이블을 붙일 때 이미지의 의미를 볼 수 없는 사람들이 이해할 수 있도록 설명적인 텍스트를 사용하십시오. 여기에는 판단이 필요합니다. 이미지가 왜 여기에 있고 어떤 메시지를 전달하는지, 동일한 의미를 가장 잘 전달할 수 있는 단어는 무엇인지입니다. 모든 시각적 세부 사항에 대한 문자 그대로의 설명에 얽매이지 말고 의미를 전달하십시오.

전형적인 예는 검색을 시작하는 버튼으로 사용되는 돋보기 이미지입니다. 이미지에는 의미가 있으므로 기술해야 합니다. "돋보기"라고 설명하는 것은 사용자에게 도움이 되지 않습니다. 그들이 알아야 할 것은 이 버튼을 클릭하면 검색이 시작되므로 "검색하려면 여기를 클릭하십시오" 또는 "검색"이라는 대체 텍스트가 가장 적절할 수 있다는 것입니다.

목적에 부합하는 이미지에만 라벨을 지정해야 합니다. 이러한 예는 다음과 같습니다.

버튼으로 사용되는 이미지

링크로 사용되는 이미지

다른 컨트롤에 사용되는 이미지

콘텐츠와 직접적인 관련이 있는 이미지

이 기술은 물론 WordPress 사이트뿐만 아니라 모든 웹 사이트에 적용됩니다. 그러나 WordPress는 첫 번째로 콘텐츠 작성자가 시각적 보기와 HTML 보기 간에 전환할 수 있도록 하고 두 번째로 미디어 추가 기능을 사용하여 이미지를 삽입할 때마다 대체 텍스트 필드를 제공하여 가장 쉽게 만듭니다.

더 나은 접근성을 위한 플러그인

워드프레스 접근성은 다양한 플러그인을 사용하여 향상될 수 있습니다. 이 플러그인은 설정하기 쉽고 다양한 장애가 있는 사용자가 사이트에 액세스할 수 있도록 합니다. 다음은 귀하의 사이트에 쉽게 액세스할 수 있는 플러그인입니다.

액세스 키

액세스 키 플러그인을 사용하면 웹사이트의 링크 및 컨트롤에 액세스 키를 할당할 수 있습니다. 예를 들어, 홈 링크에는 액세스 키 조합 alt+h가 할당될 수 있고 검색 버튼에는 alt+s 키 조합이 할당될 수 있습니다. 제공된 예제와 같은 액세스 키를 사용하면 시각 장애가 있는 사용자와 거동이 불편한 사용자가 원하는 항목에 쉽게 액세스할 수 있습니다.

쉬운 리트윗

Easy Retweet은 Twitter에서 콘텐츠 공유를 용이하게 하는 액세스 가능한 버튼을 페이지에 추가할 수 있는 플러그인입니다. 이렇게 하면 장애가 있는 개인이 친구와 페이지를 공유하려는 경우 어려움 없이 공유할 수 있습니다.

AStickyPostOrderER

AstickyPostOrderER을 사용하면 콘텐츠가 표시되는 순서를 선택할 수 있습니다. 콘텐츠를 가장 오래된 것부터 최신 또는 역순으로 표시하도록 선택할 수 있습니다.

Hackadelic SEO 목차

Hackadelic SEO Table of Contents 플러그인을 사용하면 게시물이나 페이지에 대한 목차를 제공할 수 있습니다. 이렇게 하면 콘텐츠를 쉽게 찾을 수 있습니다.

WP-투표

WP-Polls는 장애가 있는 개인이 사이트에서 수행할 수 있는 모든 투표에 참여할 수 있도록 허용합니다.

새로운 플러그인이 항상 개발되고 있습니다. WordPress 대시보드 기능을 사용하여 더 많은 것을 검색하십시오. 다양한 플러그인을 사용해 보고 장애가 있는 사용자에게 피드백을 요청하세요.

플러그인을 사용할 때 플러그인 사용이 선택한 테마 및 서로 호환되는지 확인하십시오. 플러그인이 테마와 호환되지 않으면 작동하지 않거나 사이트를 탐색하려는 장애인 사용자에게 더 많은 문제를 일으킬 것입니다. 플러그인이 서로 호환되지 않으면 사이트를 사용할 수 없게 되거나 콘텐츠가 잘못 표시될 수 있습니다.

표제를 사용하는 방법

페이지를 디자인할 때 <h1> , <h2> , <h3> 등의 올바른 순서로 제목을 사용하여 콘텐츠를 구성하는 것이 중요합니다. 제목을 사용하여 콘텐츠를 구성하면 스크린 리더를 사용하는 사람들이 페이지에 대한 요약을 얻고 더 쉽게 탐색할 수 있습니다. 스크린 리더 사용자는 앞으로 이동하려면 문자 "H"를 누르고 뒤로 이동하려면 "shift+H"를 눌러 원하는 콘텐츠 섹션에 액세스할 수 있습니다.

1번부터 6번까지의 제목을 사용하여 콘텐츠에 레이블을 지정하면 사이트에 쉽게 액세스할 수 있습니다. 테마가 제목을 사용하는 방식을 확인합니다(예: 테마가 사이트 제목에 <h1> 을 적용하거나 적용하지 않을 수 있으며 해당 사이트 제목이 모든 웹페이지에 표시되거나 표시되지 않을 수 있습니다. 어느 쪽이든 사용된 첫 번째 제목이 <h1> 인지 확인하십시오. 다음 제목(페이지 제목, 페이지 하위 섹션, 단락 제목)은 적절한 경우 <h6> 까지 순서대로 내려갑니다.

순서에 대해 약간의 유연성이 있지만 가장 현명한 옵션은 제목을 숫자 순서로 유지하고 사용자와 검색 엔진 모두에게 위험한 상황을 초래할 수 있으므로 혼동하지 않는 것입니다(이와 같이 혼합하지 마십시오. > <h1> , <h4> , <h2> 등).

탐색 링크가 유용합니다

마지막으로 사이트 디자인에 탐색 링크가 있어야 합니다. 이러한 탐색 링크를 사용하면 장애가 있는 사용자가 탐색 모음이나 기타 메뉴 및 검색 상자를 건너뛰고 이 링크를 클릭하여 페이지의 특정 위치로 이동할 수 있습니다. 또는 사용자가 사이트에서 원하는 섹션으로 빠르게 이동할 수 있습니다. 이러한 링크는 사용자가 의미 있는 콘텐츠로 건너뛰는 데 필요한 모든 위치에 표시되어야 합니다. 이러한 링크의 예는 다음과 같습니다.

주요 콘텐츠로 건너뛰기

탐색 표시줄로 이동

검색으로 이동

일부 WordPress 테마는 이미 이러한 링크를 제공할 수 있습니다. 이 경우 이 링크를 확인하여 자신의 링크를 추가해야 하는지 확인해야 합니다. 그러나 다른 테마는 탐색 링크를 제공하지 않습니다. 따라서 이러한 링크를 직접 추가해야 합니다.

마무리

이 단계 중 어느 것도 100% 액세스 가능한 웹 사이트를 보장하지 않지만 네 사이트를 방문하는 모든 방문자에 대해 사이트의 액세스 가능성을 높일 것이며 귀하의 사이트는 WordPress 웹 사이트의 90%보다 액세스 가능성이 더 높다는 것을 앞서 말씀드린 것을 반복하겠습니다. .

장애가 있는 방문자는 다른 방문자와 마찬가지로 사이트를 탐색할 수 있습니다. 이러한 방문자에는 검색 로봇도 포함되어 있으므로 사이트에 액세스할 수 있게 하면 비즈니스에도 도움이 되고 검색 엔진에서 상위에 랭크되어 궁극적으로 비즈니스에서 더 많은 이익을 얻을 수 있다는 사실을 확신해야 합니다.

이 블로그 게시물이 도움이 되었기를 바라며 여기에서 몇 가지 핵심 요소를