티스토리 블로그에는 카카오의 자체 광고가 상단이나 하단에 송출됩니다. 그런데, 자세히 보면 웹 페이지가 로드될 때 카카오 자체광고는 잘 나오는데, 내 애드센스 광고는 조금 늦게 나타나는 현상이 있습니다. 이 때문에 내 블로그에 최 상단 광고가 페이지가 로드 되자마자 나오는 법을 알아보았습니다.
티스토리에 송출하는 애드센스 비동기 광고
티스토리에서 애드센스의 비동기 광고는 블로그 글과 관계 없이 애스센스 광고를 페이지 로딩에 영향을 주지 않고 천천히 표시하겠다는 의미입니다. 즉, 방문자가 내 티스트로 블로그를 방문하면 블로그 글이 먼저 로딩되어 나타나므로 방문자가 블로그 내용을 먼저 볼 수 있습니다. 속도가 느린 환경에서는 방문자가 내용이 빨리 나타나므로 이탈율을 줄여주는데 도움이 됩니다.
애드센스 비동기 광고의 좋은점
속도 개선
애드센스 비동기 광고 코드를 사용하면 인터넷이 느린 환경에서 페이지 로딩 시간이 빨라지므로 페이지 속도를 개선할 수 있습니다.
향상된 사용자 환경
애드센스 광고 송출에 문제가 발생하는 경우에도 비동기 광고를 사용하면 블로그 게시물은 정상적으로 로딩할 수 있습니다.
애드센스 비동기 광고의 문제점
저의 경우 티스토리 최 상단에 광고를 넣었는데 접속 후 바로 스크롤을 하게되면 상단광고를 보지 못하고 지나쳐 버려 애드센스 상단 광고를 볼 수 없는 문제가 발생합니다. 그러나, 카카오의 자체 송출 광고는 항상 정상적으로 보여집니다.
이 문제를 해결하기 위해서는 애드센스의 동기 광고를 사용할 필요가 있다고 생각하게 되었습니다.
애드센스 동기 광고란?
애드센스 동기 광고는 말 그대로 페이지 로딩과 동시에 광고를 송출한다는 의미입니다. 비동기 광고의 경우 내 블로그 페이지의 글이 먼저 보여지고 나중에 광고가 나타나는 것과 다르게 애드센스 광고가 나타날 수 있는 상태에서 블로그 페이지의 내용이 함께 표시됩니다.
이 경우 블로그 페이지의 내용과 광고가 함께 로딩이 되어 페이지가 보이자마자 광고가 나타납니다.
애드센스 동기 광고의 좋은점
애드센스 동기 광고는 페이지가 나타나자마자 내가 송출하는 모든 광고를 함께 볼 수 있다는 장점이 있습니다.
그 때문에, 방문자가 상단 광고를 못 보고 지나가는 일이 발생하지 않습니다.
애드센스 동기 광고의 문제점
인터넷이 느려서 페이지 로딩이 오래 걸리는 환경에서는 성격이 급한 방문자의 경우 바로 뒤로가기를 누를 수도 있습니다. 이 경우 이탈율이 높아져서 SEO에 나쁜 영향을 줍니다. 또, 페이지 속도가 상대적으로 느린 것으로 측정되어 이 역시 SEO에 안좋은 영향을 줍니다. 구글에서는 모든 광고를 비동기로 할 것을 권장합니다.
티스토리 최상단 광고에 동기 광고 넣기
앞서 이야기드린것 처럼, 티스토리에 나의 애드센스 상단 광고를 방문객이 못보고 지나가는 문제를 해결하기 위해서 동기 광고를 적용하는 법을 알려드리겠습니다.
먼저, 티스토리 최상단에 카카오 자체광고보다 내 광고를 넣는 법은 다음의 링크에 있으니 아직도 카카오 자체광고 아래에 내 애드센스 광고가 나오시는 분들은 다음 링크를 통해서 수정하시고 애드센스 수익을 원복시키신 후 동기 광고를 넣는 것을 추천드립니다.
동기 광고에 대해서 구글 공식 도움말 페이지는 아래와 같습니다.
위의 그림과 같이 코드를 조금 변경해 주셔야합니다. 코드는 pub id와 slot 두 가지를 변경해 주시면 됩니다.
아래의 애드센스 비동기 광고 코드와 동기 광고 코드, 그리고 위의 그림 설명을 참고하셔서 코드를 변경하시면 됩니다. 아래 애드센스 코드는 복사용으로 추가하였습니다.
비동기 광고 단위 코드:
<script async src="https://pagead2.googlesyndication.com/
pagead/js/adsbygoogle.js"></script>
<!-- leaderboard -->
<ins class="adsbygoogle"
style="display:inline-block;width:728px;height:90px"
data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
동기 광고 단위 코드:
<script type="text/javascript">
google_ad_client = "ca-pub-xxxxxxxxxxxxxxxx";
google_ad_slot = "1234567890";
google_ad_width = 728;
google_ad_height = 90;
</script>
<!-- leaderboard -->
<script type="text/javascript"
src="https://pagead2.googlesyndication.com/
pagead/show_ads.js">
</script>
애드센스 동기광고 적용 후기 및 결론
위와 같이 애드센스 동기광고를 적용시 문제가 하나 있습니다.
애드센스 동기광고와 비동기 광고를 섞어서 사용시 동기 광고가 정상적으로 동기화 되지 않고 페이지 로딩 후에 다른 비동기 광고들과 함께 나오는 현상이 발생합니다.
구글 공식 도움말에서는 동기 광고와 비동기 광고를 섞어서 사용하지 말라고 되어있는데, 이 때문에 그런 것 같습니다.
그렇다고, 모든 광고를 동기로 바꾸는 것은 속도가 현저히 느려질 수 있는 문제가 있으므로...
결론적으로 동기 광고를 적용해서 내 광고가 페이지 로딩과 함께 적용하는 것은 불가능한 것으로 생각합니다.
그러므로, 저의 경우 비동기 광고만 사용합니다.