내 블로그는 어느정도 반응형인지 확인하기

다양한 플랫폼과 기기들이 일반화되면서 블로그의 반응형 웹 지원은 필수가 되어가고 있습니다.

스킨이 반응형 스킨이 아니어도 티스토리 시스템 차원에서 모바일 페이지를 제공해주고 있기 때문에 모바일 지원은 가능합니다.

다만 티스토리 시스템 지원하는 이 모바일 페이지가 천편일률적인 올드한 디자인 이다보니 그리 보기 좋지는 않습니다.

애드센스를 블로그에 적용한 경우 티스토리 시스템이 제공하는 모바일 화면에서는 애드센스 광고가 표시되지 않기 때문에 애드센스 수익 측면에서도 큰 손해가 됩니다.

블로그에 따라 다르지만 애드센스 광고를 블로그에 붙인 경우 1/3 정도는 모바일에서 발생하는 것으로 알려지고 있습니다.

즉, 반응형 블로그 스킨을 적용해서 모바일에서도 애드센스가 적용된 블로그 화면을 노출할 경우 30%-40% 정도의 추가 애드센스 수익이 발생할 수 있다는 뜻이 됩니다.

내 블로그 스킨이 반응형 지원을 어느정도까지 지원하는지 궁금할 경우

크롬을 이용하면 반응형 지원 테스트를 직접 해볼 수 있습니다.

크롬을 실행한 후 내 블로그로 들어갑니다.

F12 키를 눌러 크롬 개발자 도구가 표시되도록 합니다.

크롬 개발자 도구 상단 왼쪽 끝에서 두번째 아이콘(Toggle device toolbar) 를 클릭합니다.

디바이스 툴바가 활성화 되면 아이콘이 파랑색으로 변합니다.

키보드 단축키 Ctrl + Shift + M 을 눌러도 됩니다.

디바이스 툴바가 표시되면 현재 표시되고 있는 페이지의 반응형 테스트를 위한 다양한 선택 기능과 크기 조절 슬라이더가 활성화 됩니다.

상단에 장치 툴바를 보면 

테스트 할 기기 선택  - 가로 x 세로 크기 - 화면 배율(%) - 회선 속도 - 화면 회전

으로 기능이 구성되어 있습니다.

세세하게 기능적인 것들을 써봐도 되겠지만, 잘 모르겠으면

테스트 할 기기 선택에서 iPhone X, iPad 두가지만 선택해 반응형 지원 여부를 테스트해도 됩니다.

스킨이 레티나 디스플레이를 지원할 경우 iPad Pro 를 선택해 확인하면 됩니다.

기기를 선택하면 현재 페이지의 보여지는 모습이 해당 기기의 보여지는 화면과 유사하게 보여집니다.(100% 동일하지는 않습니다.)