블로그 기기별 모바일 화면 보는 방법(다음 트로이)
자신이 운영 중인 홈페이지나, 블로그가 모바일 기기에서는 어떻게 보일까 궁금하신 분들에게 도움되는 Daum Troy labs 서비스입니다.
데스크톱이나 핸드폰에서 주소를 입력하면 기기별 모바일 화면을 확인할 수 있습니다.
블로그를 비롯해 대다수의 이용자들이 모바일 환경으로 접속하는 만큼, 데스크톱(PC) 환경에서 보이는 모습보다. 반응형 모바일 화면에서 어떻게 보이는지가 중요합니다.
저도 다음 트로이 랩스를 알기 전까지는
제가 작성한 블로그 포스팅을 제 휴대폰으로 확인하는 작업을 진행했었습니다.
하지만 이 방법도 어디까지나 제 기기에서 보이는 모습을 확인하는 것일 뿐, 다양한 기기에서 포스팅이 어떻게 보이는지는 알 수 없기 때문에 아쉬움이 남았습니다.
Daum Troy labs를 활용하면 모바일 반응형 웹페이지 테스트를 쉽게 진행할 수 있습니다.
다음 트로이 랩스 바로가기
제공되는 기능
· 다양한 모바일 기기 제공
· 기기별 해상도 정보제공
· 멀티스크린 모드 지원
Daum Troy labs 진입 화면
Daum Troy labs (http://troy.labs.daum.net/)로 진입 후 왼쪽을 확인하면, 휴대폰 제조사 목록을 확인할 수 있습니다. (위 이미지 참고) 휴대폰 제조사와 제공되는 모델이 폭넓게 지원되기 때문에 충분한 모바일 환경 테스트가 가능합니다.
· 제조사 목록
Samsung, Apple, LG, Google, Pantech, HTC, Sony, Xiaomi, Huawei, Lenovo, ZTE, PC Screen
· 제조사 별 기기 목록
제조사별 기기 목록은 약 40개 이상으로, 해당 제조사의 주력 기기들은 거의 다 확인할 수 있습니다.
그리고 다음 트로이 랩스는 꼭 데스크톱(PC)이 아니더라도 핸드폰에서도 접속이 가능하기 때문에 간편하게 웹페이지의 모바일 환경을 체크할 수 있습니다.
Daum Troy labs 사용방법
사용방법은 간단합니다. 왼쪽에서 모바일 화면을 확인하고 싶은 제조사의 기기 명칭과 모델을 선택하고, 웹페이지 주소를 입력하면 모바일 반응형 웹페이지 테스트를 진행할 수 있습니다. (위 이미지 참고)
제조사의 기기별로 모델 명칭, 해상도, CSS Pixel Ratio에 대한 정보를 제공하기 때문에 간편하게 모바일 환경을 확인할 수 있습니다.
이 방법을 적용해서 본인의 블로그를 둘러보면,
생각하지 않는 문단에서 글이 틀어지거나, 미관적으로 포스팅을 저해하는 부분을 확인할 수 있기 때문에 모바일 사용자를 고려한 포스팅을 작성할 수 있게 됩니다.
멀티스크린 모드
멀티 스크린 모드로 2개 이상의 모바일 화면을 제조사별 모델별로 확인이 가능합니다.
APPSTIPS 블로그를 삼성 갤럭시 S8, S8+ 에서 접속한 화면을 띄운 상태에서 IPhone 6(s), 7, 8에서 접속한 화면도 같이 띄워봤습니다. (위 이미지 참고)
멀티스크린은 2개 이상으로 생성할 수 있기 때문에 한 번에 다양한 모델들을 띄워놓고 개인 홈페이지나, 블로그의 모바일 반응 환경을 테스트할 수 있습니다.
APPSTIPS 블로그의 방문객을 분석해볼 때 전체적인 방문객의 90%가 모바일 환경에서 접속하고 있습니다.
방문객들은 궁금한 내용이 있을 때, 데스크톱(PC)을 통해 검색하기보다는 핸드폰을 활용해서 검색을 진행하기 때문에 모바일 환경을 중점적으로 고려해서 포스팅을 작성해야 합니다.
하지만 대다수의 블로거들이 포스팅을 PC로 작성하기 때문에 모바일 환경을 고려해서 포스팅을 업로드해도, 점검하는 과정을 별도로 진행하지 않는다면 자신의 생각과는 다른 모바일 접속화면을 확인하게 됩니다.
이제 다음에서 제공하는 Daum Troy labs를 활용해서 모바일 환경을 점검하고, 데스크톱과 모바일에서 보기 좋은 양질의 포스팅을 작성하길 바랍니다.
블로그에 관련된 기타 정보는 아래의 포스팅을 참고 바랍니다.
2019/11/04 - [기타 TIPS] - 블로그 이사할 때 포스팅 가장 쉽게 옮기는 법
블로그 이사할때 포스팅 가장 쉽게 옮기는 법
블로그에 관련하여 다양한 사연들이 인터넷에 흘러넘칩니다. 내 블로그가 나도 모르게 갑자기 저품질이 되었다라던가. 현재 운영 중인 플랫폼이 너무 폐쇄적이라서 마음에 들지 않는다라던가.
appstips.tistory.com
2020/04/09 - [기타 TIPS] - 애드센스 광고 네트워크 차단으로 수익 높이는 법
애드센스 광고 네트워크 차단으로 수익 높이는 법
구글 애드센스 광고 네트워크 차단을 통해 수익을 높이는 방법에 대해 알아보겠습니다. 모든 애드센스 사용자들은 광고수익이 발생하면 조금이라도 수익을 높이기 위해 노력하고 있습니다. 이�
appstips.tistory.com
2020/03/07 - [기타 TIPS] - 애드센스, 애널리틱스 연결로 어떤 페이지가 수익 내는지 확인방법
애드센스, 애널리틱스 연결로 어떤 페이지가 수익내는지 확인방법
애드센스를 사용하는 모든 분들은 반드시 애널리틱스와 연동하는 것을 권장합니다. 애드센스에서 발생되는 수익이 사용자의 블로그 어떤 게시글에서 몇 번의 클릭이 발생되는지 확인하는 방법
appstips.tistory.com