AdSense 승인 전 광고 슬롯을 블로그에서 완전히 제거한 이유

블로그에 붙여놨던 AdSense 플레이스홀더를 전부 떼어냈다. 승인 대기 중인 상태에서 빈 슬롯이 렌더링되고 있던 게 마음에 걸렸던 터라, 승인 전까지는 아예 없애는 쪽으로 결정했다.

왜 플레이스홀더를 빈 채로 두면 안 되나

AdSense 승인을 기다리는 동안 <ins class="adsbygoogle"> 태그를 그대로 마크업에 남겨두는 경우가 꽤 있다. "어차피 광고 안 뜨니까 괜찮겠지" 싶지만, 실제로는 몇 가지 문제가 생긴다.

• 빈 블록 레이아웃 깨짐 — 광고 스크립트가 로드되지 않으면 컨테이너가 높이 0으로 접히거나, CSS에 따라 빈 박스가 그대로 노출된다
• 불필요한 스크립트 요청 — BaseHead에 심어둔 adsbygoogle.js 초기화 코드가 여전히 페이지마다 요청을 날린다
• Google 심사 인상 — 승인 심사 중인 사이트에서 빈 광고 슬롯이 보이는 건 심사 측 입장에서도 그리 좋은 시그널이 아니다. 명세 위반까지는 아니더라도, 완성도 인상에는 영향을 준다
• Core Web Vitals — 빈 슬롯이 CLS(Cumulative Layout Shift)를 유발할 수 있다. 스크립트 로드 타이밍에 따라 레이아웃이 밀리는 경우가 실제로 잦다

결론적으로, 승인 전 플레이스홀더는 "준비된 것처럼 보이지만 실제론 노이즈만 추가하는 코드"다.

변경 범위

AdSlot.astro는 슬롯 마크업을 컴포넌트로 분리해뒀던 구조였기 때문에, 각 페이지에서 임포트한 부분도 같이 정리해야 완전히 깨끗해진다. BaseHead.astro에서 스크립트를 제거하면 모든 페이지에서 불필요한 외부 요청이 사라지므로 체감 성능에도 조금은 영향을 준다.

<!-- Before: BaseHead.astro -->
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"
  crossorigin="anonymous"></script>

<!-- After: 해당 블록 전체 제거 -->

<!-- Before: AdSlot.astro -->
<ins class="adsbygoogle"
  style="display:block"
  data-ad-client="ca-pub-XXXXXXXXXXXXXXXX"
  data-ad-slot="XXXXXXXXXX"
  data-ad-format="auto"
  data-full-width-responsive="true"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>

<!-- After: 파일 자체를 제거하거나 내용 비움 -->

사이드 프로젝트에서 이런 결정을 내리는 방식

업무 코드라면 "승인 나면 그냥 합쳐서 머지하면 되지" 하고 브랜치로 빼두는 게 자연스럽다. 근데 사이드 프로젝트, 특히 혼자 운영하는 블로그에서는 미완성 코드를 main에 두는 비용이 은근히 크다.

나중에 "이게 왜 있지?" 하고 다시 컨텍스트를 복원하는 시간, 빌드 결과물에 죽은 코드가 섞이는 찝찝함, 방문자가 보게 될 미완성 UI — 이 세 가지가 쌓이면 작은 프로젝트도 관리 부채가 된다.

그래서 이번 처리 방향은 단순했다.

• 승인 전: 코드 완전 제거, git 히스토리에만 남긴다
• 승인 후: 히스토리에서 꺼내거나 다시 붙인다. 어차피 컴포넌트 구조가 잡혀 있으니 재작업 비용은 크지 않다

"나중에 쓸 거니까 일단 두자"는 판단이 사이드 프로젝트를 조용히 망가뜨리는 주범 중 하나다. 당장 필요하지 않으면 지우고, 필요해지면 다시 만드는 게 낫다. 버전 관리가 있으니까.

승인 나면 그때 다시 붙인다. 끝.

🛒 이 글과 어울리는 추천 상품

• 외장SSD 쿠팡에서 보기 →
• 기계식키보드 쿠팡에서 보기 →
• 모니터암 쿠팡에서 보기 →

*위 링크는 쿠팡파트너스 활동의 일환이며, 일정액의 수수료를 제공받을 수 있습니다.