Twitter Card 이미지가 표시되지 않음: 7가지 원인 및 해결 방법

링크가 포함된 트윗에는 이미지가 표시되지 않고 일반 URL만 표시됩니다. 가장 일반적인 7가지 원인과 각 원인을 해결하는 방법은 다음과 같습니다.

실종의 7가지 원인 Twitter Card 이미지

X(이전의 Twitter)에서 공유된 URL이 카드 이미지를 표시하지 않는 경우 이는 거의 항상 다음 7가지 문제 중 하나입니다. 하나하나 살펴보겠습니다.

1. twitter:card 태그가 없거나 잘못되었습니다.

X에는 ​​명시적인 twitter:card 태그가 필요합니다. 이것이 없으면 OG 태그가 완벽하더라도 X는 카드를 전혀 렌더링하지 않습니다.

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Title" />
<meta name="twitter:description" content="Your description" />
<meta name="twitter:image" content="https://yoursite.com/image.jpg" />

카드 유형에는 summary(작은 미리보기 이미지) 및 summary_large_image(전체 카드)의 두 가지 유형이 있습니다. 최고의 시각적 효과를 얻으려면 summary_large_image를 사용하세요.

2. 이미지가 너무 작음

X에는 ​​최소 이미지 크기 요구 사항이 있습니다.

• summary_large_image: 최소 800×418 픽셀
• 요약: 최소 400×150 픽셀
• 권장: 1200×628(모든 플랫폼에서 작동)

이미지가 최소값보다 작으면 X는 자동으로 카드를 삭제합니다. 오류 메시지가 없습니다. 링크가 일반 텍스트로 나타납니다.

3. 공개적으로 접근할 수 없는 이미지 URL

X의 크롤러는 인증 없이 이미지를 가져올 수 있어야 합니다. 일반적인 차단제:

• 로그인 벽 또는 인증 뒤의 이미지
• robots.txt에 의해 차단됨
• Cloudflare 또는 CDN 크롤러에 403/429 오류 반환
• 교차 출처 가져오기를 방지하는 CORS 제한

4. 트위터 캐시가 새로 고쳐지지 않았습니다.

모든 플랫폼과 마찬가지로 X는 카드 데이터를 캐시합니다. 태그를 업데이트한 후에는 캐시가 만료되거나 강제로 새로 고쳐질 때까지 X가 변경 사항을 적용하지 않습니다.

<meta property="og:image" content="https://yoursite.com/new-image.jpg" />

Twitter Card Validator를 사용하여 URL을 입력하고 캐시 새로고침을 실행하세요. 유효성 검사기는 X가 보는 것을 정확하게 보여줍니다.

5. 잘못된 MIME 유형 또는 손상된 이미지

이미지 서버가 잘못된 MIME 유형을 반환하는 경우(예: image/jpeg 콘텐츠 유형으로 PNG를 제공하는 경우) X는 이를 거부할 수 있습니다. 마찬가지로, 손상되었거나 부분적으로 로드된 이미지는 삭제됩니다.

6. 페이지가 Twitter의 크롤러에 오류를 반환합니다.

Twitter 봇이 페이지를 가져올 때 페이지에서 4xx 또는 5xx 오류를 반환하면 카드가 생성되지 않습니다. 이는 다음과 같은 경우에 발생할 수 있습니다.

• 렌더링을 위해 JavaScript가 필요한 SPA 앱(Twitter의 크롤러는 JS를 실행하지 않음)
• 미국 기반 크롤러를 차단하는 지역 차단
• Cloudflare 개찰구 또는 CAPTCHA

7. Twitter Card 태그 없이 OG 태그만 사용

X 는 OG 태그로 대체될 수 있지만 twitter:card 태그를 선호합니다. og:image만 설정하고 twitter:image는 설정하지 않으면 X에서 카드가 올바르게 렌더링되지 않을 수 있습니다. 항상 둘 다 설정하십시오.

<!-- Open Graph (for LinkedIn, Discord, Slack, WhatsApp) -->
<meta property="og:image" content="https://yoursite.com/image.jpg" />

<!-- Twitter/X specific (for X/Twitter) -->
<meta name="twitter:image" content="https://yoursite.com/image.jpg" />

빠른 수정 체크리스트

자주 묻는 질문