제안 시스템

디자인킷 · 레이아웃

실행: 키워드 그룹 표(유형 칩과 의도)

D-레이아웃-완성-실행-키워드그룹

실행: 키워드 그룹 표(유형 칩과 의도)

언제 쓰는가

전(轉). 검색 광고 운영안 뒤. 검색어를 의도별 그룹으로 묶어 유형·대표 검색어·의도·도착 화면·비중을 한 표에. 그룹 4~6행, 대표 검색어 칩 2~3개. 바꿔야 할 값: 그룹명, 유형 칩, 대표 검색어, 검색 의도 문장, 도착 화면, 검색량 비중과 예산 비중(막대 길이), 집중 그룹 1개(class hot). 값 바꾸는 법: tbody 행 교체. 유형 칩은 <span class="ty">. 대표 검색어는 .kw span 2~3개. 막대 u 의 width = 비중 × 2px(50% = 100px). 위 막대가 검색량, 아래 진한 막대가 예산. 예산을 가장 많이 두는 그룹 행에만 class="hot".

참고

Ahrefs·SEMrush 의 search intent 분류(정보형·비교형·구매형·브랜드형), 국내 검색 광고 제안서의 키워드 그룹 표, FT Visual Vocabulary 의 표 안 막대(in-cell bar)를 참고. 직접 제작.

조각

<section class="slide lo-ex-kw">
  <div class="run"><b>모루리빙 2027 상반기 통합 디지털 마케팅 제안</b><span>PART 03 · 매체별 실행안</span></div>
  <div class="hd"><p class="lb">검색어 설계</p><h1>검색량은 정보형이 최다, 예산은 비교형에 가장 많이 배정</h1><p class="lede">검색어 86개를 의도에 따라 5개 그룹으로 분류. 그룹마다 도착 화면을 다르게 연결</p></div>
  <div class="body">
<div class="cd t">
      <table>
        <thead><tr><th>그룹</th><th>유형</th><th>대표 검색어</th><th>검색 의도</th><th>도착 화면</th><th>검색량 · 예산 비중</th></tr></thead>
        <tbody>
          <tr><td class="k">소파 고르는 법</td><td><span class="ty">정보형</span></td><td class="kw"><span>소파 고르는 법</span><span>패브릭 가죽 차이</span></td><td>기준을 아직 모르는 단계</td><td>블로그 안내 글</td><td class="bs"><p><u style="width:76px"></u><b class="num">38%</b></p><p><u class="bd" style="width:30px"></u><b class="num">15%</b></p></td></tr>
          <tr class="hot"><td class="k">모듈 소파 비교</td><td><span class="ty">비교형</span></td><td class="kw"><span>모듈 소파 추천</span><span>3인 모듈 소파 비교</span></td><td>후보 2~3개를 견주는 단계</td><td>비교표가 있는 기획전</td><td class="bs"><p><u style="width:48px"></u><b class="num">24%</b></p><p><u class="bd" style="width:70px"></u><b class="num">35%</b></p></td></tr>
          <tr><td class="k">조건 지정 구매</td><td><span class="ty">구매형</span></td><td class="kw"><span>모듈 소파 3인용 가격</span><span>소파 당일 배송</span></td><td>조건이 정해진 구매 직전</td><td>상품 상세페이지</td><td class="bs"><p><u style="width:32px"></u><b class="num">16%</b></p><p><u class="bd" style="width:50px"></u><b class="num">25%</b></p></td></tr>
          <tr><td class="k">브랜드 지정</td><td><span class="ty">브랜드형</span></td><td class="kw"><span>모루리빙 소파</span><span>모루리빙 후기</span></td><td>이미 알고 확인하러 옴</td><td>자사몰 첫 화면, 후기 모음</td><td class="bs"><p><u style="width:24px"></u><b class="num">12%</b></p><p><u class="bd" style="width:30px"></u><b class="num">15%</b></p></td></tr>
          <tr><td class="k">경쟁사 비교</td><td><span class="ty">비교형</span></td><td class="kw"><span>경쟁사 A 소파 단점</span><span>A사 B사 비교</span></td><td>타사 구매 직전의 재확인</td><td>타사 대비 비교 글</td><td class="bs"><p><u style="width:20px"></u><b class="num">10%</b></p><p><u class="bd" style="width:20px"></u><b class="num">10%</b></p></td></tr>
        </tbody>
      </table>
    </div>
    <p class="lgd"><span><u></u>검색량 비중</span><span><u class="bd"></u>예산 비중</span></p>
  </div>
  <div class="pg">19</div>
  <div class="src">검색량 비중: 검색어 도구 2026년 9월 월간 조회 수 기준, 대상 검색어 86개</div>
