[구글블로그스팟 운영하기] 반응형블로그 적용 잘됐는지 확인하는 방법

제가 알려드린 무료 예쁜 템플릿 사이트 유용하게 사용하고 계시나요?ㅎ

(혹시 지난번 포스팅을 안보셨다면 참고해주세요 지난포스팅 보러가기 [예쁜스킨 제공하는 사이트] )

무료템플릿의 데모버전을 보면서...

휴대기기에서 어떻게보이는지도 확인하고 싶지 않으셨나요?

그래서 준비한 포스팅이에요.

컴퓨터로 내 반응형블로그가 다양한 스마트폰기종에서 어떻게 보이는지 확인할수 있는 사이트가 있어요.

반응형 웹페이지를 테스트할수 있는 다음 트로이

사이트주소 바로가기: http://troy.labs.daum.net/

다음 트로이는 반응형 웹페이지가 다양한 화면크기에서 어떻게 보이는지 서로 비교해볼수 있는 사이트에요.
스마트폰 뿐만 아니라 테블릿PC 그리고 일반PC의 화면크기까지 서로 비교해서 볼수 있어요.

스마트폰의 경우는 화면크기가 아주 작기때문에 반응형사이트의 내용이 꽉차게 화면에 나와요.
그렇기 때문에 화면크기의 작은변화에도 한화면에 들어오는 내용이 달라질수 있게돼요.

다음트로이에서 내 반응형블로그 테스트해보기

본격적으로 반응형템플릿을 적용한 블로그를 다음트로이에서 테스트해보려고 해요.
일단 테스트전의 컴퓨터로 보는 제블로그 모습부터 보여드리죠.

아래는 다음트로이 사이트로 들어간거에요.
아이폰6플러스와 아이폰5를 비교해서 선택해놓았어요.
확실히 아이폰6플러스의 화면크기가 훨씬 크죠?ㅎ
그리고 컴퓨터화면에서의 오른쪽 화면 메뉴라인들도 스마트폰에서는 전부다 하단으로 밀려났어요.

다음트로이 이용방법은....
사이트안에 따로 주소 입력칸이 하나더 있어요. 그곳에 원하시는 반응형 사이트주소를 입력해주세요.
그리고 왼쪽 메뉴는 다양한 화면크기의 기종들이 나와있어요.
브랜드별로 되어있구요.
원하시는 기종을 선택하시면 화면 중앙에 해당 스마트폰으로 사이트가 어떻게 보이는지 알수 있어요.

기본적으로 되어있는 멀티스크린모드를  이용하시면, 위의 화면처럼 여러 스마트폰 기종을 동시에 비교해서 볼수 있어요.

반응형템플릿 다음트로이에서 확인하기

템플릿 데모버전또한 해당 주소를 다음트로이에 입력하시면 반응형인지 아닌지 바로 알수 있어요.
반응형템플릿이라면 위의 제 블로그처럼 나오겠지만... 반응형이 아니라면 어떻게 될까요?

먼저 컴퓨터로 볼때의 데모버전 사이트입니다.

이 사이트를 다음트로이로 본다면...

스크롤바가 아주 크게생기면서 상당부분의 화면이 가려지는것을 알수 있어요.
아이폰6플러스의 경우 화면이 상당히 큰면이라 그래도 많이 나오지만...
일반 스마트폰크기인 아이폰5는 거의다 가려졌다고 봐야죠..ㅠㅠ

다음 트로이는 블로그템플릿 변경등의 블로그 디자인을 수정하신후에 정말 유용하게 사용할수 있는 사이트에요.
블로그를 운영하다보면 파워블로그등 다양한 블로그들을 좀더 주의깊게 보게되는데요.
반응형까지 신경써서 다음트로이로 본다면 좀더 많은 도움이 되실거에요.