반응형 스킨이나 웹이 어떻게 보여지는지 확인을 하자 - 다음 트로이(TROY)

반응형 스킨이나 웹이 어떻게 보여지는지 확인을 하자 - 다음 트로이(TROY)

최근 웹을 살펴보면 반응형을 도입하는 사례가 꾸준히 있고 티스토리 스킨에 있어서도 반응형을 지원하는 스킨이 꽤 여럿보이며 제작하시는 분들도 많아졌습니다. 불과 몇 년전까지만 해도 티스토리 스킨에서 반응형을 찾아보는 것은 손에 꼽을 정도였는데 지금은 정말 많은 분들이 사용하고 계시고 있습니다. 

물론 훌륭한 스킨을 제작하여 무료/유료로 배포하시는 제작자분들께 감사할 따름입니다. 제가 현재 사용하고 있는 스킨도 반응형으로서 모바일, 태블릿PC, 데스크탑 등 환경에 따라 스킨이 저절로 바뀌어서 보입니다. 

"사진찍는 삼촌(http://windup.beintous.net/)"님 감사합니다. ^^

저는 웹프로그래머가 아니라서 스킨을 배포하는 것을 다운받아서 적용해서 사용하고 있는데요, 사진찍는 삼촌의 스킨이 심플하고 빠른 것 같아서 사용중에 있습니다. 

그렇다면 다양한 환경에서 내가 적용한 반응형 스킨이 어떻게 보일지 궁금할 땐 어떻게 해야할까요?

이번 포스팅에서 소개해드릴 "다음 트로이(http://troy.labs.daum.net)"에서 확인하시면 됩니다.

사이트에 접속하면 아래(▼)와 같은 화면을 볼 수 있습니다. 좌측에는 테스트를 할 수 있는 여러 디바이스가 보이며 우측에는 선택한 디바이스의 화면 사이즈와 어떻게 내 블로그/웹이 보여지는지 살펴볼 수 있습니다.

갤럭시s4를 선택하고(▼) 살펴보았습니다. 깔끔하게 제 블로그가 잘 보입니다. 애드센스 상단의 광고도 제가 원하는 크기로 잘 보입니다. 애드센스를 적용하고 어떻게 보일지 궁금하다면 이렇게 확인하는 방법도 좋습니다. 특히 모바일 화면 첫 화면에서 광고가 2/3 이상을 차지하면 경고 및 제재를 받는 것으로 알고 있는데 저는 콘텐츠와 함께 광고가 출력이 되어서 그런지 특별히 경고나 제재는 받은 적이 없습니다.

아무튼 아래 화면에서 스크롤도 가능합니다.

아래(▼)는 아이폰을 선택해서 보는 화면입니다.

그 아래는 데스크탑에서 보는 제 블로그의 화면입니다.

반응형 스킨이나 웹을 만드시는 분들에게 유용한 사이트가 아닐까 생각됩니다. 물론 저와 같이 블로그에 반응형 스킨을 적용하고 모바일에서 어떻게 보일까? 다른 기기에서는 어떻게 보일까? 궁금하신 분들에게도 유용하게 사용할 수 있을 것 같습니다. 또한 블로그 포스팅 상단에 구글 애드센스 광고를 넣은 분들은 모바일 화면에서 자신의 광고가 어떻게 보여지는지 확인할 수 도 있습니다.

조만간 티스토리에서 반응형 스킨을 유료/무료 배포하는 분들을 정리해서 소개하는 포스팅을 할까합니다. :-)

---

* 관련 글

[IT/소셜/컴퓨터] - 티스토리 블로그 스킨 교체 완료!!

[일상다반사] - 블로그 스킨을 교체하려 합니다.

[블로거수익과 관리] - 블로그 스킨을 교체할 때 색상코드가 궁금하다면?

[블로거수익과 관리] - 블로그로 수익을 내려면 어떻게 해야 할까?