</section>

스타일

.slide.lo-ex-kw .hd .lb{color:var(--mu)}
.slide.lo-ex-kw :where(.body p,.body ul,.body ol,.body dl,.body dd,.body dt){margin:0;padding:0;list-style:none}
.slide.lo-ex-kw .k{font-size:var(--f-cap);font-weight:600;color:var(--mu)}
.slide.lo-ex-kw .cd{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow)}
.slide.lo-ex-kw .say{font-size:var(--f-body);color:var(--ink2)}
.slide.lo-ex-kw .say::before{content:"→";color:var(--mu);font-weight:600;margin-right:10px}
.slide.lo-ex-kw table{width:100%;border-collapse:collapse}
.slide.lo-ex-kw th{font-size:var(--f-cap);font-weight:600;color:var(--mu);text-align:left;padding:0 14px 10px;border-bottom:1px solid var(--line2)}
.slide.lo-ex-kw td{font-size:var(--f-sm);color:var(--ink2);padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.slide.lo-ex-kw tr:last-child td{border-bottom:0}
.slide.lo-ex-kw td.k{font-size:var(--f-body);font-weight:700;color:var(--ink)}
.slide.lo-ex-kw .body{gap:10px}
.slide.lo-ex-kw .t{padding:20px 22px 8px}
.slide.lo-ex-kw td{padding:9px 14px}
.slide.lo-ex-kw td.k{white-space:nowrap}
.slide.lo-ex-kw .ty{display:inline-block;font-size:var(--f-cap);font-weight:600;color:var(--ink2);box-shadow:inset 0 0 0 1px var(--line2);border-radius:12px;padding:1px 10px;white-space:nowrap}
.slide.lo-ex-kw .kw span{display:inline-block;font-size:var(--f-cap);color:var(--ink);background:var(--soft);border-radius:var(--r-sm);padding:1px 8px;margin:2px 4px 2px 0;white-space:nowrap}
.slide.lo-ex-kw .bs{width:176px}
.slide.lo-ex-kw .bs p{display:flex;align-items:center;gap:8px;height:19px}
.slide.lo-ex-kw .bs u,.slide.lo-ex-kw .lgd u{display:block;height:8px;border-radius:4px;background:var(--g2)}
.slide.lo-ex-kw .bs u.bd,.slide.lo-ex-kw .lgd u.bd{background:var(--g4)}
.slide.lo-ex-kw .bs b{font-size:var(--f-cap);font-weight:600;color:var(--ink2)}
.slide.lo-ex-kw tr.hot .ty{background:var(--ac);color:var(--card);box-shadow:none}
.slide.lo-ex-kw tr.hot .bs u.bd{background:var(--ac)}
.slide.lo-ex-kw tr.hot td.k{color:var(--ac)}
.slide.lo-ex-kw .lgd{display:flex;gap:20px;justify-content:flex-end;font-size:var(--f-cap);color:var(--mu)}
.slide.lo-ex-kw .lgd span{display:flex;align-items:center;gap:8px}
.slide.lo-ex-kw .lgd u{width:24px}