메타 태그 생성기

SEO 메타 태그와 소셜 미디어 공유 태그를 생성

기본 정보

0/60

0/150

프리셋을 선택하거나 50-300자 사이에서 직접 입력할 수 있습니다. 선택값은 쿠키에 저장됩니다.

Open Graph
Twitter Card
추가 설정
미리보기
https://example.com

Page Title

Page description will appear here...

코드
<meta name="robots" content="index, follow">
<meta property="og:type" content="website">
<meta property="og:locale" content="ko_KR">

<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image">

최적화 팁

제목은 50-60자 이내로 작성하세요

설명은 선택한 글자 수 기준에 맞춰 핵심 내용을 담으세요

OG 이미지는 1200x630px 크기를 권장합니다

각 페이지마다 고유한 메타 태그를 사용하세요

메타 태그 생성기란?

메타 태그 생성기는 웹 페이지의 SEO 메타 태그, Open Graph(OG) 태그, Twitter Card 태그를 폼 입력만으로 손쉽게 생성하는 도구입니다. Google 검색 결과, Facebook, LinkedIn, Discord 등 다양한 플랫폼에서의 미리보기를 실시간으로 확인할 수 있으며, HTML과 Next.js/Nuxt.js 코드를 자동 생성하여 바로 프로젝트에 적용할 수 있습니다.

  • SEO 기본 메타 태그(title, description, keywords, canonical) 생성
  • Open Graph 태그(og:title, og:image 등)로 소셜 미디어 공유 최적화
  • Twitter Card(summary, large image) 메타 태그 생성
  • Google, Facebook, LinkedIn, Discord 실시간 미리보기
  • HTML, Next.js, Nuxt.js 코드 형식으로 자동 출력
  • robots 메타 태그로 검색 로봇 색인 제어

사용 방법

  1. 1

    기본 정보 입력

    페이지 제목, 설명, URL, 키워드 등 기본 SEO 정보를 입력합니다. 권장 글자 수가 안내됩니다.

  2. 2

    Open Graph & Twitter 설정

    OG 이미지 URL, 콘텐츠 유형, Twitter Card 형식 등 소셜 미디어 공유 설정을 입력합니다.

  3. 3

    미리보기 확인

    Google, Facebook, LinkedIn, Discord에서 페이지가 어떻게 표시되는지 실시간 미리보기로 확인합니다.

  4. 4

    코드 복사

    HTML 또는 Next.js/Nuxt.js 형식의 코드 탭을 선택하고, 전체 복사 버튼으로 생성된 메타 태그를 복사합니다.

자주 묻는 질문

활용 팁

  • 제목은 50-60자, 설명은 150-160자 이내로 작성해야 검색 결과에서 잘리지 않습니다
  • 각 페이지마다 고유한 메타 태그를 설정하여 검색 엔진 최적화 효과를 극대화하세요
  • OG 이미지에 텍스트를 포함할 때는 이미지의 중앙에 배치하여 잘림을 방지하세요
  • Google Search Console에서 실제 검색 결과 표시를 확인하여 메타 태그 효과를 검증하세요
  • Next.js 프로젝트에서는 Metadata API를 사용하면 더 효율적으로 메타 태그를 관리할 수 있습니다