반응형 웹페이지 디자인을 도와주는 Mobile/RWD Tester

블로그자료들

by noonwith 2013. 11. 30. 20:48

반응형 웹으로 전환할 계획이거나 반응형 스킨을 사용한다면 내 웹페이지 글이 스마트폰 같은 작은 화면에서 가로 크기에 따라 어떻게 보여지는지 알아야 합니다. 크롬웹스토어를 방문하시면 여러가지 Mobile Tester 무료 확장프로그램이 있으니 설치해서 사용하여 보세요.

아랫글에 이어 반응형 웹페이지 애드센스 광고를 반응형 단위 광고로 교체하는 중입니다.

Mobile/RWD Tester를 사용해 보겠습니다.

크롬웹스토어를 방문합니다.

Mobile Tester를 검색하여 확장프로그램의 Mobile/RWD Teste를 설치합니다.

국내에서 많이 사용하는 것으로 알려진 스마트폰 디스플레이 사이즈를 테스트 할 수 있고 구글 웹로그 분석기를 사용하시는 분은 보고서의 잠재고객/모바일/기기를 선택하시면 접속된 휴대기기 정보를 알 수 있어요.

설치후 크롬으로 웹페이지에 접속후 우측 상단에 표시되는 Mobile/RWD Tester를 사용하실수 있어요.

이제 모바일에서 직접 확인하지 않아도 될 것 같군요..갤럭시S3 선택한 화면입니다. 아이폰5, LG옵티머스, 펜텍 베가 , 갤러시 노트, 아이패드,갤럭시탭을 선택할수 있고 사이즈를 직접입력하여 테스트 할수 있어요.

지원되는 모바일입니다..

Iphone 5 (320 x 568)

Iphone 4 (320 x 480)

Galaxy S 3/4 (360 x 640)

Lumia 920 (384 x 640)

Galaxy Note II (360 x 640)

iPad (all) (768 x 1024)

Galaxy Tab 1/2 10.1 (800 x 1280)

Galaxy Nexus 7 (603 x 966)

Kindle Fire (600 x 1024)

Kindle Fire HD 7" (533 x 853)

Kindle Fire HD 8.9" (800 x 1280)

리스트에 없다고 실망하실 필요 없어요 위그림처럼 직접 크기을 입력할 수 있어요.

반응형 티스토리 스킨 교체 글은 아랫글을 참고하세요.

커피향 나는 이야기들