깜박이는 것들은 가라!

우리 나라 웹 페이지들에서만 발견되는 좋지 않은 특징을 몇 가지 들어보라면 뭐가 있을까? 나는 여기 저기서 난무하는 깜박임과 움직임, 잘 보이지도, 예쁘지도 않은 흐릿한 텍스트, 플래시 메뉴 정도를 들고 싶다. 이런 것들이 정부, 국가 기관, 비영리 기관, 일반 기업, 포털, 대학 등을 가리지 않고 총체적으로 악명높은 한국적인 웹을 두드러지게 만드는 요소인 것 같다. 그 중에서 깜박임과 움직임의 문제는 W3C의 웹 콘텐츠 접근성 지침에서 중요도 1로 다룬 상당히 심각한 것인데, 국내에서는 접근성을 고려해 개편을 했다는 웹 페이지들도 깜박임과 애니메이션에 대해서만큼은 무한정의 관대함을 보여주고 있다.

그러면 왜 서구의 웹 페이지들이 깜박임이나 움직임을 쓰지 말라고 지침을 만들었을까? (깜박임을 제한하는 W3C 지침, 미국 재활법 508조 규정 (h)와 (k), HP의 지침, IBM의 지침, BBC 지침)

• 1초에 약 2회에서 59회 사이의 깜박임에 노출되는 것은 일부 사람들에게 광과민성 발작을 일으킬 수 있다. 가장 심각한 것은 1초에 약 20회 내외의 깜박임이다.


• 움직이는 메뉴나 텍스트, 그림을 선택하는 것은 뇌병변 장애가 있거나, 마우스 사용이 서툰 초보 사용자, 노인, 키보드 사용자가 콘텐츠에 접근하지 못하게 만드는 원인이 된다. 제한된 시간 내에 사용자한테 무슨 동작을 하도록 요구하는 것은 사용자를 전혀 배려하지 않는 제작자의 오만이다.


• 텍스트나 그림이 움직이거나 깜박임을 유지하기 위해, 해당 영역이 지속적으로 업데이트되는 경우, 시각 장애인용 스크린 리더는 해당 영역만 반복적으로 읽어주면서 다른 영역으로 가지 못하는 현상이 생긴다.


• 난독증이나 인지 장애가 있는 사람들, 글을 읽는 것이 서툰 외국인들은 빠르게 변하는 그림과 텍스트를 이해하기가 훨씬 어렵다.


• 화면 확대기를 쓰는 사람들은 화면의 좁은 부분을 확대해서 봐야 하는데, 좁은 부분만 봐서는 깜박이거나 변해가는 내용을 이해할 수 없다. 확대할 영역을 이동해가면서 본다고 하더라도 이미 시간이 지나면서 내용이 바뀌어버렸으므로 이해가 불가능할 수도 있다.


• 첫 화면에 불필요한 플래시나 애니메이션을 넣음으로써 페이지 로딩 속도가 현저하게 늘어난다. 나는 펜티엄 3, 450Mhz와 PCI 방식의 16MB짜리 구형 S3 그래픽 카드, 그리고 리눅스(페도라 코어)와 오페라를 사용한다. 이 환경에서 첫 화면과 메뉴를 플래시로 도배한 국내 홈페이지들을 보거나 탐색하기 위해서는 상당한 인내와 자비심, 평정심이 필요하다.


• 화면 여러 군데에서 깜박임이 나타나게 되면, 사용자는 어디에 주목하고 시선을 둬야 할 지 혼란스럽다. 메뉴부터 시작해서 공지사항, 링크, 광고 모든 것이 깜박이니 도대체 뭘 주목하라는 것인지...


• 화면이 온통 움직이는 사이트들은 (실험해보지는 않았지만) 어쩌면 사람들에게 덜 인상적이고 더 기억하기 어려울 수 있다. 내용과는 별 상관도 없는데 메뉴를 치장하느라고 무겁고 느린 플래시를 덕지덕지 붙여놓은 사이트들은 단 한 장의 강렬한 그래픽 이미지로 사이트 전체의 느낌과 메시지를 나타낸 사이트에 비해 인간에게나 기계에게나 처리해야 할 정보량은 많고, 그 사이트를 기억하게 만드는 특징점은 줄어들 수 있다.


