⚠️ 광고비 쓰기 전에, 사이트에 이 4개부터 설치하세요!

(개발자 없이 AI한테 시켰어요)

요즘 브랜드 사이트 마케팅을 도와드리다 보면 제일 먼저 하는 말이 있어요.

"광고 돌리기 전에 측정 환경을 마련하셨나요?"

이번 호는 그 측정 셋팅을 Aside CLI + AI 코딩 에이전트(클로드코드, 코덱스, 안티그래비티, 젠코드 등)로 통째로 맡긴 사례 두 개예요.

아임웹 쇼핑몰 하나, 바이브코딩으로 만든 사이트 하나. 실제로 넣은 프롬프트랑 3주 뒤 성과까지 다 열어볼게요!

🪣 홈페이지에 이게 없으면 밑 빠진 독이에요.

광고비는 쓰는데, 그 돈으로 들어온 사람이 사이트에서 뭘 했는지 아무도 모르면 및 빠진 독에 물 붓기입니다.

안 까는 이유도 이해는 가요. 구글 계정 세 군데, 메타 비즈니스 관리자, 사이트 관리자 화면을 왔다갔다하며 코드를 복붙해야 하거든요.

개발자한테 부탁하면 2주, 직접 하면 반나절 날아가요 🤣

🧰 4개가 각자 하는 일이 달라요.

① META PIXEL

메타 태그(픽셀): 광고 성과를 재고, 다시 보여줄 사람을 모아줘요.

메타 이벤트 관리자. 사이트에 심은 메타 태그가 보낸 행동(페이지 조회, 문의, 상품 조회, 신청)이 이렇게 쌓여요.

메타 태그(메타 픽셀, 메타 전환 태그라고도 불러요)는 내 사이트에 온 사람이 무엇을 했는지 메타(인스타그램·페이스북)에 알려주는 코드예요. 하는 일은 크게 두 가지예요.

첫째, 광고 성과 측정이에요.

광고를 본 사람이 사이트에 와서 상품을 봤는지, 신청했는지, 구매했는지를 메타가 알게 돼요. 그래야 메타가 "이런 사람이 잘 사네?"를 학습해서 비슷한 사람한테 광고를 더 보여줘요. 광고 화면의 '구매', '리드' 숫자도 다 여기서 나와요.

둘째, 리타겟팅용 고객 모으기예요.

쉽게 말하면 우리 가게 앞을 지나간 사람 명단을 자동으로 만들어주는 거예요.

메타 태그가 깔려 있으면 이런 사람들을 따로따로 묶어둘 수 있어요.

그다음 인스타그램을 보던 그 사람들한테 "아까 보던 그 소시지, 아직 있어요" 같은 광고를 다시 보여주는 거죠. 처음 보는 사람보다 한 번 와본 사람이 훨씬 잘 사니까, 광고비 효율이 확 달라져요.

② GOOGLE SEARCH CONSOLE

구글 서치콘솔: 구글이 내 사이트를 어떻게 보는지 알려줘요.

구글 서치콘솔. 왼쪽 메뉴에 실적, URL 검사, 페이지 색인, 사이트맵 같은 기능이 모여 있어요.

서치콘솔은 검색 유입의 건강검진표예요.

새 페이지를 만들었을 때 "빨리 가져가 주세요" 하고 색인 요청을 넣는 곳도 여기예요. 무료인데 안 쓰면 진짜 손해예요.

③ GOOGLE ANALYTICS 4

GA4: 들어온 사람이 뭘 했는지 기록해요.

출처: Google 애널리틱스 공식 페이지

서치콘솔이 검색창에서 일어난 일이라면, GA4는 사이트 안에서 일어난 일이에요.

방문자가 어디서 왔는지(검색, 광고, SNS, 챗GPT 같은 AI), 어떤 페이지를 봤는지, 얼마나 머물렀는지, 장바구니에 담고 결제까지 갔는지를 기록해요.

광고로 온 사람과 검색으로 온 사람이 진짜 다르게 행동하는지, 여기서 처음 숫자로 보여요.

④ GOOGLE TAG MANAGER

GTM: 이 코드들을 한 서랍에서 관리해요.

출처: Google 태그 관리자 공식 페이지

GTM(구글 태그 관리자)은 GA4, 메타 픽셀 같은 추적 코드를 한곳에 모아두는 서랍이에요.

사이트에는 GTM 코드 하나만 넣어두고, '상품 클릭', '장바구니 담기', '구매 완료' 같은 이벤트를 GTM 안에서 정의해요. 나중에 측정할 걸 추가해도 사이트 코드를 다시 안 건드려도 돼요.

그리고 여기서 제일 중요한 게 이벤트 택소노미, 즉 '무엇을 어떤 이름으로 잴지' 설계도예요. 이걸 잘 짜야 나중에 데이터를 볼 수 있어요.

📌 한 줄 정리

🤖 이걸 Aside한테 시킨 이유가 있어요.

Aside는 지난 호에서 자세히 다뤘던 AI 브라우저예요. (Aside 브라우저 설치, CLI 연동, 사용법과 예시)

