상세 컨텐츠

본문 제목

Responsive web tester-반응형 디자인 디바이스별 화면 한 번에 체크하기

삶은브랜드/마케팅&광고

by 브랜드보일러 진소장's 2016. 7. 12. 22:03

본문

반응형 디자인 디바이스별 화면 한 번에 체크하기


디지털 마케팅에서 웹사이트(홈페이지)는 집을 이루는 중요한 플랫폼입니다.

모바일 시대에 접어들면서 큰 문제가 생겼습니다. 디바이스에 대한 최적화 된 화면을 보여주는 크로스 디바이스입니다.

단지 데스크탑이나 노트북에서만 최적화 된 화면(가로가 1280 픽셀 이상 모니터)을 구성했던 예전과 다르게 모바일 시대에는 갤럭시, 아이폰, 아이패드 등 스마트폰, 태블릿 등 각종 디바이스 화면에 적합한 화면을 보여주어야 합니다.


다양한 모니터에 대한 최적화 된 화면의 요구에 따라 나타난 웹 기술이 '반응형 웹'입니다.

반응형 웹의 이해가 부족한 분은 예제를 보시면 바로 감이 오실 겁니다. 


https://responsivedesign.is/examples


디지털 마케팅 최적화에서 자신의 홈페이지가 여러 디바이스에서 잘 보여지는 가를 확인합니다. 각 PC모니터 크기, 스마트폰별 화면 등.

하지만 개인이 모든 디바이스를 보유할 수 없기에 이런 화면을 한번에 확인 할 수 있는 여러 툴이 존재합니다.

오늘은 가장 잘 구성된 몇 가지 반응형 웹 테스트(반응형 웹 테스트 툴)를 소개합니다.







01) http://troy.labs.daum.net/


다음에서 서비스하는 반응형 테스트 툴로서 가장 많이 사용하고 있습니다.

사용하기도 편하고 다른 테스터와 달리 유일한 국산이며, 한국어로 구성되서 편리합니다.


02) http://www.responsinator.com/


엄청나게 심플한 UI로 딱 봐도 어떻게 사용하면 되는지 감이 옵니다.

하지만 너무 심플해 확인할 수 있는 디바이스에 다양하지 않습니다.


03) http://responsivedesignchecker.com/


간편하게 사용할 수 있고 어느 정도 다양한 디바이스 요구에도 충족하지만 UI가 그다지 깔끔하진 않습니다.


04) http://quirktools.com/screenfly/


외국산 반응형 테스트 툴 중 가장 자주 사용하는 곳입니다. UI도 편하고 다양한 요구도 충족합니다.

무엇보다 화면 픽셀을 확인할 수 있도록 되어 있어 좋습니다.

관련글 더보기

댓글 영역