• 요즘에 잘 쓰이지 않지만 텍스트를 깜박이거나 움직이게 하는 <marquee>와 <blink>는 HTML 표준에 없는 것들이다. 모든 웹 표시장치들이 그것을 지원한다고 보장할 수 없다.

깜박임이나 움직임은 필요한 곳에 써야 한다. 왜 첫 화면부터 사용자는 원하지도 않았는데 플래시 애니메이션을 지루하게 봐야 하는가? 깜박임과 움직임이 자주 쓰이는 곳들을 짚어보았다.

움직이는 뉴스

우리 나라 정부 사이트들은 국정 브리핑 자료나 뉴스를 나타내기 위해 좁디 좁은 화면에 텍스트들이 위로 흘러가거나 좌우로 흘러다닌다. 길거리 광고도 아니고 이게 무슨 짓인가? 그렇게 흘러가는 것 보면서 내가 원하는 것 나오면 잽싸게 마우스로 낚아채라고 마우스 훈련 시키는 것인가? 이런 경우는 그냥 화면을 넓게 쓰고 보여주고 싶은 것을 움직이지 말고 다 보여주면 된다. 그래도 좁다고? 그러면 가장 최신 것, 또는 가장 보여주고 싶은 것만 보여주고 나머지는 [전체 보기]를 눌러서 보도록 하면 된다.

첫 화면 플래시

정말 나쁜 추세인데 우리 나라 웹 페이지들이 첫 화면에 플래시 애니메이션, 광고를 넣는 것도 모자라 메뉴를 죄다 플래시로 만들어가고 있다. 플래시 메뉴도 점잖게 나오는 것이 아니고 온갖 불필요한 애니메이션을 다 집어넣어 만들고 있다. 선택하지 않은 애니메이션은 없어져야 한다. 정말 강조해서 전달하고 싶은 메시지, 우리 회사/우리 기관이 방문자에게 호소하고 싶은 구호를 보여주려면 정말 중요한 것 하나를 간결하게 골라서 정적으로 보여주면 된다. 사용자들에게 호소력있게 메시지를 만들고 내용을 담고, 시각적으로 배치하는 것은 기획자의 노력의 산물이다. 그런 고민을 하지 않고, 무작정 이것 저것 번갈아가면서 다 보여주려고 하는 것은 기획자의 게으름이 산물이다. 게다가 굳이 그런 구호를 글자가 춤을 추면서 나오도록 하고, 새가 날아다니고, 구름이 흘러가면서 보여주어야 겨우 사용자들의 시선을 끌 수 있다고 생각하는 것도 기획자의 게으름과 유치함을 드러내는 것일 뿐이다.

플래시 애니메이션

제품 사용법을 소개하는 플래시 애니메이션을 쓰겠다고 하면 대찬성이다. 사용자가 제품 소개 플래시 애니메이션 보기와 같은 링크를 선택한다는 전제하에. 그리고 플래시를 볼 수 없는 사용자나 플래시보다 더 빨리 내용을 보고 싶은 사람, 내용을 인쇄해서 보고 싶은 사람을 위해 텍스트로 보기, PDF로 보기와 같은 대안적인 링크도 제공해주어야 한다.

플래시 비디오

요즈음은 플래시가 애니메이션 영역에서 벗어나 스트리밍 비디오로 많이 쓰이고 있다. 사실 반가운 일이다. 기존의 윈도우즈 미디어는 윈도우즈에서만 볼 수 있고, 퀵타임은 리눅스에서 볼 수 없고, 리얼 미디어는 리얼 플레이어 다운로드 받기가 너무 어렵다. 반면에 플래시 비디오는 플래시 플러그인을 깔아야 하긴 하지만 대부분의 OS와 브라우저에서 볼 수 있으니 일단 훨씬 많은 사용자를 수용할 수 있다. 이렇게 사용하는 경우에도 오디오를 듣지 못하는 청각 장애인이나, 사운드 카드가 없는 사용자, 성질이 급해 텍스트만 빨리빨리 보면서 넘어가고 싶은 사용자, 외국인 등을 위해 캡션을 넣어주어야 한다. 그리고 재생, 멈춤, 앞으로 가기, 뒤로 가기, 음량 조절, 소거, 속도 조절, 화면 크기 조절, 캡션 표시 여부를 사용자가 제어할 수 있게 해주어야 한다.

