간단한 포스팅입니다. 요지는 이것입니다. 비동기애드센스를 페이지에 여러개 넣을 때, 중복되는 script가 들어가므로 이걸 최소화 시키고, 확실하게 스크립트를 나중에 실행시키도록 해서 페이지 로딩에 지장을 안주게 하자는 것입니다. 원래 애드센스 구조는 아래처럼 되어 있습니다.
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"> </script>
<!-- XXX -->
<ins class="adsbygoogle"
style="display:inline-block;width:336px;height:280px"
data-ad-client=""
data-ad-slot=""></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
애드센스 광고를 비동기로 3개 쓴다 하면, 스크립트가 중복됩니다. 또한 물론 script에 async가 붙어 있긴 하지만, 확실하게 나중에 로딩시키는 방법은 페이지의 끝부분에 가서 스크립트를 로딩시키는 것입니다. 따라서 광고를 출력하고자 하는 부분에는 <ins>태그만 넣어두고, 스크립트 부분을 제거한 뒤 페이지 끝부분에서 광고를 일괄적으로 넣도록 하면 확실하게 비동기식으로 작동하게 할 수 있습니다.
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <script> $('.adsbygoogle').each(function(){(adsbygoogle = window.adsbygoogle || []).push({});}); </script>
<body>의 끝부분에 위의 애드센스 삽입 코드를 넣는 것입니다. jQuery를 사용하고 계시지 않다면 jQuery를 먼저 삽입해주셔야 합니다. 나중에 adsense관련 script와 push코드를 로딩하게 함으로써(또한 스크립트가 중복이 안되게) 최적화 시키는 방법입니다. 페이지의(티스토리라면 skin.html) 전체적인 모습은 다음처럼 될 것입니다.
<html> <head> ...제목 등의 head... jQuery 삽입 </head> <body> ... <ins class="adsbygoogle" ~></ins> ... ... <ins class="adsbygoogle" ~></ins> ... ... <ins class="adsbygoogle" ~></ins> ... <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <script> $('.adsbygoogle').each(function(){(adsbygoogle = window.adsbygoogle || []).push({});}); </script> </body> </html>
이렇게 하면 redundancy를 최소화 시킬 수 있습니다.
구글 FAQ
https://support.google.com/adsense/answer/3221666?hl=ko
구글에서도 비동기 광고단위를 구현하면서 이 점에 대해 생각해본 것 같습니다. 공식 질의 첨부하니 위 링크 들어가보세요. script를 중복을 피하는 식의 구현은 정당한 광고단위 구현입니다. 저번에 보니 구글에서 제공해주는 코드를 수정하면 안되는거지 않냐고 하시는 분들이 계시던데, 위 방법은 로딩 순서만 바꾸는 것이므로 해당되지 않습니다. (script 코드를 수정하는 것이 아니기 때문에)
'반응형 티스토리 > Tistory' 카테고리의 다른 글
| 특정 창크기에서 특정요소 숨기기 (미디어쿼리 사용) (2) | 2014.08.21 |
|---|---|
| 8월 초대장 배포 [10장] (66) | 2014.08.13 |
| 7월 초대장 배포 [10+a장] (42) | 2014.07.12 |
| 6월 초대장 배포 [10장 + a] (73) | 2014.06.07 |
| 티스토리 블로그 메인화면을 /category로 리다이렉트 시키기 (45) | 2014.05.31 |
| 100,000 Hits / 6개월 기념 블로그 통계 (16) | 2014.05.11 |
| 5월 초대장 배포 [10+a장] (40) | 2014.05.10 |
| 본문 하단 다른글 보기 좌측에 애드센스 넣는 법 (49) | 2014.04.22 |
| 반응형 스킨 본문 우측 상단(PC) / 본문 상단(모바일) 애드센스 넣는 법 (39) | 2014.04.21 |
| 반응형 애드센스 안쓰고 원하는 애드센스 노출시키기 (33) | 2014.04.19 |
