메타 태그 생성기
필드를 채우고 태그를 페이지의 head에 복사하세요.
- 브라우저에서 실행됩니다 — 입력한 텍스트는 어디로도 전송되지 않습니다
- 가입 불필요, 사용량 제한 없음, 원하는 만큼 무료로 사용
작동 방식
거의 같은 일을 하는 세 가지 태그 묶음이 겹쳐 있습니다. 기존의 SEO 태그, Facebook, LinkedIn, WhatsApp, Slack용 Open Graph, 그리고 Twitter Card입니다. 손으로 쓰면 같은 내용을 세 번 반복하다가 하나를 빠뜨리게 됩니다.
대부분의 작업은 Open Graph가 합니다
Facebook만의 이야기가 아닙니다. LinkedIn, WhatsApp, Slack, Discord, iMessage 등 링크를 미리보기로 펼쳐 주는 대부분의 서비스가 Open Graph 태그를 읽습니다. 이 태그만 제대로 설정하면 거의 모든 곳의 미리보기가 한 번에 해결됩니다. Twitter Cards는 X를 위한 작은 추가 태그 모음이며, 없으면 X는 Open Graph로 대체합니다.
입력하는 동안 길이를 확인합니다
검색 결과에서 잘리기 전까지 대략 제목은 60자, 설명은 160자입니다. 이 수치는 엄격한 제한이 아니라 기준입니다. 검색엔진은 제목을 픽셀 너비로 측정하기 때문에, 대문자와 M이 많은 제목은 소문자 L이 많은 제목보다 더 일찍 잘립니다. 위험한 구간에 들어서면 경고가 알려 줍니다.
사람들이 자주 잊는 부분은 이미지입니다
og:image가 없는 링크는 빈 회색 상자로 미리보기가 표시되며, 이는 클릭 수를 눈에 띄게 떨어뜨립니다. 링크를 가져가는 사이트는 페이지의 기준 URL을 알 수 없으므로 URL은 https로 시작하는 절대 경로여야 합니다. 큰 이미지 카드에는 약 1200×630 픽셀이 적합합니다.
표준 URL(canonical)
canonical 링크를 넣으면 같은 페이지에 여러 주소로 접근할 수 있을 때(끝의 슬래시 유무, 추적 매개변수, http와 https 등) 어느 주소가 원본인지 검색엔진에 알려 줍니다. 중복 콘텐츠 문제 전반을 한 줄로 해결하는 방법입니다.
모든 문자는 이스케이프됩니다
텍스트의 따옴표와 꺾쇠괄호는 올바르게 이스케이프되므로, 설명에 아포스트로피나 큰따옴표가 들어 있어도 그것을 감싼 태그가 깨지지 않습니다.
메타 태그 생성기 자주 묻는 질문
Open Graph 외에 Twitter Card 태그도 필요한가요?
꼭 그렇지는 않습니다. X는 Open Graph로 대체합니다. 추가 태그는 어떤 카드 스타일을 쓸지 제어할 수 있게 해 줍니다.
제목은 얼마나 길어야 하나요?
60자 정도입니다. 검색 엔진은 픽셀 너비를 기준으로 자르므로, 규칙이 아니라 가이드로 보세요.
링크 미리보기에 이미지가 없는 이유는 무엇인가요?
og:image가 없거나 URL이 상대 경로이기 때문입니다. https로 시작하는 절대 경로여야 합니다.
이 태그는 어디에 넣나요?
페이지의 <head> 안에 넣습니다.
미리보기가 갱신되지 않는 이유는 무엇인가요?
소셜 플랫폼은 캐시를 강하게 사용합니다. 대부분 다시 가져오도록 강제하는 디버거를 제공합니다.