HTML <meta> Etiketi
Örnek
Bir HTML belgesindeki meta verileri tanımlayın:
<head>
<meta charset="UTF-8">
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="author" content="John Doe">
<meta
name="viewport" content="width=device-width, initial-scale=1.0">
</head>
Aşağıda daha fazla "Kendiniz Deneyin" örnekleri.
Tanım ve Kullanım
etiketi , <meta>
bir HTML belgesiyle ilgili meta verileri tanımlar. Meta veriler, veriler hakkındaki verilerdir (bilgi).
<meta>
etiketler her zaman <head> öğesinin içine girer ve genellikle karakter kümesini, sayfa açıklamasını, anahtar sözcükleri, belgenin yazarını ve görünüm penceresi ayarlarını belirtmek için kullanılır.
Meta veriler sayfada görüntülenmeyecek, ancak makineyle ayrıştırılabilir.
Meta veriler, tarayıcılar (içeriğin nasıl görüntüleneceği veya sayfanın nasıl yeniden yükleneceği), arama motorları (anahtar kelimeler) ve diğer web hizmetleri tarafından kullanılır.
Web tasarımcılarının etiket aracılığıyla görünüm alanı (bir web sayfasının kullanıcının görünür alanı) üzerinde kontrolü ele geçirmesine izin veren bir yöntem vardır ( aşağıdaki "Görüntü Alanı <meta>
Ayarlama" örneğine bakın).
Tarayıcı Desteği
Element | |||||
---|---|---|---|---|---|
<meta> | Yes | Yes | Yes | Yes | Yes |
Öznitellikler
Attribute | Value | Description |
---|---|---|
charset | character_set | Specifies the character encoding for the HTML document |
content | text | Specifies the value associated with the http-equiv or name attribute |
http-equiv | content-security-policy content-type default-style refresh |
Provides an HTTP header for the information/value of the content attribute |
name | application-name author description generator keywords viewport |
Specifies a name for the metadata |
Genel Özellikler
Etiket ayrıca HTML'deki Global Nitelikleri<meta>
de destekler .
Daha fazla örnek
Arama motorları için anahtar kelimeleri tanımlayın:
<meta name="keywords" content="HTML, CSS, JavaScript">
Web sayfanızın bir açıklamasını tanımlayın:
<meta name="description" content="Free Web tutorials for
HTML and CSS">
Bir sayfanın yazarını tanımlayın:
<meta name="author" content="John Doe">
Belgeyi her 30 saniyede bir yenileyin:
<meta http-equiv="refresh" content="30">
Web sitenizin tüm cihazlarda iyi görünmesini sağlamak için görünüm alanını ayarlama:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Görünüm Alanını Ayarlama
Görünüm alanı, kullanıcının bir web sayfasının görünür alanıdır. Cihaza göre değişir - cep telefonunda bilgisayar ekranından daha küçük olacaktır.
<meta>
Tüm web sayfalarınıza aşağıdaki öğeyi eklemelisiniz :
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Bu, tarayıcıya sayfanın boyutlarını ve ölçeklendirmesini nasıl kontrol edeceğine dair talimatlar verir.
Parça width=device-width
, cihazın ekran genişliğini takip etmek için sayfanın genişliğini ayarlar (cihaza göre değişir).
Parça initial-scale=1.0
, sayfa tarayıcı tarafından ilk yüklendiğinde ilk yakınlaştırma seviyesini ayarlar.
Görünüm alanı meta etiketi olmayan bir web sayfası ve görünüm alanı meta etiketine sahip aynı web sayfası örneği :
İpucu: Bu sayfayı bir telefon veya tablet ile geziyorsanız, farkı görmek için aşağıdaki iki bağlantıya tıklayabilirsiniz.
Görüntü alanı hakkında daha fazla bilgiyi Duyarlı Web Tasarımı - Görüntü Alanı Eğitimi'nde okuyabilirsiniz .
İlgili Sayfalar
HTML öğreticisi: HTML Başkanı
HTML DOM referansı: Meta Nesnesi
Varsayılan CSS Ayarları
Hiçbiri.