Skip to content

Posts 검색엔진최적화, 웹접근성, 반응형 웹 디자인 #
Find similar titles

검색엔진최적화, 접근성, RWD(responsive web design)의 공통점에는 보편디자인(Universal design) 원칙이 숨어있다.

검색엔진최적화 #

인간 뿐만 아니라 기계(즉 검색로봇)도 웹 사이트를 잘 읽고 이해할 수 있게 하여 인간과 기계 사이의 차별을 줄여주는 기술을 검색엔진최적화(SEO; Search engine optimization)라고 부른다. 간혹 인간에게만 유익한 내용이나 기계에게만 유익한 내용을 숨기거나 추가하기도 하지만 되도록 인간이 접근하건 기계가 접근하건 최대한 동일한 정보를 보여주려고 노력하는 것이 중요하다.

사실 인간과 기계의 구분은 대단히 작위적이다. 아무런 기계의 도움 없이 인터넷에 접속하는 인간은 존재하지 않고 우리는 좋던 싫던 이런저런 다양한 수준으로 기계에 의존하고 있다는 점에서 인간과 기계를 명확히 구분하는 시도는 크게 보아 부질 없다. 다양한 수준의 의존이란 아래와 같다:

  • 우리는 웹 브라우저를 통해 웹 사이트에 접속한다. 극히 제한된 상황이 아니라면 telnet으로 GET / HTTP/1.1을 입력하여 웹에 접근하지 않는다. 검색엔진최적화가 되어 있어야 웹 브라우저라는 UA(User agent)가 인간을 더 잘 도와줄 수 있다. 예를 들어 검색쿼리를 POST로 날리거나, iframe을 남발하는 일부 바보같은 사이트들에서는 원하는 페이지를 즐겨찾기 하거나 친구에게 주소복사하여 보내주기 대단히 어렵다.
  • RSS 리더를 사용하거나, 지메일로 수신한 아마존 이메일이 보여주는 편리한 "Order now" 버튼(schema.org에 따르는 마크업을 지메일이 인식)을 이용해봤다면 추가적으로 기계의 도움을 받고 있는 것이다. RSS나 schema.org 등은 중요한 검색엔진최적화 수단들이다.

웹접근성 #

비장애인 뿐만 아니라 장애인도 웹 사이트를 잘 읽고 이해할 수 있게 하여 비장애인과 장애인 사이의 차별을 줄여주는 기술을 웹접근성(Web accessibility)이라고 부른다. 간혹 비장애인에게만 유익한 내용이나 장애인에게만 유익한 내용을 숨기거나 추가하기도 하지만 되도록 비장애인이 접근하건 장애인이 접근하건 최대한 동일한 정보를 보여주려고 노력하는 것이 중요하다.

사실 비장애인과 장애인의 구분은 대단히 작위적이다. 아무런 장애도 없는 수퍼맨 같은 인간은 존재하지 않고 우리는 좋던 싫던 이런저런 다양한 수준의 장애를 가지고 있다는 점에서 비장애인/장애인을 명확히 구분하는 시도는 크게 보아 부질 없다. 다양한 수준의 장애란 아래와 같다:

  • 저시력, 노안
  • 지하철에서 손잡이를 잡고 있으면 한 손만 사용 가능한 상황
  • 급작스런 상황에서 일시적 판단력 저하
  • 날이 추워서 핸드폰을 주머니에서 꺼내기 싫으면 적어도 핸드폰 조작에 있어서는 맹인
  • 장갑을 끼고 있으면 정전식 터치 패널을 손으로 조작할 수 없음
  • TV에서 재미난 영화가 하고 있어서 쇼파에서 벗어날 수 없는 상황이라면 일시적으로 다리가 없어진 것과 마찬가지

반응형 웹 디자인 #

데스크탑을 쓰는 사람 뿐만 아니라 모바일 기기, 스마트와치 등을 쓰는 사람도 웹 사이트를 잘 읽고 이해할 수 있게 하여 다양한 기기를 쓰는 사람들 사이의 차별을 줄여주는 기술 중 하나를 반응형 웹 디자인(RWD)이라고 부른다. 간혹 데스크탑에서만 유익한 내용이나 모바일 기기에서만 유익한 내용을 숨기거나 추가하기도 하지만 되도록 다양한 기계에서 최대한 동일한 정보를 보여주려고 노력하는 것이 중요하다.

사실 데스크탑과 모바일 등 기기간의 구분은 대단히 작위적이다. 완전한 데스크탑 PC나 완전한 모바일 기기 같은 것은 좀처럼 존재하지 않는다. 기기 사이에 명확한 선을 그으려는 시도는 크게 보아 부질 없다. 예를 들어보면 이렇다:

  • 마이크로소프트 서피스 같은 타블릿 PC는 데스크탑인가 모바일인가. 키보드를 합쳐놓으면 데스크탑이고 분리하면 모바일인가? 무릎에 올려놓고 쓰면 갑자기 노트북(랩탑)인가?
  • 페블릿(Phone + Tablet)은 타블릿인가 모바일폰인가?
  • 몇 인치 이하를 "작은 화면"으로 정의할 것인가?
  • 아이패드를 사용하는 가장 흔한 패턴은 "쇼파에 편하게 기대서"인데, 정말로 아이패드로 접속하는 사용자가 "모바일 맥락(mobile context)"에 있다고 가정할 수 있나? 바쁜 비즈니스맨이 이동 중에 일처리하려는 맥락과 쇼파에 기대서 무한도전 보다가 잠깐 심심해서 휴대폰 들여다보는 맥락을 정말 "모바일 맥락"이라는 말로 묶어도 되는건가?

다 합쳐보면 보편 디자인(Universal design) #

눈치를 챈 분도 있겠지만 위 세 분야를 설명하며 문장 형태와 구조를 최대한 일치시켜 보았다. 저 셋 사이에 유사성이 상당히 많은데, 이 셋을 묶을 수 있는 디자인 용어로 보편 디자인(Universal design)이라는 것이 있다. 물론 보편 디자인은 접근성과 관련한 맥락에서 쓰이는 용어이기는 하지만, 조금 확장해보면 그렇다는 뜻이다.

이렇게 공통점이 많다보니, 셋 중에 어느 하나를 잘 하면 나머지 둘도 덩달아 좋아진다. 웹접근성을 향상시키면 검색엔진최적화도 잘 되고 다양한 기기에도 더 잘 대응할 수 있게 된다. 혹은 RWD를 했더니 검색엔진최적화와 웹접근성이 향상되거나 등등.

이 셋을 합쳐서 생각할 때 얻을 수 있는 또다른 이득은, "내가 지금 이걸 제대로 하고 있나?"에 대해 대단히 확실한 가이드라인을 얻을 수 있게 된다는 점이다. 예를 들어 난생 처음 RWD 프로젝트를 하는 와중이라고 치자. 뭔가 디자인적인 혹은 기술적인 의사결정을 해야하는 타이밍에서 그 결정이 옳은 것인지 아닌지 확신이 들지 않는 경우가 있다. 국내외 레퍼런스도 딱히 못찾겠다. 이럴 때 쓸 수 있는 대단히 확실한 가이드라인은 "이렇게 결정하면 검색엔진최적화 및 웹접근성 측면에서도 향상이 일어나는가?"이다.

실무적으로 유용하고, 비즈니스적으로 유익하며, 도덕적으로 올바르다.

Suggested Pages #

Other Posts #

0.0.1_20140628_0