카톡에 링크 보냈는데 미리보기가 안 뜰 때

링크를 공유했는데 제목도 이미지도 없이 주소만 덜렁 갑니다. 클릭률은 미리보기 카드가 있을 때와 없을 때가 크게 다르기 때문에, 마케팅 링크라면 꼭 잡고 넘어가야 하는 문제입니다. 원인은 거의 항상 셋 중 하나입니다. 순서대로 점검하세요.

점검 1. 페이지에 오픈그래프 태그가 있는가

카카오톡, 페이스북, 슬랙이 보여주는 미리보기는 전부 오픈그래프(OG)라는 메타 태그를 읽어서 만듭니다. 페이지 HTML의 head 안에 og:title, og:description, og:image 세 가지가 있어야 카드가 구성됩니다. 본인 페이지가 아니라면 수정할 수 없으니, 태그가 있는 페이지인지부터 확인해야 합니다.

태그가 있는지 확인하는 가장 빠른 방법은 줄임 링크 검사기에 주소를 넣어보는 것입니다. 도착 페이지의 제목과 설명이 잡히면 OG가 살아 있는 것이고, 비어 있으면 페이지 쪽 태그 문제입니다.

점검 2. 카카오가 옛날 정보를 기억하고 있는가

태그를 고쳤는데도 카톡에는 옛 제목과 옛 이미지가 계속 나온다면 캐시 문제입니다. 카카오는 한 번 읽은 링크의 미리보기를 한동안 저장해 둡니다. 카카오 개발자 사이트의 공유 디버거 도구(developers.kakao.com 의 tool 메뉴, OG 캐시 초기화)에 주소를 넣고 초기화하면 다음 공유부터 새 정보로 나옵니다.

점검 3. 이미지가 규격에 안 맞는가

제목은 나오는데 이미지만 빠진다면 og:image 쪽을 보세요. 흔한 원인은 이렇습니다.

• 이미지 주소가 상대 경로인 경우. https:// 로 시작하는 전체 주소여야 합니다.
• 이미지가 너무 작은 경우. 가로 200px 미만이면 무시되는 서비스가 많습니다. 1200x630이 가장 무난합니다.
• 이미지 서버가 외부 접근을 막아둔 경우. 로그인해야 보이는 이미지는 미리보기에 쓸 수 없습니다.

단축 링크로 보내면 미리보기가 깨지나요

제대로 만든 단축 서비스라면 깨지지 않습니다. 메신저는 짧은 주소를 따라가 최종 도착지의 OG 태그를 읽기 때문입니다. 줄임으로 만든 링크도 도착지의 미리보기가 그대로 나옵니다. 다만 도착지 자체에 OG 태그가 없다면 어떤 주소로 보내도 카드는 나오지 않습니다. 원인은 언제나 도착 페이지에 있습니다.

정리

미리보기가 안 뜨면 검사기로 OG 태그 유무 확인, 태그를 고쳤다면 카카오 캐시 초기화, 이미지만 빠지면 전체 주소와 크기 확인. 이 세 단계면 거의 모든 경우가 해결됩니다.