반응형 웹디자인이란?


화면의 크기에 따라서 자동으로 크기가 조절되는 웹디자인. 화면을 줄이면 그에 맞추어서 최대 너비도 함께 조절된다.


대표적인 반응형 웹디자인은 위키백과 사이트 등이 있다. 해당 홈페이지가 반응형인지 아닌지 보고 싶다면 브라우저의 크기를 줄여 보자. 가로 스크롤만 생기고 화면 자체가 작아지지 않는다면 일반 PC 홈페이지고, 화면이 크기에 맞추어 조정된다면 반응형이다.




현재 이 티스토리의 스킨 또한 반응형으로 제작되어 있다. (스킨 출처 : http://windup.beintous.net ) 반응형으로 제작하면 좋은 점은 각종 다양한 모바일 디바이스에서 쉽게, 깨지지 않는 화면을 확인할 수 있다는 것이다. 


모바일 디바이스는 아주 다양해지고 있다. 스마트폰 외에도 태블릿PC, 노트북으로도 태블릿으로도 쓸 수 있는 탭북, 그 사이에 있는 화면 크기를 가지고 있는 다양한 모바일 기기 등등 셀 수도 없이 많은 상품들이 나오고 있다.


2013년에 대비해서 2014년의 통계를 보자면 4인치 이하 스마트폰이 11% 감소하였으며, 4인치 초과 스마트폰은 연간 132% 성장 비율을 보이고 있다. 또한 소셜 네트워크를 통해 특정 홈페이지로 방문하는 경우, 그 중 36%가 데스크톱이나 랩톱이 아닌 태블릿과 스마트폰이다. (통계 출처 : visualdive.co.kr) 이 말은 곧 작은 스마트폰만 아니라 아주 다양한 크기의 화면을 가진 기기들이 나오고 있다는 뜻과 같다.


만약 모바일 홈페이지를 제작했는데 어떤 기기에서는 선명하게 나오고 어떤 기기에서는 깨져 보인다면 이는 실패한 홈페이지라고 보아야 할 것이다.


모바일 홈페이지를 제작하는 일반적인 목적은 다음과 같다.


1. 작은 화면으로도 쉽게 컨텐츠를 제공하기 위해서

2. 지하철이나 길거리에서도 빠른 로딩을 제공하기 위해서


스마트폰이나 태블릿으로 인터넷을 이용하는 고객들은 대부분 "빨리", "즉각적으로" 정보를 얻길 원한다. 작은 화면을 오래 붙들고 손으로 확대해가며 읽기 원하는 사람은 아무도 없다. 그래서 반응형 웹디자인이 중요한 것이다.








또한 최근 들어서 워드프레스의 점유율이 증가함에 따라, 워드프레스를 이용한 깔끔한 디자인이 인기를 얻는 것도 반응형 웹디자인의 유행 이유라고 볼 수 있다.

특히나 워드프레스로 된 홈페이지는 검색엔진 최적화에 유리한 조건을 몇 가지 갖추고 있기 때문에 SEO 마스터들에게 인기가 많다. 



우리 기업은 고작해야 작은 기업인데, 그냥 PC홈페이지만 있어도 되지 않을까 생각할 수 있다. 그러나 지역고객을 중시하는 업체일수록 더더욱 모바일에 최적화된 홈페이지가 필요하다. 그 이유는 다음과 같다.


- 특정 지역명과 업종을 함께 검색하는 고객들은 해당 서비스를 '특정 지역에서', '빨리' 이용하고자 하는 경향이 있다.

- 빠른 검색을 통해서 이동 중에 모바일 기기로 검색하는 경우가 많다.

- 이 때 자신의 기기와 호환이 안 되는 홈페이지는 고객에게 외면 당한다.




또 한 가지 반응형 웹디자인이 가지는 장점은 PC홈페이지와 모바일을 따로 제작하지 않아도 된다는 것이다. 

일정한 규격에 맞추어 컨텐츠를 제작해 업로드하면 홈페이지는 알아서 화면을 인식하고 크기를 조정한다. 


모바일 시장이 커지면 커질수록 반응형웹은 점점 더 인기를 끌 것이다. 이는 누구도 부정 못할 사실이다. 그리고 이제 홈페이지 없는 업체를 찾아보기 힘들기 때문에, 하루라도 빨리 제작해서 SEO를 진행하는 것이 유리할 것이다.






'반응형웹'이라는 단어를 들어 본 적이 있을 것이다. 반응형웹이란 말 그대로 해당 기기 종류에 반응해서 화면을 최적화시켜 주는 웹사이트를 뜻한다.

PC로 접속한 사람은 PC화면에 맞는 홈페이지를, 그리고 스마트폰으로 접속한 사람은 스마트폰 크기에 맞는 홈페이지를 볼 수 있는 것이 바로 반응형웹이다.


이러한 반응형웹은 반드시 필요할까? 그리고 필요하다면 어떤 장점이 있을까?






반응형웹은 똑같은 주소로 여러 가지 기기에서 접속할 수 있다.


모바일 기기로 홈페이지를 접속하면 모바일 홈페이지의 경우는 흔히 주소 앞에 'm'이 붙게 된다. 즉, 아예 URL 자체가 다르다는 뜻이다. 흔히 모바일 기기에서 PC 주소로 접속하게 되면 자동으로 모바일 주소로 고쳐지기도 하는데, 이러한 경우에는 주소가 리디렉션되는 동안의 시간이 걸리고, 속도가 느리다는 단점이 있다.


그러나 PC 버전과 모바일 버전으로 각각 홈페이지를 만들 필요 없이 반응형웹을 제작하게 되면 이 불편한 점들을 해결할 수 있다. 제작 시에 컨텐츠를 일일이 옮겨올 필요도 없다. 


또한 매우 중요한 사실 하나가 있다. 바로 반응형웹은 검색엔진에서 최적화가 되기 쉽다는 점이다. 

검색엔진의 입장에서 모바일웹과 PC웹을 각각 URL을 제작하게 되면 중복문서로 여길 수도 있지만 반응형웹은 이러한 걱정도 할 필요가 없게 된다. 검색엔진에서 선호한다는 이유뿐만 아니라 소비자의 입장에서도 홈페이지를 탐방할 때에 훨씬 편하고, 컨텐츠를 등록하는 입장에서도 편하다.




반응형웹은 보통 워드프레스로 작업할 수 있으며, 최근 워드프레스의 높아지는 인기 덕에도 반응형웹은 두고두고 도움이 될 효자가 될 것이다. 




+ Recent posts