웹 페이지 다른 디바이스로 보는 방법

PC용 크롬에서 특정 웹 페이지를 다른 디바이스로 보려면 User-Agent Switc

her 등과 같은 확장 프로그램을 설치해 사용하면 쉽게 다른 디바이스로 전환

하여 웹 페이지를 테스트해 볼 수 있는데요.

크롬의 자체 기능만으로도 확장 프로그램 못지않은 여러가지  디바이스로 웹

페이지를 테스트해 볼 수 있습니다.

즉 내가 블로그에서 발행한 글이 아이폰이나 아이패드, 넥서스, 갤러시 화면으

로 전환하여 블로그 페이지를 볼 수 있다는 얘긴데요.

물론 마이크로소프트 엣지나, 인터넷 익스플로러에도 비슷한 기능은 있습니

다. 엣지나 IE를 실행해 특정 페이지로 이동하여 F12 키를 누르고 개발자 도구

화면이 열리면 애뮬레이션 탭을 선택하고, 왼쪽 모드 옵션 브라우저 프로필의

콤보 박스에서 윈도우 폰을 선택하면 해당 디바이스로 전환되는데요.

엣지나 IE가 데스크톱 모드와 윈도우 폰 모드 2가지 밖에 없는 반면,크롬은 여러가지의 디바이스가 준비되어 있습니다.

크롬으로 웹 페이지를 다른 디바이스로 보기

크롬을 실행하고 특정 웹 페이지를 방문하여 페이지 빈공간을 우클릭해 열린 메뉴에서 검사 탭을 누르면

간단히 개발자 도구가 열리는데요.

그러나 제 블로그처럼 우클릭 금지 페이지에서는 우클릭 메뉴가 열리지 않아 쓸데 없는 짓이 되고 맙니다.

그럴 땐 만고의 진리~ F12 키를 누르고 개발자 도구를 불러온 후, 화면 상단 빨간 화살표 처리된

토글 디바이스 모드 아이콘을 누릅니다. 

왼쪽 화면이 데스크톱 모드에서 All 디바이스 모드로 바뀌는데요.

상단 Device의 Select Model 콤보 박스를 열어 원하는 디바이스를 선택하면 해당 디바이스 크기로 전환되고,

전환된 웹 페이지를 스크롤해 가며 확인하면 내 블로그 페이지나 다른 웹 페이지가 여러 디바이스에서도

잘 적용되는지 테스트해 볼 수 있습니다.