메타 태그 생성기

생성기가 만들어내는 것

<!-- Primary Meta -->
<title>Page title, Site name</title>
<meta name="description" content="A 150-character summary of the page content.">
<link rel="canonical" href="https://example.com/page">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="index, follow">

<!-- Open Graph -->
<meta property="og:type" content="article">
<meta property="og:url" content="https://example.com/page">
<meta property="og:title" content="Page title">
<meta property="og:description" content="Same description or a social-optimized one">
<meta property="og:image" content="https://example.com/og-image.jpg">
<meta property="og:site_name" content="Site name">

<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@siteaccount">
<meta name="twitter:creator" content="@authoraccount">
<meta name="twitter:title" content="Page title">
<meta name="twitter:description" content="Description">
<meta name="twitter:image" content="https://example.com/og-image.jpg">

<!-- Icons -->
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<meta name="theme-color" content="#0b5ed7">

필드별 안내

• 제목: 50~60자 분량으로, 주요 키워드를 포함하고 브랜드명을 마지막에 표기하세요: Page title, Brand.
• 설명: 140~160자 분량입니다. 단독으로도 잘 읽어집니다. 여러 페이지에 걸쳐 반복되는 표준화된 문구는 피해야 합니다.
• Canonical: 절대 URL로, https://를 포함합니다. og:url와 일치합니다.
• OG 이미지: 최소 1200×630 픽셀(페이스북이 권장하는 비율인 1.91:1), JPG 또는 PNG 형식, 크기가 8MB 미만이어야 합니다.
• 트위터 카드: 좋은 이미지가 있으면 summary_large_image, 작은 썸네일의 경우 summary를 사용하세요.
• 로봇: 공개 페이지용에는 index, follow, 스테이징 페이지 또는 얇은 콘텐츠용에는 noindex, nofollow입니다.

선택적 추가 기능들

• 기사 또는 제품에 사용하는 JSON-LD를 통해 구글은 저자 정보, 출판일, 가격, 리뷰 별점 등 풍부한 정보를 포함한 결과를 표시할 수 있습니다.
• **theme-color**는 안드로이드 크롬 및 iOS 사파리에서 브라우저 UI(크롬)의 색상을 지정합니다.
• 다국어 사이트용으로 사용되는 og:locale (예: en_US, es_ES).
• og:type=article의 추가 항목: article:published_time, article:author, article:section, article:tag.

이 생성기가 방지하는 흔한 오류들

• viewport 태그를 잊었습니다. 귀하의 페이지는 모바일 기기에서 데스크톱 너비로 표시되며, 줌 수준은 0.3입니다.
• <title>, og:title 및 twitter:title에서는 서로 다른 제목이 사용되어 있으며, 공유 카드의 정보가 일관되지 않습니다.
• og:image 파일 내의 상대 이미지 URL은 페이스북에서 처리할 수 없어 카드가 제대로 표시되지 않습니다.
• og:type이 누락되었습니다. 기본값으로도 작동하지만, 페이스북은 명시적인 값을 더 선호합니다.