카카오톡 미리보기 이미지가 바뀌지 않아요. 어떻게 하나요?

카카오가 이전 정보를 캐시하고 있기 때문입니다. 카카오 디벨로퍼스의 공유 디버거에 해당 URL을 입력하고 캐시 초기화를 누르세요. 그래도 같다면 이미지 파일 이름을 바꿔 새 주소로 지정하는 것이 가장 확실합니다.

공유 대표 이미지는 어떤 크기로 만들어야 하나요?

1200×630px(1.91:1)이 가장 무난합니다. 최소 600×315px 이상으로 만들고, 파일은 5MB를 넘지 않는 JPG나 PNG로 준비하세요.

Open Graph가 검색 순위에 영향을 주나요?

직접적인 순위 요소는 아닙니다. 다만 공유 링크의 클릭률을 높이고, 구글은 검색 결과 제목과 대표 이미지를 정할 때 Open Graph 정보도 참고합니다.

트위터 카드 태그도 꼭 넣어야 하나요?

X(트위터)는 트위터 태그가 없으면 Open Graph 태그를 대신 읽습니다. 다만 twitter:card가 없으면 작은 요약 카드로 표시되므로 summary_large_image 한 줄은 넣어 두는 것이 좋습니다.

페이지마다 대표 이미지를 다르게 해야 하나요?

홈페이지와 주요 페이지만이라도 다르게 두면 좋습니다. 블로그 글이나 상품처럼 페이지가 많다면 본문 대표 이미지를 자동으로 쓰고, 없을 때만 기본 이미지를 쓰도록 템플릿을 설정하세요.

Open Graph·트위터 카드 설정법 — 카카오톡 공유 미리보기 완벽 가이드

Open Graph(OG)는 링크를 공유할 때 보이는 제목, 설명, 이미지를 지정하는 메타 태그입니다. og:title, og:description, og:image(1200×630px, 절대 URL) 세 가지를 기본으로 넣고 og:url, og:type, og:site_name, og:locale, twitter:card를 더하면 카카오톡, 페이스북, 슬랙, X에서 깔끔한 미리보기 카드가 만들어집니다. 수정한 내용이 반영되지 않을 때는 각 서비스의 캐시를 초기화해야 합니다.

Open Graph는 어디에 쓰이나요?

링크를 붙여넣으면 메신저와 SNS의 수집 봇이 페이지를 방문해 OG 태그를 읽고 미리보기 카드를 만듭니다. 태그가 없으면 서비스가 제목과 이미지를 임의로 고르기 때문에, 메뉴 문구나 엉뚱한 아이콘이 카드에 나오기도 합니다.

서비스	읽는 정보	알아둘 점
카카오톡	OG 태그	이미지를 2:1 비율(800×400 기준)로 자동으로 잘라 표시
페이스북	OG 태그	권장 1200×630, 최소 200×200, 8MB 이하
X(트위터)	트위터 태그, 없으면 OG 태그	큰 이미지 카드는 2:1 비율, 최소 300×157, 5MB 미만, SVG 미지원
슬랙	oEmbed, 트위터 카드, OG 태그	미리보기를 약 30분간 캐시하며 삭제 기능은 없음
구글 검색	og:title, og:image 등	검색 결과 제목과 대표 이미지를 정할 때 참고

OG 태그 자체가 검색 순위를 올리지는 않습니다. 하지만 같은 링크라도 이미지와 제목이 제대로 나온 카드가 훨씬 많이 클릭되고, 단골 고객이 단체방에 링크를 공유할 때 브랜드 첫인상을 좌우합니다. 네이버 서치어드바이저 가이드도 OG 태그 작성을 권장하므로, 네이버 대응을 위해서도 넣어 두는 것이 좋습니다. 자세한 내용은 네이버 SEO 가이드를 참고하세요.

꼭 넣어야 할 태그와 예시 코드

