Html Sayfa Yapısı
<html>
<head>
sayfa ile ilgili başlık, tanımlayıcı bilgiler ve diğer dillere ait fonksiyonlar vb..
<title>sayfamızın başlığı buraya yazılır.</title>
<meta name="description" content="Sitemizin tanımı-açıklaması burada yapılır" />
<meta name="keywords" content="Sitemizde geçen Önemli-anahtar kelimeler burada belirtilir" />
</head>
<body>
Sayfada gÖrünecek herşey, yazılar, resimler vb. bu kısımda yer alır.
</body>
</html>
<Html> etiketi:
Bir html sayfası <html> etiketi ile başlayıp, </html> etiketi ile sona erer. Bir html belgesi başlıca iki kısımdan oluşur. Bunlar body ve head kısımlarıdır.
<head> etiketi:
Bu kısımda yazılan kodlar ile yapılan işlemler, web sayfasında direk olarak görünmezler. Head kısmında sayfanın başlığı, hangi konu ile ilgili olduğu gibi bilgiler verilebilir ki bu tür bilgiler özellikle arama motorlarının sayfamızı indekslemesi için hayati önem taşımaktadır.
Head kısmı hiç olmasa da web sayfamız çalışacaktır. Ancak bu bölümde sayfamız ile ilgili ne kadar açıklayıcı ve doğru bilgi verirsek, bizim için o kadar iyi olacaktır.
Sayfamız hakkında arama motorlarına bilgi sunmak için title ve meta etiketleri kullanılır.
Title etiketi sayfanın başlığını belirtir. Bu etiket arasındaki ifade tarayıcının pencere başlığında da görüntülenecektir.
<title>İstanbul'un Alışveriş Merkezi</title>
Meta Etiketleri
Meta etiketleri sayfa hakkında özellikle arama motorlarına bilgi sunmak ve fikir vermek için kullanılırlar.
Meta etiketleri sayfanın head kısmına yazılırlar, sırası ve yazıldığı yer önemli değildir.
Meta etiketi içinde kullanılan parametreye göre verilen bilginin anlamı değişir.
Örneğin keywords parametresi sayfa ile ilgili anahtar kelimeleri belirtmek için kullanılır. Bu kelimeler ile yapılan aramalarda web sayfamızın da bulunma ihtimalini artırır. Description parametresi ise sayfa içeriği hakkında özet bilgi vermek için kullanılır.
Meta etiketinin başka parametreleri de olmakla beraber, en çok kullanılan ve en önemlileri keywords ile description parametreleridir.
Örnek: Silivri ilçesindeki oteller ile ilgili bir web sayfasında şu meta etiketleri kullanılabilir.
<meta name="keywords" content="silivri, otel, silivri otelleri, silivride nerede kalınır"/> burada sayfanın silivri ve otel kelimeleri kullanılarak yapılan aramalarda listelenmesi amaçlanmıştır.
<meta name="description" content="Silivri'de nerede kalınır, Silivrideki oteller, Silivride size en uygun oteli bulun"/> burada ise sayfanın kısaca tanımı yapılmıştır.
Sayfa tanımı ve anahtar kelimelerinin ne çok fazla uzun, ne de çok kısa olması tercih edilir. Çok uzun olursa Google dikkate almayacaktır. Kısa olduğunda ise sayfayı yeterince tanıtmayabilir.
Örnek: Silivri ilçesindeki restoranlar ile ilgili web sayfasında kullanılabilecek title ve meta etiketleri:
<title>Silivri'deki Restoranlar, Silivri'de Nerede Yenilir</title>
<meta name="description" content="Silivri, nerede yenilir, restoranlar, restaurant, lokanta, balık restoranı, balık lokantası" />
<meta name="keywords" content="Silivri, restoran, restaurant, lokanta, balık, balık lokantası, ızgara, kebap, pide, lahmacun, çiğ köfte, silivri sipariş ver, yemek siparişi, eve servis" />
<body> etiketi:
Web sayfamızda görünmesini istediğimiz herşey (yazılar, resimler, animasyonlar vb) html kodları ile bu kısımda belirtilir. Sayfanın yapısı burada oluşturulur, biçimlendirmeler burada yapılır.
Body etiketi ile kullanılabilecek parametreler başlıca bgcolor ve background parametreleridir.
bgcolor parametresi ile sayfanın arkaplan rengi ayarlanabilir:
background parametresi ile de sayfaya arka plan resmi yerleştirilebilir:
<body background="resimler/bg.jpg">
Etiketlerin Kısa Kapanışı
Html ile kodlama yaparken açılan her etiketin doğru yerde kapatılması gerekir. Genelde etiketler <etiketAdi> şeklinde açılırken, </etiketAdi> şeklinde de kapatılırlar.
Bununla birlikte bazı etiketler <etiketAdi/> şeklinde kısa yoldan kapatılabilirler. Örneğin meta etiketleri kısa kapanış ile yazılırlar.
Açılışı ve kapanışı arasına bir şey yazılmayan etiketler bu şekilde kapatılabilmektedirler.
Örnek: <br/> <hr/> <meta ....... /> gibi..
meta etiketleri ne işe yarar, meta etiketi kullanımı, html meta örnekleri, meta kullanımının önemi, meta etiketlerinin anlamları
KONU İLE İLGİLİ ÖRNEKLER
<html>
<head>
<title>Web Tasarım Dersleri</title>
<meta name="description" content="Web tasarım, dersler, html, head, body, etiket" />
<meta name="keywords" content="web tasarım, dersler, web tasarım dersleri, html dersleri" />
</head>
<body bgcolor="#ff2255">
Sayfama hoş geldiniz.
</body>
</html>
30574 kez okundu.