Burak Yalçın'ın Blogu http://blog.burakyalcin.com Web tasarımı ve programlaması hakkında yazılar Tue, 08 Sep 2009 01:41:17 +0000 http://wordpress.org/?v=2.8.4 en hourly 1 Temel HTML ve META Etiketleri http://blog.burakyalcin.com/html-etiketleri.html http://blog.burakyalcin.com/html-etiketleri.html#comments Tue, 08 Sep 2009 00:27:51 +0000 Burak http://blog.burakyalcin.com/?p=9 Basit bir html sayfası aşağıdaki gibi olmaktadır.

<html>
<head>
<title>Sayfa Başlığı</title>
</head>
<body>
<h1>Ana Başlık</h1>
<h2>Alt Başlık</h2>
<p>paragraf</p>
</body>
</html>

Genel olarak kullanılan HTML etiketlerini sıralayacak olursak:

<h1>Ana Başlık</h1>
<h2>Alt Başlık</h2>
<p>Paragraf</p>
<b>Kalın Yazı</b>
<i>İtalik Yazı</i>

Aşağıdaki kod sayesinde ise HTML sayfalarınıza görsel ekleyebilirsiniz:

<img src=”resim.jpg” width=”200″ height=”150″>

Bu kodla ise istediğiniz bir görsele yada yazıya link verebilirsiniz:

<a href=”deneme.html”>Deneme Sayfası</a>.

Aşağıdaki örnekte ise “logo.gif” görseline link verilmiştir.Tıklandığı zaman “deneme.html”
adresine gidecek.

<a href=”deneme.html”><img src=”logo.gif”></a>

Aşağıdaki kod ise unordered list için yapılmış bir örnektir.

<ul>
<li>ilk eleman</li>

<li>İkinci eleman</li>

<li>Üçüncü eleman</li>
</ul>

<ul> etiketi “unordered list” anlamına gelmektedir. Türkçe’ye çevirdiğimiz zaman sırasız liste anlamına geliyor.İçindeki <li> etiketleri ise liste anlamına gelmektedir.<li> etiketiyle yeni elemanlar ekledikçe her bir eleman liste düzeninde alt alta gözükecektir.Her liste elemanının başında ise nokta işareti olacaktır.Fakat <ul> etiketi yerine <ol> etiketi kullansaydık nokta yerine numaralar çıkacaktı.Yani sıralı liste oluşturmuş olacaktık ve her liste numaralarla sıralanacaktı.
Yukarıdaki etiketler <body> </body> etiketleri arasında kullanılan etiketlere birer örnekti.

Bir de <head> </head> dediğimiz bölüm var.Yani kafa bölümü. Bu bölüm HTML sayfalarımızda gözükmez. Burada sayfamızla ilgili bazı bilgileri veririz.Bu bölümde SEO için önemli bazı etiketler ve sayfanızın dil kodlaması yer almaktadır.

<title>Burak Yalçın’ın Blogu</title>

Bu etiket ile sayfa başlığını belirtiriz.Pencerenin üst kısmında gözükür.Arama motorları sayfanızı listelediği zaman bu kısım gözükecektir. Kısa ve öz olmalıdır. Sayfanızla alakasız bir başlık olmamalı.

<META NAME=”Description” CONTENT=”Web tasarımı ve programlaması hakkında yazılar”>

Bu bölümde arama motorları tarafından sayfalandığınız zaman kullanıcıya gözükecek bölümdür. Çok uzun olmamalı ve sitenizin içeriğini belirtmelidir.

<meta name=”keywords” content=”burak, yalçın, web tasarımı, html, css”>

Buradaki etiket ile sitenizle alakası olan anahtar kelimeler eklenir. Çok fazla olması zararlıdır.
Aynı zamanda sitenizle alakası olmayan kelimeler eklemeniz yine sizin zararınıza olacaktır.

<META http-equiv=”Content-Type” CONTENT=”text/html; charset=iso-8859-1″>

Sayfanızın dil kodlamasıdır.

<meta http-equiv=”content-language” content=”tr”>

Sitenizin varsayılan dilini belirtir.

<META NAME=”robots” CONTENT=”noindex,nofollow”>

Bu kısım sayfanızın arama motorları tarafından indexlenip indexlenmeyeceğini belirtir.
noindex yazdığınız zaman sayfanızın dizine eklenmesini önlemiş olursunuz.
nofollow ise, GoogleBot’un bu sayfadaki linkleri izlemesini engellemiş olur.
nosnippet etiketi ise, arama sonuçlarında önbilginin gösterilmesini engeller.

<META name=”Author” content=”Burak Yalçın, eposta@burakyalcin.com”>

Burada ise site yapımcısının iletişim bilgileri bulunur.

<meta http-equiv=”refresh” content=”60″>

Sayfanızın kaç saniyede bir yenileneceğini belirtirsiniz.content kısmına saniye cinsinden değer
girilir.Buradaki örnekte, sayfa 60 saniyede bir refresh olacaktır.

<META name=”Abstract” content=”Site özeti”>

Tüm site hakkında bilgi veren bölümdür.Sitenizin konusu hakkında özet yazabilirsiniz.

<META name=”Copyright” content=”telif hakkı yazısı”>

Sitenizin telif hakları ile ilgili bilgi veren bölümdür.

<meta name=”revisit-after” content=”7 days”>
Site içeriğinin kaç günde bir güncellendiğini arama motorlarına belirtir.Böylece arama motorları
siteniz güncellendiğinde sitenize uğrar.Aslında burada arama motorlarının sitenize kaç günde bir
uğrayacağını belirtmiş oluyoruz. Ama bazı zamanlarda burada belirttiğiniz günden erken veya daha
geç sitenize uğrayabilir.

Not: Burada belirtilen etiketler HTML standartlarına göre yazılmıştır. XHTML standartlarına göre
META etiketleri “>” şeklinde değil “/>” şeklinde kapatılmalıdır.Örnek verecek olursak:

<META name=”Copyright” content=”telif hakkı yazısı” />

RSS Feed Twitter Facebook Add to Technorati Favorites Digg It! Stumble It! Add to Del.cio.us Newsvine Reddit Gogole Bookmark Linkedin YahooMyWeb Mixx

]]> http://blog.burakyalcin.com/html-etiketleri.html/feed 0