아래 코드를 <head> 안, 되도록 앞쪽에 넣습니다. 슬랙처럼 페이지 앞부분만 읽는 수집 봇도 있기 때문입니다.

<head>
  <meta charset="utf-8">
  <title>성수동 레터링 케이크 주문 안내 | 달빛베이커리</title>
  <link rel="canonical" href="https://www.example.co.kr/cake/">

  <!-- Open Graph -->
  <meta property="og:type" content="website">
  <meta property="og:site_name" content="달빛베이커리">
  <meta property="og:locale" content="ko_KR">
  <meta property="og:url" content="https://www.example.co.kr/cake/">
  <meta property="og:title" content="성수동 레터링 케이크 주문 안내">
  <meta property="og:description" content="생일·기념일 레터링 케이크를 3일 전까지 예약하면 원하는 날짜에 받을 수 있습니다.">
  <meta property="og:image" content="https://www.example.co.kr/og/cake-1200x630.jpg">
  <meta property="og:image:width" content="1200">
  <meta property="og:image:height" content="630">
  <meta property="og:image:alt" content="딸기 생크림 레터링 케이크">

  <!-- X(트위터) 카드 -->
  <meta name="twitter:card" content="summary_large_image">
</head>

태그	작성 요령
og:title	공유 카드 제목. 타이틀에서 브랜드명을 뺀 문장이면 충분합니다.
og:description	한두 문장 요약. 메타 설명을 그대로 써도 됩니다.
og:image	https://로 시작하는 절대 URL. 실제로 열리는 이미지여야 합니다.
og:url	canonical과 같은 대표 주소. 공유 수가 여러 주소로 나뉘지 않습니다.
og:type	홈·일반 페이지는 website, 블로그 글은 article
og:site_name · og:locale	브랜드명과 ko_KR
twitter:card	summary_large_image (큰 이미지 카드)

OG 태그는 property 속성으로, 트위터 태그는 name 속성으로 쓰는 것이 표준입니다. X는 twitter:title, twitter:image가 없으면 og 값을 대신 쓰므로 twitter:card 한 줄만 추가해도 충분합니다. og:image:width와 og:image:height는 선택 사항이지만, 페이스북은 이 값이 있어야 처음 공유할 때부터 이미지를 바로 보여줄 수 있다고 안내합니다.

페이지가 많은 사이트라면 템플릿에서 자동으로 채우세요. 블로그 글은 글 제목과 대표 이미지를, 상품은 상품명과 상품 사진을 넣고, 값이 없을 때만 사이트 기본 이미지를 쓰게 하면 됩니다. 대부분의 홈페이지 빌더와 쇼핑몰 솔루션은 SEO 설정 메뉴에서 공유 이미지를 지정할 수 있습니다.

og:image는 어떤 크기와 형식으로 만들까요?

1200×630px(1.91:1) 한 장이면 대부분의 서비스를 만족합니다.

크기: 최소 600×315px 이상이어야 큰 카드로 나옵니다. 그보다 작으면 작은 썸네일로 줄어들거나 이미지가 빠집니다.
안전 영역: 카카오톡은 2:1로, 일부 화면은 정사각형으로 잘라 보여줍니다. 문구와 로고는 가운데에 모으고 가장자리는 여백으로 두세요.
형식: JPG나 PNG가 가장 안전합니다. SVG는 대부분 지원하지 않고, WebP·AVIF는 서비스마다 지원 여부가 달라 공유 이미지로는 권하지 않습니다.
용량: 5MB를 넘지 않게, 가능하면 1MB 이하로 가볍게 만듭니다. 수집 봇이 큰 파일을 받다가 시간이 초과되는 경우가 있습니다.
글자: 휴대폰 대화창에서는 카드가 작게 보입니다. 짧고 굵은 문구 한 줄이면 충분합니다.

본문 이미지 최적화는 이미지 SEO 가이드에서 따로 다룹니다.

미리보기가 안 나올 때 흔한 원인

