Merhaba, bu yazımızda
HTML'i tanıtacağım ve birkaç örnek göstericem.
Zengin Metin İşaret Dili (İngilizce Hyper Text Markup Language, ks. HTML) günümüzde İnternet üzerinde veri paylaşımı için kullanılan en yaygın metin tabanlı dildir. Dilin son sürümü HTML5'tir.
HTML, bir programlama dili olarak tanımlanamaz. Zira HTML kodlarıyla kendi başına çalışan bir program yazılamaz. Ancak bu dili yorumlayabilen programlar aracılığıyla çalışabilen programlar yazılabilir. Programlama dili denilememesinin nedeni tam olarak budur. Temel gereği yazı, görüntü, video gibi değişik verileri ve bunları içeren sayfaları birbirine basitçe bağlamak, buna ek olarak söz konusu sayfaların web tarayıcısı yazılımları tarafından düzgün olarak görüntülenmesi için gerekli kuralları belirlemektir.
HTML, W3C tarafından standartlaştırılmaktadır. Html, "etiket" ismi verilen çeşitli başlıklardan oluşur. Aşağıdaki örnek bu etiketler kullanılarak yazılmıştır.
Web kavramı, CERN'de bir bilgisayar programcısı olan Tim Berners-Lee'nin HTML adlı bilgisayar metin dilini bulup geliştirmesiyle başlamıştır.
Özgür ansiklopedi, Vikipedi'den aldığımız HTML tanımı ve bilgileri sonrası birkaç örnek vermeye başlıyalım.
<html>
<head>
<title>Başlık</title>
</head>
<body>
<p><a href="http://ecanblog.blogspot.com">HTML Kodlama Ders 1</a></p>
</body>
</html>
Dikkat ettiyseniz açılan her kod kapattık. Aynı programlama dillerinde yapıldığı gibi açık kod bırakmıyoruz. Not defterini açın ve yukarıdaki kodları yazın. Sonra kaydedin ve kapatın. Yeni Metin Belgesi.txt olarak kaydedilecektir. Uzantısını değiştirin, txt yi silin ve html yapın. Artık açtığınızda not defteri ile değil de internet tarayıcınız ile açılacaktır ve ekranda şu görülür: "HTML Kodlama Ders 1" tıkladığınızda sitenin anasayfasına yönlendirecektir.
Bütün HTML kodları <html>…</html> arasına yazılır.
<html>
<head>
<title>Sayfa Başlığı</title>
</head>
<body>
(Diğer tüm elementler ve düz metin)
</body>
</html>
W3C Standardında bir HTML belgesinde bu kodlar olmazsa olmazdır.
Bu bölümde H1-H2-H3-H4-H5-H6 olarak tabir ettiğimiz başlık yapısı (heading), paragraf açma ve satır atlamayı öğreneceğiz.
<h1>H1 Başlık</h1>
<h2>H2 Başlık</h2>
<h3>H3 Başlık</h3>
<h4>H4 Başlık</h4>
<h5>H5 Başlık</h5>
<h6>H6 Başlık</h6>
H1 Başlık
H2 Başlık
H3 Başlık
H4 Başlık
H5 Başlık
H6 Başlık
HTML Yazı Tipleri
| <b>...</b> | : | Geçen ders verdiğimiz ilk örneğimizdi. Yazıların kalın görünmesini sağlar. (Örn. Merhaba Dünya) |
| <i>...</i> | : | İtalik görüntü sağlar. (Örn. Merhaba Dünya) |
| <u>...</u> | : | Yazıyı altı çizili gösterir. (Örn. Merhaba Dünya) |
| <del>..</del> | : | Yazıyı üstü çizili gösterir. (Örn. Merhaba Dünya) |
| <sub>...</sub> | : | Yazıyı satırın yarım karakter altında gösterir. Matematiksel vb. formülleri gösterirken kullanabilirsiniz. (Örn. Merhaba Dünya) |
| <sup>...<sup> | : | Yazıyı satırın yarım karakter üstünde gösterir. Mesela bir sayının üslü halini web sayfasında gösterirken kullanabilirsiniz. (Örn. Merhaba Dünya) |
| <marquee>...</marquee> | : | Kayan yazı oluşturur. |
Yazı Tipi, Yazı Boyutu ve Renk Seçimi
<font face="Tahoma" size="1" color="red">Bu 1. örnek yazı..</font><br />
<font face="Verdana" size="2" color="blue">Bu 2. örnek yazı..</font><br />
<font face="Times New Roman" size="3" color="black">Bu 3. örnek yazı..</font><br />
Bu 1. örnek yazı..
Bu 2. örnek yazı..
Bu 3. örnek yazı..
Biçimlendirme
| Etiket | Anlamı |
| <b> | Kalın yazmak. |
| <i> | Sağa yatık (italik) yazmak. |
| <u> | Altı çizili yazmak. |
| <del> | Üstü çizili yazmak. |
| <sup> | Üs yazmak. |
| <sub> | Alt hizada yazı yazmak. |
| <big> | Büyük yazı. |
| <small> | Küçük yazı. |
<b>Kalın bir yazı</b><br />
<i>Sağa yatık bir yazı</i><br />
<u>Altı çizili yazı.</u><br />
<del>Üstü çizili yazı.</del><br /><br />
Normal Metin <sub>Yazı hizasının altında küçük yazı.</sub><br /><br />
Normal Metin <sup>Yazı hizasının üstünde küçük yazı.</sup><br /><br />
<big>Büyük bir yazı</big><br />
<small>Küçük bir yazı</small><br /><br />
<em>Vurgulu bir yazı</em><br />
<strong>Vurgulu bir yazı</strong><br />
<ins>Vurgulu bir yazı.</ins><br />
<s>Vurgulu bir yazı.</s><br />
<strike>Vurgulu bir yazı.</strike><br />
Şimdilik bu kadar, gelecek yazımızda özel karakterler,bağlantılar,resim ekleme ve liste oluşturma ile ilgili bilgiler paylaşıcam.
İlgili Aramalar:HTML kodlama,HTML kodlama ders 1,HTML kodları