측정 셋팅이 귀찮은 이유가 딱 로그인된 관리자 화면 여러 개를 오가는 일이잖아요.

구글 애널리틱스, 태그 관리자, 서치콘솔, 사이트 관리자, 메타 이벤트 관리자. 이게 다 제 브라우저에 이미 로그인돼 있으니, Aside가 그대로 들어가서 만들고 붙이고 확인하면 되는 거예요.

웹사이트 측정 셋팅이 바로 사람도 헤매는 일 1순위인데요. (사용법이 어렵고 메뉴 위치가 맨날 바뀌어요 ㅠㅠ). Aside에게 시키면 바로 해결되겠죠?!

CASE 01 · 아임웹 쇼핑몰

🍖 아임웹 쇼핑몰은 AI 코딩 에이전트 + Aside로 셋팅했어요.

⚙️ 브라이리퍼블릭 · 아임웹 · 한국어/영문 사이트 2개 · 상품 31개

이태원·평택에 매장이 있는 남아공 바베큐 레스토랑이자, 수제 소시지랑 빌통(남아공식 육포) 온라인몰이에요.

구매평이 212개에 평균 4.83점인데, 정작 '브라이리퍼블릭'을 검색하면 사이트가 잘 안 잡히는 상황이었어요. 맛있는데 못 찾는 집이었던 거죠 🥲

AI 코딩 에이전트가 계획을 세우고, 실제 아임웹·구글 관리자 화면 작업은 Aside CLI로 Aside한테 넘기는 구조였어요. 에이전트가 Aside를 인턴처럼 부린 거죠.

제가 넣은 프롬프트는 이게 다예요.

먼저 상품명과 상세페이지 구성을 잡았어요.

💬 프롬프트 1

그다음 사이트 전체 SEO와 측정 도구 셋팅을 시켰어요. 유튜브에서 본 SEO·GEO 실무 체크리스트를 같이 붙여넣었고요.

💬 프롬프트 2

마지막으로 이벤트 측정이에요.

💬 프롬프트 3

이렇게 바뀌었어요.

🏷 이름은 이렇게 바뀌었어요

🤖 AI가 이렇게 바꾼 이유

이벤트 택소노미는 AI가 이렇게 설계했어요.

브라이 리퍼블릭 이벤트 택소노미. view_item_list부터 purchase까지 8개 이벤트

포인트는 두 가지예요.

이런 디테일까지 알아서 챙겨주니 든든하더라고요.

3주 뒤, 진짜 달라졌어요.

이번 호를 쓰면서 Aside로 서치콘솔이랑 GA4에 직접 들어가서 확인해봤어요. (셋팅 전후 같은 24일씩 비교)

📊 구글 검색 클릭률 3.3% → 5.6%, 1.7배

검색 결과에 떴을 때 실제로 눌러서 들어오는 비율이 1.7배가 됐어요. 구글이 색인한 페이지도 43개 → 50개로 늘었고요.

지금 구글에서 '브라이리퍼블릭'을 검색하면 이렇게 나와요.

AI가 바꿔준 제목 '브라이리퍼블릭 | 이태원·평택 남아공 레스토랑 & 수제…'와 설명이 그대로 검색 결과에 떠요.

브랜드명만 쳐도 '이태원·평택', '남아공 레스토랑', '수제 소시지'가 제목에 바로 보이니까, 뭐 하는 곳인지 한눈에 알 수 있어요. 클릭률이 오른 이유가 여기 있어요.

검색어를 봐도 '브라이리퍼블릭 평택', '브라이리퍼블릭 메뉴'처럼 브랜드명 검색이 사이트 방문으로 이어지기 시작했어요. 맛있는데 못 찾던 집이 이제 찾아지는 집이 된 거죠 🙌

🔎 검색·직접 방문 유입도 늘었어요

아임웹 통계의 '유입 사이트'에서도 같은 기간을 비교해봤어요.

구글과 네이버 검색으로 들어온 사람이 함께 늘었고, 주소를 직접 치고 들어온 방문도 39% 늘었어요. 검색에서 브랜드를 한 번 제대로 본 사람이 다시 찾아오는 흐름이 생긴 거죠.

📈 GA4로 처음 보인 것

검색해서 들어온 사람이 광고로 들어온 사람보다 4배 넘게 머물러요.

광고비를 어디에 더 쓸지, 검색 쪽 콘텐츠를 키울지 판단할 근거가 처음 생긴 거예요.

🤖 GEO 효과도 보이기 시작했어요.

GA4에 'AI 어시스턴트'라는 유입 채널이 따로 있어요. 챗GPT, 퍼플렉시티 같은 AI가 답변하면서 "여기 가보세요" 하고 링크를 준 걸 눌러서 온 사람들이에요.

셋팅 후 이 채널로 들어온 방문이 잡히기 시작했는데, 참여율이 80%로 모든 유입 채널 중 가장 높았어요. AI가 추천해서 온 사람은 이미 마음을 정하고 오는 거죠.

