웹 접근성은 중요한 SEO 중 하나입니다
검색엔진 로봇에 의한 크롤 가능성을 확보하는 작업을 「크롤러빌리티의 확보」, 정확한 색인을 돕는 작업을 「인덱서빌리티의 확보」라고 합니다. 이것들은 웹 접근성 향상을 위한 기본적인 작업을 통해 동시에 달성할 수 있습니다. 다르게 말하면 웹 접근성을 따르는 것이 곧 SEO 중 하나라는 이야깁니다.
시작하며：웹 접근성이란
웹 접근성이란, 고령자나 장애인을 포함한 어떤 유저라도, 어떤 유저 에이전트를 이용하고 있더라도, 또한 어떤 환경에서도 모든 웹 콘텐츠를 이용할 수 있는 상태를 말합니다. 웹 접근성을 높이는 작업을 통해 웹사이트는 보다 많은 유저에게 도달할 수 있게 됩니다. 특정 플랫폼이나 브라우저에 의존하지 않는 사이트를 만들어 마이너한 브라우저 등을 사용하는 유저층을 끌어들일 수 있을 뿐 아니라, 검색엔진 로봇에 대해서도 친화성을 가질 수 있습니다. 이런 의미에서 접근성을 향상시키는 것은 단순히 장애를 가진 유저를 위하는 것뿐 아니라 일반 유저에 대한 비즈니스 기회의 확대로도 이어집니다.
Web접근성의 사고방식
「웹 페이지・디자인 접근성에 대해서 잘 모르는 분은, 많은 유저가 당신과는 상당히 다른 상황에서 웹을 사용하고 있을 가능성이 있다는 것을 생각해 주세요」
이것은「Web Content Accessibility Guidelines 1.0」의 번역본 제 1장에서 인용한 것 입니다. 이 가이드라인은 아래와 같습니다.
- 어떤 유저는 「볼 수가 없는」, 「들을 수가 없는」, 「움직일 수 없는」「어떤 종류의 정보를 제대로, 또는 전혀 처리하지 못하는」 유저일지도 모릅니다.
- 어떤 유저는 「읽는 것이 힘든」 「문장을 이해하지 못하는」 유저일지도 모릅니다.
- 어떤 유저는 「키보드나 마우스가 없는」「키보드나 마우스를 사용할 수 없는」 유저일지도 모릅니다.
- 어떤 유저는 「텍스트만 표시 할 수 있는 환경에서」, 「작은 화면에서」, 「인터넷 접속 속도가 느린 환경에서」 조작하고 있을지도 모릅니다.
- 어떤 유저는 그 문장에 쓰여있는 언어를 「쉽게 말하거나 이해 할 수 없는」 사람일지도 모릅니다.
- 어떤 유저는 「보거나 들을 수 없는 환경」「손을 쓸 수 없는 상황」일지도 모릅니다(차를 운전하고 있는 경우나 시끄러운 환경 등의 경우)
- 어떤 유저는 「오래된 버전의 브라우저」, 「전혀 다른 종류의 브라우저」, 「음성출력 브라우저」, 「다른 OS」등을 사용하고 있을지도 모릅니다.
콘텐츠 제작자는 페이지 디자인을 할 경우에 위와 같은 상황을 고려 필요가 있습니다. 하지만, 고려해야 하는 여러 가지 상황이 있는 반면 각각의 상황에 맞는 디자인을 위한 방법은 동시에 여러 상황에 대해서도 유효한 경우가 많고, 결과적으로 웹 이용자 전체에게 이익을 가져다 줍니다.
크롤러빌리티와 인덱서빌리티
접근성에 대한 사고방식은 위에 인용한 문장과 같지만, 이러한 사고 방식에 따라 사이트를 제작함으로써 얻을 수 있는 장점은 SEO에 있어서도 대단히 큰 것입니다. SEO의 첫 걸음은 「모든 페이지를 크롤시켜 정확하게 색인되게 한다」는 것인데, 이것은 웹 접근성에 있어서 다양한 브라우저와의 대응과 완전히 같은 것입니다. 검색엔진이 페이지나 사이트의 내용을 취득할 때 사용하는 로봇이나, 취득한 데이터를 Index에 넣는 Index라고 부르는 프로그램은 HTML을 처리하는 프로그램이라는 의미에 있어서 우리들이 일상적으로 사용하고 있는 브라우저와 같은 종류(즉, HTML유저 에이전트)이기 때문입니다. HTML유저 에이전트에 대해 HTML 4.01사용서의 「4.1 정의」에는 다음과 같이 쓰여져 있습니다.
HTML유저 에이전트
HTML유저 에이전트(또는 단순히 유저 에이전트)란 HTML문서를 해석하는 프로그램을 말합니다. 유저 에이전트에는 텍스트 표시나 그래픽 표시의 시각적인 브라우저나, 음성출력이나 점자 출력의 비시각적인 브라우저, 검색로봇 등이 포함됩니다.
검색엔진 로봇의 크롤 용이성을 확보하는 작업을 「크롤러빌리티의 확보」, 정확한 Index를 돕는 작업을 「인덱서빌리티의 확보」라고 합니다. 자세한 사항은 아래 쓰여져 있는데, 이것들은 모두 웹 접근성의 확보와 같은 작업에 의해 실현됩니다.
크롤러빌리티의 확보
검색엔진 로봇이 사이트 내에 있는 모든 필요한 페이지를 빠짐없이 크롤할 수 있도록 사이트 내의 콘텐츠에 적절한 URL구조를 가지게 하여 각 페이지는 적절한 HTML로 쓰고, 각각의 콘텐츠를 적절한 링크로 묶는 것
인덱서빌리티의 확보
검색엔진 로봇이 페이지의 내용을 정확하게 Index할 수 있도록 하기 위해 사진이나 음성, 동영상에 대해서 적절한 대체 콘텐츠를 준비하거나 페이지 내의 각 요소의 구조를 적절히 마크업하는 것
검색엔진 로봇은 페이지 중의 문자 정보와 링크 정보를 중심으로 정보를 취득합니다. 즉, 문자 정보와 링크 정보만 이해하는 브라우저(텍스트 브라우저 같은)로 본 경우에도 제대로 이용 가능하거나 이해 가능한 사이트로 만들면 크롤러빌리티 및 인덱서빌리티의 확보로 이어지게 됩니다.
HTML문서의 구조화
구조화란 정리되지 않은 상태의 사물을 구성요소 별로 정리해 논리적인 구조를 만드는 것을 말합니다. HTML문서에 있어서의 구조화란 문서를 구성하는 각 요소를 정리해 논리적인 태그로 적절히 마크업하는 것을 말합니다. 보다 구체적으로는, 표제, 타이틀, 단락, 리스트, 표 라고 하는 문서의 구성요소를 그 의미 나름대로 정리하고 마크업하여, 각각의 내용 및 관계를 명확히 구분하는 작업을 말합니다. 이를 통해 얻을 수 있는 이점은 다음과 같습니다.
- 사람이 문서의 내용을 한 번에 이해하기 쉬워진다.
- 기계가 문서의 의미에 따른 처리나 출력을 하기가 쉬워진다.
적절하게 구조화된 HTML문서는 일반적으로 그래픽과 함께 콘텐츠를 보여주는 브라우저뿐 아니라, 텍스트 브라우저나 음성 브라우저, 검색엔진의 Crawler이나 Index 등, HTML을 취급하는 다양한 프로그램에 의미를 정확하게 전달하는 등 문서와 프로그램에 대한 높은 친화성을 얻을 수 있습니다.
구조와 표현(Structure와 프레젠테이션)의 분리
HTML에는 문서의 구조와 내용만을 쓰고, 화면 상의 레이아웃 등 표현 제어는 모두 CSS에서 하는 것을 구조와 표현의 분리(Structure와 프레젠테이션의 분리)라고 합니다. 구조와 표현의 분리에 의해 얻을 수 있는 장점은 HTML문서를 심플하게 하면서 데이터가 범용성을 가질 수 있다는 점으로, 구체적으로는 다음과 같은 것들을 들 수 있습니다.
- 한정된 메모리밖에 탑재 할 수 없는 디바이스, 마우스나 트랙패드와 같은 포인팅 디바이스를 이용 할 수 없는 환경에서의 접근성 향상
- 협소한 대역(Narrow Band)의 유저가 가진 스트레스 경감
- 음성 브라우저나 점자 브라우저 등, 시각 이외의 정보를 활용하는 경우를 위한 적절한 변환
- 페이지의 처리속도 향상
- 그 밖의 일반적으로 잘 사용되지 않는 디바이스나 브라우저에 개별적으로 대응하는 비용 억제
- 다양한 유저에게 대응하게 된 결과롷서의 영업 기회의 확대
- Crawler나 Index, 랭킹 알고리즘을 위해 필요한 정보의 정확한 전달
구조적인 문장의 작성
적절히 구조화된 HTML을 효과적으로 작성하기 위해서는 마크업 하기 전의 원고가 구조적일 필요가 있습니다. 즉, 원래의 원고가 표제, 타이틀, 단락, 리스트, 표, 사진, 그림 등의 요소가 잘 구별지어져 있는 동시에, 그것들이 논리적으로 배치되어야 합니다. 그러기 위해서는 원고 집필자가 논리적인 Writing 방법을 사용하고, 적절한 타이틀과 함께 논리를 전개 하는 Web Writing을 잘 이해하고 실천 할 수 있어야 합니다. 얼핏 보면 귀찮다고 생각할지 모르지만, 전체적인 사이트 운용에 있어서는 부담이 줄어드는 효과가 있습니다. 정리되지 않고 논리 전개가 미흡한 원고를 구조적으로 수정한 후에 적절하게 마크업하는 것은 큰 수고지만, 원래의 원고가 구조적이라면 Mark up에 드는 수고는 확연히 줄어들기 때문입니다. 또, 이러한 작업은 콘텐츠의 품질 향상에도 큰 공헌을 할 것입니다.
텍스트 정보를 활용하는 것의 장점
웹 접근성 확보 작업은 유저가 어떤 일반적이지 않은 수단을 사용하고 있어도, 어떤 환경에 있어도, 모든 웹 콘텐츠에 액세스 할 수 있도록 보장하려고 노력합니다. 모든 유저가 모든 웹 콘텐츠에 액세스 할 수 있도록 하는 가장 확실한 방법은 모든 콘텐츠에 같은 레벨의 텍스트를 사용하는 것입니다. 텍스트 정보는 특정 플랫폼이나 유저 에이전트에 의존하지 않는 정보이기 때문에, 모든 정보를 텍스트로 표현 할 수 있다면 웹 사이트의 접근성은 높아질 것입니다. 텍스트 정보에 따른 콘텐츠 제공에는 다음과 같은 장점이 있습니다.
- 화면 상으로 보기 때문에 시각적인 정보로 액세스 할 수 있다.
- 낭독 기능을 사용하기 때문에 청각적인 정보로 액세스 할 수 있다.
- 점자 변환 기능을 사용하기 때문에 촉각적인 정보로 액세스 할 수 있다.
- 검색엔진 로봇이 크롤할 수 있어 Index가 가능하다.
그 사이트에 따라 중요한 콘텐츠일수록 특정 브라우저에 의존할 필요가 없는 형태로 표현해야 하는데, 특히 텍스트를 통해 표현하는 것은 범용성・재이용 가능성이 높고, 액세스 가능성이 높아 SEO에도 도움이 됩니다.
도달 가능성의 향상
웹 접근성을 확보하기 위한 작업은 고령자나 장애인을 위한 작업만을 가르킨다는 문맥으로 쓰이는 경우가 많지만, 실제로는 SEO와의 관계에서 인터넷 유저의 대다수를 차지하고 있는 정상적인 유저에게 있어서도 중요한 작업입니다. 「접근성」은 직역하면 「도달 가능성」이고, 「사이트 안에서만 완료된다」가 아닌 「어떻게 그 사이트에 도달(액세스)하는가? 또 도달(액세스)하기 쉬운가?」라는 점까지 생각 할 수 있다면 좋겠습니다.
거기서 중요한 역할을 담당하는 것이 SEO입니다. 검색엔진 로봇을 배려해서 제작된 사이트는, 검색 결과를 경유 한 외부로부터의 「도달 가능성」을 향상시킬 수 있습니다. 웹 접근성의 향상은, SEO에 있어 크롤러빌리티와 인덱서빌리티의 향상과 이어지고, 나아가서 사이트 전체의 트래픽 향상으로도 이어집니다.
다음 콘텐츠도 참조하시면 좋습니다