html

HTML, web siteleri oluşturmak için kullanılan bir metin işaretleme dilidir. ( İngilizce olarak Hypertext Markup Language )

Programlama dili değildir. Web sitelerinde kullanılan yazı, resim, video vb. materyalleri bir standart dahilinde eklemek ve biçimlendirmek için kullanılır.

HTML5 ise html işaretleme dilinin en son çıkan sürümüdür.

Programlama dili değildir dedik, peki ne demek bu? Programlama dillerinde değişken tanımlar, hesap yapar, karar verirsiniz. html de ise böyle bir şey yok. html sadece tarayıcıya "bu yazı başlık, bu yazı paragraf, burada bir resim var" der. Yani içeriği işaretler, adı da buradan geliyor.

html dili genel yapısı

html işaretleme dilini kullanarak bir web sayfası oluşturmak için altta bulunan kodlar bir sayfada yazıldıktan sonra uzantısı html yada htm (web_sayfasi.html, web_sayfasi.htm) olarak kaydedilmelidir. bu yazılan web_sayfasi.html adlı dosya bir internet tarayıcısında (chrome, safari, mozilla firefox, vb..) açıldığında sonuç karşımıza gelecektir.

html belgesinde kodlar arasına açıklama eklemek isterseniz

<!-- burası çoklu yada tekli açıklama satırı.-->

işaretleri arasına açıklamanızı eklemeniz gerekmektedir. bu yazdığınız açıklama satırları sitenizin kaynak kısmında görünecek fakat tarayıcılar tarafından dikkate alınmadığından sitede görünmeyecektir.

<html>
<!--
sitenin başlık ve tanımlama bilgileri
<head> etiketleri arasında tanımlanır
-->
<head>
<!--
sitenin başlık bilgisi
<title> etiketleri arasında tanımlanır.
-->
<title></title>
</head>
<!--
sitenin içeriğine ait olan hemen hemen herşey
<body> etiketleri arasında tanımlanır.
-->
<body>

</body>
</html>

html5 ile neler değişti?

html5 öncesinde sayfanın en başına yazdığımız belge türü bildirimi uzun ve ezberlenmesi zor bir satırdı. html5 ile bu satır sadece aşağıdaki hale geldi.

<!DOCTYPE html>

Bunun yanında sayfanın bölümlerini anlamlı bir şekilde ayırmamızı sağlayan yeni etiketler geldi. Eskiden sayfanın üst kısmını da menüsünü de alt kısmını da hep div ile yapıyorduk. Artık her bölümün kendi etiketi var.

  • <header> : sayfanın üst bölümü
  • <nav> : menü bölümü
  • <section> : sayfadaki bir bölüm
  • <article> : yazı, makale gibi tek başına anlam taşıyan içerik
  • <aside> : yan menü (sidebar)
  • <footer> : sayfanın alt bölümü

Bu etiketler sayfanın görünüşünü değiştirmez ama hem kodu okuyan yazılımcıya hem de arama motorlarına sayfanın hangi kısmının ne olduğunu anlatır.

Bir diğer önemli yenilik de video ve ses. html5 öncesinde sayfada video göstermek için flash gibi eklentilere ihtiyaç vardı. Artık video ve audio etiketleri ile doğrudan html ile ekleyebiliyoruz.

<video src="video.mp4" controls></video>
<audio src="ses.mp3" controls></audio>

html sayfasının temel yapısını ve etiketlerin anlamlarını Html Dili ve Yapısı yazımda daha detaylı anlattım. Etiketleri tek tek tanımak için de Html Etiketlerini Görelim serisine göz atabilirsiniz.