FrontEnd Developer Road Map

FrontEnd Developer RoadMap – HTML 5 Tutorial 10 Meta Etiketi Nedir ve Attribute’ları İle Neler Yapılabilir?

Merhabalar, bu yazımda Html head etiketleri arasında yazılabilecek meta etiketlerine bakıyor olacağız.

Meta Etiketi Nedir?

Web sitelerinin head etiketleri arasında bulunan ve site hakkında arama motorlarına ve siteye giriş yapan botlara bilgiler veren kod yapısı meta etiketi olarak tanımlanmaktadır. Meta Tag olarak global alanda isimlendirilen bu kodlar, her siteye özel olarak uyarlanarak head etiketleri arasında yer almalıdır.

Çok sayıda meta etiketi olduğu gibi bu etiketler arasından site için uygun ve gerekli olanlarının tercih edilmesi gerekir. Böylece hem sitenin arama motorları için uygun yapıda olması sağlanabilir hem de SEO çalışmalarının bir parçası olarak bu eksiklik giderilir.

Meta etiketleri, web sitesinin en başında yer alır ve temelde basit Html kod yapılarındandır.

<meta charset = “utf-8” />

şeklinde yer alabilecek bir meta etiketi, web sitesi için karakter kodlamasının nasıl olması gerektiğini belirtir. Üstelik bu kodlar sadece arama motorları için değil tarayıcılar için de sayfanın ideal şekilde gösterilmesi adına bilgiler sunacağından dolayı örnekteki karakter kodlaması gibi önemli veriler sunulmalıdır. Meta etiketlerinin kullanımında meta, etiket ve = işaretinden sonra tırnak içinde ilgili verinin ne olduğu yazılmalıdır.

Meta Tag Ne Kadar Önemlidir?

Doğru meta etiketlerini, web sitenizde doğru şekilde kullandığınızda, arama motorlarına web siteniz hakkında bilmeleri gereken her şeyi aktarmış olursunuz. Meta Tag, SEO için her zaman öneme sahip olduğu gibi her web site sahibinin önemsemesi gereken bir ayrıntıdır.

Meta Tag’i ve Attribute’ları

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="Content-Language" content="tr">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="index, follow">


    <meta >
    <meta >
    <meta >
    <meta >
    <meta > 
    <meta >
    <meta >

    <title>Document</title>
</head>

<body>

    Murat Bilginer

</body>

</html>
  • http-equiv=”Content-Type” : Web sitenizin dil kodunu belirlemede kullanılır.
  • http-equiv=”Content-Language” : Web sitesinin dilini belirler.
  • description : Web sitesinin açıklamasının yapıldığı yer.
  • keywords : Web sitesinin ilişkili olduğu anahtar kelimelerin yazılması gerekmektedir.
  • http-equiv=”X-UA-Compatible” : Web sitesinin hangi tarayıcılarla uyumlu olduğunu gösterir.
  • name=”viewport” : Mobil cihazlarla uyumluluğunu göstermektedir.
  • name=”robots” : Arama motorlarında listelenmenin iznidir.
Sosyal Medya İçin Yazılanlar
  • og:title : Sayfa Başlığı.
  • og:url : Sayfa Url’i.
  • og:image : Temsili fotoğraf (kare olmasını öneririm).
  • og:site_name : Web Sitesinin İsmi.
  • og:type : Web Sitenin Tipi.
  • fb:admins : Facebook admin kodu.
  • og:description : Web sitesinin Açıklaması.

Meta etiketinin Attribute’larını tek bir meta etiketi içinde yazıp göstermekte olasıdır. Ancak bu çok tavsiye edilen bir kullanım değildir.

Bunların tamamını her projede kullanmayız. İhtiyacımız olanları belirleyip kullanmak faydalı olacaktır.

Meta etiketi ile alakalı bilmemiz gerekenler şimdilik bu kadar. Bir sonraki yazımda görüşmek üzere.

Murat Bilginer

21 Şubat 1992'de doğdum. Endüstri Mühendisi olarak lisansımı 2016 yılında tamamladım. Industryolog Akademi - NGenius oluşumlarının kurucusuyum. Şu anda kendi şirketim Brainy Tech ile Web ve Mobil Geliştirme, AWS, Google Cloud Platform Sistemleri için DevOps, Big Data Analiz ve Görselleştirme hizmetleri sunmakta ve Online Eğitimler vermekteyiz.

Share
Published by
Murat Bilginer

Recent Posts

Kedimiz Oly & FIP Süreci 10 – Oly’nin PCR Sonucu Çıktı FCov Pozitif…

Selamlar, bu yazımda sizlere Oly’nin çıkan PCR sonucu ve geçtiğimiz bir haftada hastalığın genel seyrinden…

36 saniye ago

Kedimiz Oly & FIP Süreci 9 – 1 Haftalık GS İğnesi Serüveni – Oly İyileşiyor mu?

Selamlar, bu yazımda Oly'nin 1 hafta boyunca olduğu GS iğnesi, yaşanan değişimleri anlatmaya çalışacağım. PCR…

5 gün ago

Kedimiz Oly & FIP Süreci 8 – Yeniden Hayvan Hastanesi – Sonuç Kontrolü ve Sonrası…

Selamlar, bu yazımda Hemogram ve Biyokimya sonuçlarımızı göstermek için İÜCHH'ne tekrar gidişimizi ve sonrasını anlatacağım.…

5 gün ago

Kedimiz Oly & FIP Süreci 7 – GS İğnesine Başlama Kararımız ve Oly’de Dikkat Ettiklerimiz

Selamlar, bu yazımda GS iğnesine başlama kararımızı ve Oly’de bu süreçte nelere dikkat ediyor, neler…

5 gün ago

Kedimiz Oly & FIP Süreci 6 – İstanbul Üniversitesi Cerrahpaşa Hayvan Hastanesi Serüveni ve Sonrası

Selamlar, bu yazımda İÜCHH'deki tedavi sürecimiz ve sonrasında yaşananlardan bahsetmeye çalışacağım. 20.06.2025 Cuma günü saat…

6 gün ago

Kedimiz Oly & FIP Süreci 5 – Teşhisten Önce Biz… Veterinerimize Güvenebilir Miydik?

Eve Dönüş ve İlk Şüpheler 18 Haziran Perşembe saat 23 sularında İstanbul’daki evimize giriş yaptık.…

6 gün ago