사용자가 블로그에 접속하는 장치의 해상도에 맞게 광고 사이즈를 변경해서 출력하는 기능을 하는 애드센스 반응형 광고 단위는 이전 포스트에서 다뤘듯이 사용자가 직접 해상도별 광고 단위 사이즈를 지정할수 있습니다.
모바일 같은 경우에도 대부분이 고해상도 스마트폰을 사용하기 때문에 모바일용 상단 광고 320×100을 사용해도 큰 문제는 없지만 아이폰SE 같은 낮은 해상도를 사용하는 모바일 디바이스에서는 광고가 화면의 대부분을 차지할수 있어 애드센스 정책 위반 대상이 될수 있습니다.
또한 상단에 두개의 사각형 광고를 게재하는 경우도 있는데 PC에서 볼때는 문제가 없지만 모바일에서 볼 경우 광고가 두개 연속으로 출력되기 때문에 이또한 애드센스 정책 위반입니다.
이런 경우 때문에 상단 광고 출력을 포기할수는 없는 노릇인데 애드센스에서는 공식적으로 특정 해상도에서 애드센스가 노출되지 않게끔 할수 있는 방법을 제시하고 있습니다.
애드센스 광고 노출 숨김 설정
<style> .adsense_response_1 { width: 0px; height: 0px; } @media(min-width: 500px) { .adsense_response_1 { width: 468px; height: 60px; } } @media(min-width: 800px) { .adsense_response_1 { width: 728px; height: 90px; } } </style> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- 광고 이름 --><ins class="adsbygoogle adsense_response_1" style="display:block" data-ad-client="애드센스 게시자 계정(숫자)" data-ad-slot="광고 단위 아이디(숫자)"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({}); </script>
이전 포스트에서 CSS 미디어 쿼리를 통해 해상도별 애드센스 광고 사이즈를 지정하는 방법에 대해 했었는데 여기에 대한 응용입니다.
.adsense_response_1 클래스의 기본 사이즈를 가로 세로 0픽셀로 지정하게 되면 위 코드를 예로 500픽셀 이하 환경에서는 애드센스 출력 공간이 0이 되어 사용자에게 보여지지 않습니다.
.adsense_response_1 { none; }
코드를 위처럼 간결하게 사용해도 똑같은 효과를 가집니다. 애드센스에서 공식적으로 허용하고 있는 방법이기 때문에 정책 위반이 되지 않아 적재적소에 활용하면 되겠습니다.