Troy, 반응형 홈페이지를 다양한 디바이스에서 테스트하기 위한 앱

오래전에 시작한 서비스이기는 한데 이번에 좀 더 사용하게 되면서 올려보게 되었습니다.

 

카카오에서 나온 Troy 로, 반응형 웹사이트 개발시 다양한 디바이스 환경에서 테스트 하기 편하게 되어 있습니다.

아직 갤럭시9 은 업데이트 안 되어 있던데 다양한 디바이스를 선택하여 (멀티스크린 모드) 테스트 가능합니다.

 

 

Troy 테스트 페이지로 이동

 

 

Troy 를 통하여 테스트 중 발생하는 이슈

 

테스트 할 주소를 입력하였는데 사이트 표시가 되지 않는 경우

 

URL로 입력한 서버의 응답헤더(Response Headers)에 'X-FRAME-OPTIONS' 라는 외부 프레임 로드를 거부하는 옵션이 적용되어 있을 경우에 발생할 수 있다고 합니다.

 

 

테스트 할 주소를 입력했는데 PC 버전으로 보이는 경우

 

Troy 는 CSS 미디어쿼리 기술에 기반한 반응형 웹, 페이지 내 User-Agent 헤더 값으로 페이지를 구성하고 있습니다. 때문에 자동으로 모바일 페이지를 보여주지 않는 경우 주소창에 모바일 페이지 주소를 직접 입력해서 사용해야 합니다.

 

 

 

실제 스마트폰에서 보는 것과 차이가 나는 이유

 

Troy의 결과 화면은 접속한 브라우저를 기반으로 웹사이트를 보여주기 때문에 실제 스마트폰의 폰트, 렌더링 이슈, 디테일한 기기 특성까지 완벽하게 구현되지 않았기 때문입니다. 개발이나 테스트시 참고용으로 이용하는 정도로 활용하면 될 것 같습니다.