티스토리 블로그는 수많은 사람들이 다양한 주제로 글을 작성하고 공유하는 인기 있는 플랫폼입니다. 하지만, '인기있는'은 이제 옛날이야기가 될거같네요. 티스토리 자체 광고 사태로 수익이 처참합니다. 클릭률이 가장 높은 본문 상단 광고 자리를 뺏겨 반토막 납니다. 최상단 광고는 조금이나마 수익에 영향을 줄만한 광고 위치이니 참고하셔서 수익 창출에 도움이 되시길 바랍니다.
효과적으로 광고를 배치해 보자
광고의 위치는 콘텐츠에 따라 페이지별로 다르므로 가장 적합한 위치를 찾는 것은 중요합니다. 그러나 광고의 위치를 결정할 때 고려해야 할 몇 가지 사항이 있습니다.
광고를 게재할 때는 사용자의 경험을 최우선으로 고려해야 합니다. 광고가 사용자의 웹서핑을 방해하거나 페이지의 가독성을 떨어뜨리지 않도록 해야 합니다. 또한, 광고가 사용자에게 유용한 정보를 제공하고 광고주와 사용자 모두에게 도움이 되는 방식으로 게재해야 합니다.
광고의 위치를 결정할 때는 이러한 요소들을 모두 고려해야 합니다. 광고의 위치가 적절하지 않으면 사용자의 경험이 저하될 뿐만 아니라 광고의 효과도 떨어질 수 있습니다.
예제 페이지 레이아웃에서 광고의 이상적인 위치를 나타내는 '히트 맵'입니다. 이 히트 맵에서는 진한 주황색은 최고의 광고 실적을, 옅은 노란색은 가장 낮은 광고 실적을 나타냅니다.
광고 클릭이 많이 되는 영역에 광고를 배치하면 광고 클릭률(CTR)이 올라 수익이 더 커집니다. 조건이 모두 동일한 경우, 화면 상단에 위치한 광고가 하단에 위치한 광고보다 실적이 좋습니다. 또한, 콘텐츠가 풍부하고 탐색을 지원하는 위치 주변에 광고를 배치할 경우, 사용자들이 해당 영역에 집중하여 광고를 보게 되므로 대체로 광고 실적이 좋습니다.
따라서 페이지별로 사용자 행동을 고려하고 어떤 위치가 광고를 최적으로 노출시키는지를 고려해야 합니다.
최상단 광고 배치로 수익률을 높여 보세요
예제로 보여드린 '히트맵'에서 최상단의 위치는 노란색으로 광고 실적이 최상의 위치는 아닙니다. 하지만, 티스토리 자체광고로 인해 최적의 광고 위치인 본문 상단 광고 자리를 뺏겨 최상단 위치에 광고를 적용해 봤습니다.
바로 이 부분 제목 위에 위치하는 최상단 광고입니다.
최상단 광고 코드
아래는 코드를 모두 복사해서 메모장에 붙여 넣기하고 위 정보를 본인의 애드센스 퍼블리셔 ID 및 광고 슬롯 ID로 대체해야 합니다. 위 코드에서는 '펍코드' 부분에 애드센스 퍼블리셔 ID를, '숫자' 부분에는 애드센스 광고 슬롯 ID를 넣어야 합니다. 이렇게 수정한 후에 사용해 주세요.
🤚잠깐: HTML/CSS 코드를 수정하거나 추가하기 전에는 꼭!! 미리 코드를 백업해 놓으시고 작업을 진행하세요
<!-- 최상단 -->
<div style="text-align: center; margin-bottom: 15px;">
<style>
.adsbygoogle.post-top {display:none;}
@media (min-width: 768px) {
.adsbygoogle.post-top {display:block;margin: 0 auto;width:728px;height:90px;}
}
</style>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle post-top"
data-ad-client="ca-pub-펍코드"
data-ad-slot="숫자"
data-ad-format="horizontal"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<!-- 최상단 끝 -->
<!--
화면 너비가 768px 미만인 모바일 기기에서는 해당 스타일이 적용되지 않으므로 광고가 표시되지 않습니다.
-->
최상단 광고 PC 화면과 모바일 화면에서 출력 예
화면 너비가 768px 미만인 모바일 기기에서는 최상단 광고가 나오지 않도록 설정했습니다. 모바일에서도 최상단 광고가 나오면 티스토리 자체 상단 광고가 나올 경우 광고가 2개 나와 모바일 화면을 모두 광고로 채우기 때문에 가독성을 심하게 해치게 됩니다.
왼쪽 PC 화면에서는 최상단 광고가 나오고 오른쪽 모바일 화면에서는 최상단 광고가 나오지 않는 모습입니다.
최상단 광고 코드 삽입
최상단 광고 코드를 자신의 티스토리 블로그 [HTML]에 넣어 주세요. HTML 편집에서 + 로 검색창을 열고 <div id="container">를 찾아 바로 위에 코드를 복사합니다.
티스토리 홈 관리 광고 설정
최상단 광고를 적용했다면, 티스토리 광고 설정에서 목록 상단 광고를 설정하면 홈페이지 메인에서 2개의 광고가 연달아 나오기 때문에 목록 상단 광고는 꺼두세요.
결론
이상으로 최상단 광고를 넣는 방법 및 광고를 효과적으로 배치하는 방법에 대해 설명해 드렸습니다. 하지만, 광고 배치에 대해서는 적절한 위치를 찾는 것이 가장 중요합니다. 사용자 경험에 영향을 미치지 않는 방식으로 광고를 게재하면서도 수익을 창출할 수 있도록 구성해 보세요. 이를 통해 블로그 운영에 도움을 드릴 수 있기를 바랍니다.