Softonic

Meta Etiket Üreticisi

Adım 1 / 3
Temel SEO
0/60
0/160
Robots
Sonraki

Bir form doldurun, sayfa başlığı, açıklama, kanonik URL, sosyal medya resmi, yazar, sitenin adı ve Twitter hesap adı, ardından jeneratör, SEO temel kurallarını, Open Graph’ı (Facebook, LinkedIn, Discord, Slack için), Twitter Kartını, favicon/Apple Touch simgesini ve isteğe bağlı olarak Makale veya Ürün için Schema.org JSON-LD’yi içeren, kolayca yapıştırılabilir bir meta etiket bloğu üretir. Bu özellik, statik bir siteyi elden yapılandırırken veya yalnızca ham <head> düzenleyici sunan bir içerik yönetim sisteminde meta veri eklerken oldukça pratiktir.

Başlık parçasını nasıl oluştururuz?

  1. 1

    Sayfa meta verilerini girin

    Başlık, açıklama, kanonik URL, yazar, site adı.

  2. 2

    Sosyal görüntü URL'sini ekleyin

    `og:image` ve `twitter:image` için kullanılır. 1200×630 boyutu en uygundur.

  3. 3

    Seçim seçenekleri

    Twitter kart türü, robotlar için direktifler, tema rengi, Schema.org türü.

  4. 4

    Çıkışı kopyalayın

    `<head>...</head>` arasında yapıştırmaya hazır olan HTML `<meta>` etiketlerinden oluşan bir blok.

Jeneratörün ürettiği şey

<!-- 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">

Alan alan rehber

  • Başlık: 50–60 karakter uzunluğunda olmalı ve ana anahtar kelimeyi içermelidir. Markayı sonuna ekleyin: Page title, Brand.
  • Açıklama: 140–160 karakter. Tek başına da okunabilir şekilde hazırlanmalıdır. Sayfalar boyunca tekrarlanan standart ifadelerden kaçınılmalıdır.
  • Kanonik: mutlak URL; https:// dahil. og:url ile eşleşir.
  • OG görseli: En az 1200×630 piksel (Facebook’un tercih ettiği 1,91:1 oranı); JPG veya PNG formatında ve boyutu 8 MB’nin altında olmalıdır.
  • Twitter kartı: İyi bir görseliniz varsa summary_large_image; küçük küçük resim için summary.
  • Robotlar: Kamu sayfaları için index, follow; hazırlık veya ince içerikler için noindex, nofollow.

İsteğe bağlı ek özellikler

  • Makale veya ürün için JSON-LD, Google’un yazarı, yayın tarihi, fiyatı ve inceleme yıldız sayısı gibi ayrıntılı bilgileri göstermesini sağlar.
  • theme-color, Android Chrome ve iOS Safari’de tarayıcı arayüzünü (chrome) renklendirir.
  • Çok dilli siteler için og:locale (örneğin en_US, es_ES).
  • og:type=article ek modelleri: article:published_time, article:author, article:section, article:tag.

Bu jeneratörün önlediği yaygın hatalar

  • Viewport etiketini unutmaktır: Sayfanız mobil cihazlarda masaüstü genişliğinde ve 0,3 büyüme düzeyinde görüntülenmektedir.
  • <title>, og:title ve twitter:title’de farklı başlıklar; tutarlı olmayan pay kartları.
  • og:image‘deki **göreli görsel URL’leri**: Facebook bu URL’leri çözümleyememekte; kart görüntülenememektedir.
  • og:type eksik. Standart değerler işe yarar, ancak Facebook açık bir değerle daha memnun kalır.

Sık Sorulan Sorular

Teknik olarak Twitter, kendi etiketleri yokken Open Graph’a geri döner; bu nedenle yalnızca OG etiketi belirtilmişse bile Twitter bir kart görüntüler. Twitter’e özgü etiketler ekleyerek deneyimi özelleştirebilirsiniz (örneğin farklı görüntü oranları).

1200×630 px (1,91:1). Facebook ve LinkedIn bu görüntüyü tam boyutunda gösterir; Twitter ise özet kartı için görüntüyü kısaltır. Kritik içerikleri kenarlara yerleştirmeyin; ortadaki %60’lık alan güvenli bölgedir.

Sayfalar bu özellik olmadan da iyi sıralanır. JSON-LD, içerik türü bir Schema.org şemasına uygun olduğunda zengin sonuç özelliklerini (reçete kartları, sık sorular akkordeonları, ürün listeleri) destekler. Uygun yerlere ekleyin.

HTML’deki <head> ile </head> arasında, analizcinin bu bölgelere ulaşmasını geciktirebilecek herhangi bir dış stil dosyası veya betikten önce yerleştirin.

Hayır. Her şey tarayıcınızda yerel olarak oluşturulur.

İlgili Araçlar

ASCII Tablosu Referansı

NUL, LF ve DEL dahil her kod için ondalık, onaltılık, sekizlik ve ikili değerlerle HTML sayısal karakter başvurusu gösterimini sunan tam ASCII tablosu.

HTML Karakter Referansı

HTML varlıklarının aranabilir listesi; adlandırılmış ve sayısal kodlarıyla birlikte özel karakter ve semboller için tek tıkla kopyalama.

Klavye kısayolları başvurusu

macOS, Windows ve Linux’ta VS Code, Chrome ve GNU Readline kullanan Bash için belgelenmiş varsayılan kısayolları arayın.

FPS Sayacı

requestAnimationFrame ile tarayıcı FPS değerini ölçün: yumuşatma, en düşük ve en yüksek kare hızı, uyarı eşiği ve isteğe bağlı grafik. Yerel çalışır, yükleme ve API yoktur.

E-posta Doğrulayıcı

Bir e-posta adresini doğrulayın: RFC 5322 sözdizimi kontrolü, canlı MX kaydı sorgulama, ayrıca yerel kısım, alan adı ve uzunluk bilgileri. Hiçbir e-posta gönderilmez.

EditorConfig Oluşturucu

Girinti stili ve boyutu, satır sonu, karakter kümesi ve boşluk kurallarınızla bir .editorconfig dosyası oluşturarak IDE ve editörler arasında tutarlı biçimlendirme sağlayın.

Araç diğer dillerde mevcuttur