광고

국내에서 최근에 유행하는 모든 형태의 플래시 광고는 모든 사람에게 짜증을 유발하는 공공의 적인 것 같다. 게다가 화면의 주요한 내용을 가리면서 등장하는 플래시 광고는 아마 대부분의 사용자들이 싫어할 것이다.

플래시나 깜박임을 쓰지 않고도 사용자에게 전달하고자 강조하고자 하는 메시지만 간결하게 그래픽으로 나타낸 외국 사이트들은 매우 많다. 그리고 그와 대조적인 한국의 사이트들도 너무 많다. 2006년 7월 24일 현재 시점에서. 언제 바뀔지 모르므로...

• 메인 이미지 하나로 시의적절한 key message를 전달하는 General Electric사의 홈페이지, 이와는 대조적인 한국의 삼성전자와 엘지전자


• 전달하고자 하는 캠페인의 주요 포인트(What CEO wants. How the CIO delivers it.)를 아주 간단한 애니메이션으로 나타낸 IBM사의 홈페이지


• 대학 캠퍼스의 자유로운 풍경을 한 장의 사진에 담아내고 첫 페이지에서부터 RSS에 대한 링크가 눈에 띄는 가보고 싶게 만드는 차분한 옥스포드 대학교 홈페이지


• 기억에 남는 이미지는 거의 없는데, 메뉴를 선택하는데에 엄청나게 복잡한 플래시를 쓴 이유를 아무리 생각해도 알 수가 없는 고려대학교 홈페이지


• 나는 정말 자동차에 대해 알아보려고 방문했는데 방문한 고객에게 총체적인 짜증을 유발하며 고객을 내쫓는 한국의 GM대우 홈페이지


• 같은 GM인데도 한국과 미국의 홈페이지 문화 차이를 너무 극명하게 보여주는 미국의 GM사 홈페이지. 원하는 차에 대한 정보를 어떤 곳에서 더 빨리, 더 쉽게, 더 정확하게 찾을 수 있을까?


• 비슷한 성격이지만 사이트 모든 곳이 다 깜박이고, 움직이고, 마우스 갖다 대면 요동을 치는 한국의 옥션과 오로지 가운데 작은 광고 하나만 약간 움직이다 마는 미국의 eBay


• 한국에서 웹 접근성 캠페인을 벌이지만 깜박임, 플래시 메뉴, 흐르는 텍스트까지 스스로 만든 접근성 규칙을 지키지 않는 한국 정보문화 진흥원과 미국 유타 주립 대학 내에서 접근성 관련 정보를 제공하며 스스로 사이트를 매우 접근 가능하게 만들어놓은 비영리 기관인 WebAIM

한국은 초고속 인터넷이 발달해서, 또는 한국 사용자들의 미적인 수준이 높아서 메뉴에서부터 플래시를 써야만 한다고 제발 우기지 말았으면 좋겠다. 정말 사용자의 주의를 끌고 싶고 멋지게 만들고 싶으면 무조건 깜박임을 쓸 것이 아니라, 사용자의 행동 특성을 연구해서, 정교한 문구와 메시지에 걸맞는 인상적인 이미지, 그리고 내용물의 적절한 선택과 배치를 어떻게 할 것인지 머리를 싸매고 연구해야 한다. 아무리 초초고속 인터넷이 발달한다고 하더라도 예측 불허의 움직임과 깜박임이 사용자에게 불편함을 주고 장애인에게 좌절을 준다는 것을 결코 잊지 않았으면 좋겠다.