Turkcell | Geleceği Yazanlar

101: HTML Başlangıç seviyesi derslerde Web Programlama uygulama geliştirme ortamını detaylı olarak inceliyoruz.

Tüm Eğitimleri Aldın mı? Kendini sınamanın tam zamanı

Haydi Sınava Gir

Bir HTML Belgesinin Yapısı

Kategori : Mobil | Lisans : Creative Commons (by-nc-sa) | En son 12.09.2019 tarihinde güncellendi
Eğitmen : Geleceği Yazanlar Ekibi
Etiketler : web-programlama

Bir HTML belgesi etiket dediğimiz bileşenlerden oluşur. HTML yapısındaki temel bileşen bir elemandır. Elemanları anlatmak için her gün gördüğünüz başlıklar, paragraflar, listeler birer elemandır. Etiketler kullanılarak bu elemanlar birbirinden ayrılarak mantıklı hale gelirler. HTML etiketleri yapısı ise çok basittir. < (küçüktür işareti) etiket ve > (büyüktür işareti) işaretiyle belirtilir. Örneğin, paragraf belirtmek için <p> etiketini kullanırız. Paragraf etiketini kapatmak istediğimizdeyse < işareti sonrasında / işareti koymak yeterlidir.

Örneklemek gerekirse,

<p> paragraf paragraf paragraf paragraf paragraf paragraf paragraf paragraf </p>

HTML dili büyük küçük ayrımı yapan bir dil değildir. Bir etiketi girerken büyük, küçük ya da bir kısmı büyük bir kısmı küçük girebilirsiniz (XHTML için durum farklıdır. Tüm etiketlerin küçük harflerle yazılması gerekir) ve bu herhangi bir değişime sebep olmaz. Ancak; HTML sayfası içindeki tüm kodların küçük harfle yazılması, geliştiriciler arasında kabul görmüş bir kuraldır. Dolayısıyla etiketleri küçük harfle yazmanız tavsiye edilir.

Bir HTML belgesi başlıca iki kısımdan oluşur:

  1. Baş (HEAD) metni
  2. Gövde (BODY) metni

Baş metni, sayfaya ait başlıkla ilişkili ifadeleri içerir.

Gövde metni ise, HTML koduna ait asıl metni içerir. Bu metin,

  • Paragraflar,
  • Listeler ve
  • Diğer elemanlardan oluşur.

Genel olarak buraya kadar anlatılanları bir çatı altında toplayacak olursak:

  • Tüm HTML belgeleri tip deklerasyonu ile başlamak zorundadır: <! DOCTYPE html>
  • HTML belgeleri, <html> etiketi ile başlar ve </html> etiketi ile biter.
  • HTML belgesi içindeki görüntülenen kısım ise <body> ve </body> etiketleri arasında yer alır.

Aşağıda basit bir HTML dosyası örneğini bulabilirsiniz.

<!DOCTYPE html>
<html>
  <head>
    <title>Basit bir HTML metni başlığı</title>
    <meta charset="utf-8">
  </head>
  <body>
    <h1>HTML, Web'in dilidir.</h1>
    <P>Bu metnin ilk paragrafıdır.</p>
    <p>Bu da ikinci paragraftır.</p>
  </body>
</html>

Bir önceki dersimizde temel bir HTML dosyasını görmüştük. Şimdiyse daha kapsamlı bir kod bloğu karşımızda. Şimdilik ilk olarak DOCTYPE'ın ne olduğunu inceleyelim:

 

<!DOCTYPE> deklerasyonu

DOCTYPE deklerasyonu, web tarayıcıların bir web sitesini doğru bir şekilde göstermesini sağlamaktadır. Web üzerinde farklı belge tipleri bulunmaktadır:

HTML5
<!DOCTYPE html>

HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

XHTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">