이번에 넣은 구조화 데이터(매장 주소, 영업시간, 메뉴 정보)와 H1·설명 정리가 AI가 우리 사이트를 이해하고 인용하는 데 쓰이는 정보예요. 이걸 GEO(생성형 AI 검색 최적화)라고 부르는데, 측정이 깔려 있어야 이런 신호도 놓치지 않고 볼 수 있어요.

CASE 02 · 바이브코딩 사이트

⚡ 젠스파크로 바이브코딩한 사이트는 젠코드한테 한 줄로 시켰어요.

⏱ VELORA · 젠스파크로 만든 가상 브랜드 사이트 · 프롬프트 1줄

두 번째는 젠스파크로 바이브코딩해서 만든 가상 브랜드 랜딩 사이트예요.

직접 코드를 만든 사이트라 아임웹처럼 관리자 메뉴가 없는 대신, 코드에 바로 심을 수 있어 더 간편했어요. 이번엔 젠스파크의 AI 코딩에이전트인 젠코드한테 딱 한 줄로 시켜봤어요.

젠코드에 사이트 주소와 함께 요청한 화면

💬 프롬프트

젠코드가 먼저 사이트 구조와 로그인 상태를 파악하더니 확인할 것 3가지만 묻더라고요.

메타 로그인만 해주고 나머지는 권장대로 진행시켰어요.

결과 요약. GA4 속성과 GTM 컨테이너를 새로 만들고, 태그 8개·트리거 7개·변수 16개를 구성해서 게시하고, 라이브 사이트에서 GA4와 메타로 데이터가 나가는 것까지 확인했어요.

이벤트 택소노미는 이렇게 설계했어요.

VELORA 이벤트 택소노미. 구매 대신 관심과 리드를 재는 이벤트 7개

인상적이었던 건 사이트에 맞게 이벤트를 다시 설계했다는 거예요.

결제 기능이 없는 랜딩 페이지라 구매 이벤트는 과감히 빼고, 버튼 클릭, 상품 카드 클릭, 런클럽 신청(리드), 매장 선택, 섹션 노출처럼 '관심'을 재는 이벤트 7개로 짰어요. 설계서도 파일로 남겨줬고요.

메타 픽셀은 GTM이 아니라 사이트 코드에 직접 심는 쪽을 골랐는데, 이게 더 튼튼하대요. 서치콘솔 소유권도 따로 인증 코드를 넣을 필요 없이, GTM이 깔려 있으니 그걸로 자동 확인됐어요.

셋팅하고 바로 GA4에 들어가 보니 직접 설계한 이벤트(section_view 등)가 그대로 쌓이고 있었어요!

🔌 클로드코드·코덱스·젠코드에 Aside는 이렇게 붙여요.

curl -fsSL https://releases.aside.com/install.sh | bash

설정 > Developers > Add skill to... 에서 쓰는 도구를 고르면 끝이에요.

그리고 이렇게 시키면 돼요.

💬 따라 쓸 프롬프트

마지막 줄은 꼭 넣어주세요.

라이브 사이트를 건드리는 일이라, 게시 직전에 한 번 보고 OK 누르는 게 마음 편하더라고요.

➕ 4개 말고, 이것도 같이 깔면 좋아요.

이번에 리서치하면서 정리한 '추가로 깔면 좋은 것'이에요. 전부 무료예요.

>> 굳이 안 해도 되는 것: 요즘 많이 얘기하는 llms.txt는 아직 효과 근거가 약해요. 구글도 따로 필요 없다고 밝혔고, 대규모 분석에서도 트래픽 차이가 거의 없었어요. 그 시간에 위에 것들부터!

✅ 여러분도 이 순서로 따라해 보세요.

광고비를 더 쓰기 전에, 사이트가 새는 독인지부터 막는 게 제일 싼 마케팅이더라고요.

AI 코딩 에이전트에 대해서 더 배우고 싶으시다면 제 클로드코드 강의를 들어보세요! :)

🆕 클로드코드 쌩기초 업무 자동화 (2만원 할인)

저와 트레바리 워크샵에서 AI로 기획안 작성 & 커리어 독립 계획 세워보실래요? :) 

젠스파크, 트레바리와 함께 오프라인 워크샵을 엽니다. 하루는 캠페인 작성, 하루는 커리어 독립 계획을 세워볼게요! 아래 링크를 통해 신청하세요!

🏃 인프런에서 제 AI 강의를 만나보세요! :)

AI로 엄청난 업무 효율을 경험하면서, 활용 사례를 하나씩 영상화하다보니 벌써 강의 다섯 개가 업로드되었어요! 특히 블로그-뉴스레터-링크드인-스레드-카드뉴스와 숏폼 영상, 커뮤니티 자동화와 상세페이지 자동화까지! 쉽게 설명한 이론과 케이스를 살펴보세요.

⚙️ 구글 AI 생태계 강의 - 회사에서 Gemini를 쓴다면?!

예상했던 10시간을 훌쩍 넘겨 15시간이 된 강의... 회사에서 구글 생태계를 활발히 쓰고 계신 분들이라면 한 번 살펴보세요. :)