공지사항

반응형 웹의 진실! 트렌드 따라가다 내실 놓친다

iSOFTBOX
07.02 17:01

안녕하세요! 아이소프트박스 입니다.  

요즘 반응형 반응형 하는데 인기있다고 유행 따라가시다가 큰 낭패를 보실수 있습니다.

 

모바일 퍼스트 전략은 최소 단위인 모바일을 기준으로 삼아 태블릿, 데스크톱(PC) 순의 더 큰 해상도로 점차 웹페이지를 변형·확장하는 방법이다. 기획자는 이 전략을 바탕으로 사용자 환경 변화에 퍼센트(%)로 반응하게 할 것인지, 물리적 사이즈(해상도)로 반응하게 할 것인지 등의 기준을 잡고 웹의 레이아웃을 설계하게 된다. 이때 ‘레이아웃 단순화’를 핵심으로 삼는다. 

 

또한 레이아웃 안을 채울 콘텐츠는 일관된 형태여야 하며 디자인 또한 통일감 있게 표현돼야 하는데, 화면 사이즈에 따라 바뀌는 유동적 레이아웃을 최소 사이즈의 디바이스에서도 어느 정도 가독성 있는 형태로 유지해야 하기 때문이다. 이렇게 기획된 반응형 웹은 화면이 커짐에 따라 콘텐츠 영역을 넓히는 방식을 택하기 때문에 복잡한 화면 설계를 필요로 하지 않는다.

 

그런데 이 전략은 우리나라 IT시장에서 난항을 겪을 수밖에 없다. 우리는 많은 정보를 압축해 한 화면에 표현하는 것을 선호하는 편이다. 이는 국내기업이 운영하는 대표 포털사이트 ‘네이버’와 미국 기업이 운영하는 포털사이트 ‘구글’ 첫 페이지만 비교해봐도 쉽게 이해할 수 있을 것이다.

 

일반적으로는 많은 정보를 제공해야 하는 포털이나 쇼핑몰 등에 사용자의 문화적 인지 특성으로 인한 기호(嗜好)가 작용하는데, 기호는 사용자가 웹 완성도를 평가하는 기준이 되고 궁극적으로는 웹 사용빈도에 지대한 영향을 미치게 된다.

 

 

 

예를 들어, 많은 정보를 한 화면에서 보고 싶어 하는 우리나라의 사용자는 콘텐츠 양이 적거나 이미지 사용이 적은 웹을 ‘완성도가 떨어진다’고 평가하고, ‘정보가 없네’, ‘내가 원하는 사이트가 아냐’라고 판단해 더 이상 사용하지 않게 된다는 것이다.

 

 

 

이러한 ‘웹 구현 방식’과 ‘사용자 만족도’ 간의 인과관계는 기업 업무용 시스템에서 더욱 명확하게 드러난다. 웹 구현방식이 사용자 기호, 즉 사용자 편의성에 부합하느냐에 따라 생산성 및 업무효율성에 극명한 차이를 보이기 때문이다.

 

 

 

반응형 웹이 해결해야 할 이슈가 단순히 사용자 기호에 국한된 것이라면 그나마 다행이련만, 반응형 웹은 더 큰 숙제들을 떠안고 있다. 현실적으로 반응형 웹 구현에 있어 기획자가 처음 기획했던 대로 원하는 가독성을 얻기란 많은 경우 불가능하다.

 

 

 

물론 모든 텍스트의 가독성이 떨어지는 것은 아니다. 그러나 표를 이용한 텍스트 설명이나 이미지 텍스트를 사용해야 할 경우, 반응형 웹의 기본 논리에 따라 디바이스 해상도에 맞춰 강제로 크기를 축소시키기 때문에 가독성이 떨어지고 결국 정보 전달력이 약해질 수밖에 없다.

 

 

 

PC나 태블릿에 비해 가독성이 떨어지는 모바일 기기에서 로딩속도까지 느리다면 어떨까? 아마도 사용자는 반응형 웹으로 구현된 사이트를 이용하고 싶지 않을 것이다. 그런데 실제로 반응형 웹은 로딩속도 이슈도 갖고 있다.

 

 

 

반응형 웹은 HTML5로 코딩하고 CSS3에 각 디바이스별로 레이아웃을 지정하는 미디어쿼리를 전부 불러오게 되는데, 이때 모든 장치를 위한 CSS를 로드하게 된다. 불필요한 수백 개의 소스를 미리 불러들이는 이 작업으로 웹 로딩속도는 현저히 느려지게 되고, 이는 결국 사용자가 불편함을 느끼게 되는 요인이 된다.

 

 

 

반응형 웹의 로딩속도 이슈는 PC와 태블릿에서도 발생하지만, 이들에 비해 암묵적으로 더욱 빠른 속도를 요구받는 모바일에서는 특히 부각돼 문제시된다. 이뿐만이 아니다. 오래된 웹사이트들은 PC용으로만 제작된 경우가 많아, 기존 사이트를 반응형 웹으로 변경할 경우 사이트를 전부 새로 구축하는 경우가 대다수다.

 

 

 

업데이트상의 문제도 있다. 미디어쿼리를 이용해 웹을 구축한 후 페이지 내 새롭게 콘텐츠를 추가해야 하는 경우, 브라우저, OS(운영체제), 기기, 속도 등과 같은 다양한 변수들에 대해 일일이 테스트를 거쳐야 한다는 번거로움이 발생한다. 간단한 텍스트 수정 정도는 용이할 수 있겠으나, 정보를 담고 있는 콘텐츠의 추가·삭제는 레이아웃을 변경해야 하는 대대적인 작업이 수반된다.

 

 

 

반응형 웹이 무조건 유지보수가 편리하다는 주장은 해상도와 크기에 구애받지 않을 정도의 아주 단순한 콘텐츠만을 보유하고 있거나, 향후 콘텐츠의 추가·삭제가 발생하지 않는 경우에만 해당된다고 보면 된다.

 

 

반응형 웹 언어인 CSS3는 애니메이션과 캔버스 등과 같이 새로운 스타일을 통해 이미지나 플래시(Flash), 자바스크립트(JavaScript)를 사용하지 않고도 웹사이트를 구축할 수 있다는 장점이 있다. 그러나 모든 웹사이트에 HTML5, CSS3를 적용하는 것은 불가능하다.

 

 

당신은 개발자일 수도, 관리자 혹은 기업 IT담당자일 수도 있다. 당신은 눈앞에 닥친 웹사이트 구축 프로젝트를 수행해야 혹은 책임져야 한다. 당장 눈앞에 봉착한 이 프로젝트를 모바일 퍼스트 전략을 바탕으로 반응형 웹을 적용해 단순하게 기획·구축하고, 향후에도 편리하게 관리하고 싶은 마음이 굴뚝같을 것이다.

 

 

그런데 이렇게 만들어진 당신의 웹사이트를 사용자들이 이런저런 불편함을 호소하며 이용하지 않는다면, 그 웹사이트를 만든 의미가 있을까? 

 

 ‘반응형 웹이 최고’라는 잘못된 상식이 부디 당신의 머릿속에서 깨끗하게 지워지기를 바라본다.

 

 

댓글

고객센터
  • 전국 1661-5393

  • 서울 02-6246-1112

  • 평일 am10시 ~ pm6시 (토, 공휴일휴무)

  • help@isoftbox.com

  • 우체국

  • 100164-01-004030

  • 아이소프트박스