Merhaba sevgili Webkolog okurları,
Bugün sizlere web sayfanızın "görünmez" ama bir o kadar da önemli kısımlarından bahsedeceğim: **meta etiketleri**. Bu etiketler, sayfanız hakkında arama motorlarına, tarayıcılara ve hatta işletim sistemlerine önemli bilgiler sağlayan küçük bilgi parçacıklarıdır. 2006 yılındayız ve meta etiketlerinin web sitelerimizin keşfedilmesinde ve doğru şekilde görüntülenmesinde ne kadar kritik bir rol oynadığını hepimiz biliyoruz. Hadi gelin, bu gizli güçleri yakından tanıyalım!
Meta etiketleri, HTML belgesinin <head>
bölümünde yer alır ve sayfanın kendisi hakkında veriler (meta veri) sağlar. Kullanıcının doğrudan gördüğü bir içerik değildir, ancak sayfanın nasıl işleneceğini, indeksleneceğini ve sunulacağını etkiler.
Karakter Seti Tanımlama: Content-Type
Web sayfalarımızın farklı dillerdeki karakterleri doğru bir şekilde gösterebilmesi için karakter setini belirtmek hayati önem taşır. Yanlış karakter seti, garip sembollerin veya bozuk metinlerin görünmesine neden olabilir.
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-9">
Yukarıdaki örnekte ISO-8859-9
, Türkçe karakterleri de içeren bir karakter setini belirtir. Avrupa dilleri için genellikle ISO-8859-1
kullanılırken, son zamanlarda daha geniş bir karakter yelpazesi sunan UTF-8
de popülerleşmeye başladı:
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
Bu, tarayıcıya sayfanın bir HTML metni olduğunu ve hangi karakter kodlamasını kullanması gerektiğini söyler.
Arama Motorları İçin Anahtar Bilgiler: name
Özelliği
name
özelliği ile farklı türde meta bilgiler tanımlayabiliriz. Özellikle arama motorları (Google, Yahoo!, MSN Search gibi) için bu bilgiler çok değerlidir.
description
(Açıklama): Sayfanızın kısa bir özetini sağlar. Bu metin, arama motoru sonuçlarında başlığınızın altında görünebilir.
<meta name="description" content="WebKolog blogunda HTML, CSS ve JavaScript hakkında ücretsiz web dersleri bulabilirsiniz.">
keywords
(Anahtar Kelimeler): Sayfanızın içeriğini en iyi tanımlayan anahtar kelimeleri virgülle ayırarak belirtirsiniz. Arama motorları bu kelimeleri sayfanızın konusunu anlamak için kullanır.<meta name="keywords" content="HTML, CSS, JavaScript, Web Tasarım, Programlama, Dersler, Webkolog">
author
(Yazar): Sayfanın yazarını belirtmek için kullanılır.<meta name="author" content="Ali Mantar">
generator
: Sayfanın hangi yazılımla oluşturulduğunu belirtir (örneğin, bir web tasarım programı).<meta name="generator" content="Notepad++">
Tarayıcı Kontrolü ve Dinamik İşlevler: http-equiv
Özelliği
http-equiv
özelliği, tarayıcının HTTP başlıkları gibi davranmasını sağlar ve bazı özel davranışları tetikler.
refresh
(Yenileme): Sayfanın belirli bir süre sonra otomatik olarak yenilenmesini sağlar.
<meta http-equiv="refresh" content="30">
Bu kod, sayfanın her 30 saniyede bir otomatik olarak yenilenmesini sağlar.
Belirli bir URL'ye yönlendirme için de kullanılabilir:
<meta http-equiv="refresh" content="5;url=http://www.webkolog.net/yeni-sayfa.html">
Bu, 5 saniye sonra kullanıcıyı "yeni-sayfa.html" adresine yönlendirecektir.
set-cookie
(Çerez Ayarlama): Tarayıcıya bir çerez ayarlamasını söyleyebilir. Ancak bu yöntem genellikle sunucu tarafında yapılır ve güvenlik açısından burada kullanılması önerilmez.<meta http-equiv="set-cookie" content="kullanici=webkolog; expires=Sat, 25-Kas-2006 12:00:00 GMT;">
Bu örnek, "kullanici" adında bir çerez oluşturur ve 25 Kasım 2006'da sona ereceğini belirtir.
last-modified
(Son Değişiklik Tarihi): Sayfanın en son ne zaman değiştirildiğini belirtir. Arama motorları ve tarayıcılar için içerik güncelliğini anlamada yardımcı olabilir.<meta http-equiv="last-modified" content="Per, 18 Kas 2008 19:11:42 GMT">
Gördüğünüz gibi, meta etiketleri, web sayfalarınızın sadece içeriğini değil, aynı zamanda dış dünyayla nasıl iletişim kurduğunu da belirleyen küçük ama çok güçlü araçlardır. Sayfanızın arama motorlarında daha iyi bulunmasını sağlamaktan, kullanıcı deneyimini iyileştirmeye kadar birçok alanda size yardımcı olabilirler. Bu yüzden, her web sayfanızda doğru meta etiketlerini kullanmaya özen gösterin!
Webkolog'u takipte kalın!
Hepinize bol kodlu ve başarılı projeler dilerim!
0 yorum:
Yorum Gönder