증상	원인	해결
이미지가 안 나옴	og:image가 `/og.jpg` 같은 상대 경로	`https://`부터 시작하는 절대 URL로 지정
이미지가 안 나옴	이미지 주소가 404, 로그인 필요, 핫링크 방지	브라우저 시크릿 창에서 이미지 주소가 열리는지 확인
카드 전체가 안 나옴	방화벽·봇 차단이 수집 봇을 막음	kakaotalk-scrap, facebookexternalhit, Slackbot-LinkExpanding 같은 수집 봇 허용
제목이 엉뚱함	OG 태그를 자바스크립트로 나중에 삽입	수집 봇 대부분은 스크립트를 실행하지 않으므로 서버가 보내는 HTML에 태그 포함
이미지가 작게 나옴	이미지가 600×315 미만	1200×630으로 교체
고쳤는데 그대로	서비스가 예전 정보를 캐시	아래 방법으로 캐시 초기화

수정했는데 그대로라면? 서비스별 캐시 초기화

미리보기 정보는 URL별로 캐시됩니다. 태그를 고친 뒤에는 서비스별로 새로 수집하게 해야 합니다.

카카오톡

카카오 디벨로퍼스 공유 디버거(developers.kakao.com/tool/debugger/sharing)에 카카오 계정으로 로그인합니다.
실제로 공유하는 주소를 그대로 입력합니다. http와 https, www 유무, 끝의 /까지 같아야 같은 캐시로 인식됩니다.
스크랩 결과를 확인하고 캐시 초기화를 누릅니다. 서버 쪽 캐시는 바로 초기화됩니다.
내 휴대폰에서만 옛 이미지가 보이면 기기 캐시 문제입니다. 카카오톡 설정의 앱 관리 → 저장공간 관리에서 캐시 데이터를 삭제한 뒤 다시 확인하세요.

페이스북: 공유 디버거(developers.facebook.com/tools/debug)에 URL을 넣고 다시 스크랩을 누릅니다. 페이스북은 이미지를 바꿀 때 새 파일 주소를 쓰라고 안내하므로, og-v2.jpg처럼 파일 이름을 바꾸는 습관을 들이면 다른 서비스에서도 문제가 줄어듭니다.

슬랙: 약 30분 동안 캐시되며 직접 지울 방법이 없습니다. 급하게 확인할 때는 주소 끝에 ?v=2 같은 값을 붙여 새 주소로 테스트하세요.

X·링크드인: X는 게시물 작성 화면의 미리보기로, 링크드인은 Post Inspector(linkedin.com/post-inspector)로 확인합니다.

SEO Check에서는 이렇게 점검합니다

무료 SEO 진단은 홈페이지의 공유 태그를 읽고, 대표 이미지를 실제로 내려받아 확인합니다.

og:title · og:description: 태그가 있는지 확인합니다.
og:image: 절대 URL인지, 주소가 실제로 열리는지, 이미지 크기와 비율을 측정합니다. 600×315 미만이면 경고, 비율이 1.91:1에서 크게 벗어나도 경고이며 1200×630을 권장 기준으로 봅니다.
og:url: canonical 주소와 같은지 비교합니다.
og:type · og:site_name · og:locale: 세 가지 중 두 가지 이상이면 통과입니다.
twitter:card: 있는지 확인하고 summary_large_image를 권장합니다.
미리보기: 리포트에서 카카오톡·페이스북 공유 카드와 구글 검색 결과의 예상 모습을 함께 보여줍니다. 네이버 항목에서도 OG 기본 태그를 한 번 더 확인합니다.
og:title, og:description, og:image가 모든 주요 페이지에 있다
og:image는 1200×630 JPG·PNG이고 https 절대 URL이다
시크릿 창에서 이미지 주소가 바로 열린다
og:url이 canonical과 같다
twitter:card를 summary_large_image로 지정했다
태그를 고친 뒤 카카오·페이스북 디버거로 캐시를 초기화했다