HTML 5’e Geçiş; HTML5 Nedir?

Dincer Degre
DincerDegre
Published in
3 min readFeb 16, 2022

HTML5, HTML’in 5. sürümüdür. Bir önce ki versiyon olan HTML 4.01 , 1999’da gelmişti.

O tarihten bu yana Web’te pek çok şey değişti. HTML5 hala geliştirilmeye devam ediyor, buna rağmen gelişmiş tarayıcılar yeni HTML5 elemanlarını ve API’sini desteklemektedir.

HTML5 ile gelen esnek yapı kod hatalarını en aza indiriyor, hatta görmezden geliyor. XHTML’deki küçük — büyük harf duyarlılığı kalktı.

Bununla birlikte bunun gibi bir çok kod sorunu kısmen olsa da çözüldü. CSS ile oluşabilen uyum sorunları düzeltildi ve beraberinde getirdiği yeni etiketler ile içerik ve görsel açıdan daha kaliteli ve Arama motorlarına kolaylık sağlayan bir yapıya ulaştı.

Şu anda Flash’ın yapabildiği çoğu şeyi HTML5 ile Flash kullanmadan yapabiliriz.

HTML5 hala geliştirilme aşamasında olsa da bugün birçok web tasarımcısı artık bu yeni sürümü tercih etmekte.

Kısmen daha az kod yazma olanağı verse de HTML5 asıl gücünü PHP, ASP, ASP.net gibi web programlama dillerinden, JavaScript betik dilinden ve CSS’ten almaktadır.

HTML5 nasıl başladı?

HTML5, World Wide Web Consortium (W3C) ile Web Hypertext Application Technology Working Group (WHATWG) işbirliğidir.

WHATWG, web formları ve uygulamalar üzerinde çalışan bir topluluktur.W3C ise XHTML 2.0 üzerinde çalışan bir topluluktur.

2006’da HTML’in yeni bir sürümünü yaratmak için işbirliği yapmayı kararlaştırdılar. Bu yüzden HTML5 için belli kurallar belirlediler;

  • Yeni özellikler HTML , CSS , DOM ve JavaScript tabanlı olmalı.
  • Dış eklentiler için ihtiyaçlar azaltılmalı (Flash)
  • Script yazmak yerine daha fazla HTML kullanılmalı
  • HTML5 Aygıtlardan bağımsız olmalı
  • Geliştirme süreci herkes tarafından görülebilmeli
  • Hatalar daha iyi yakalanabilmeli

HTML5 <!DOCTYPE>

HTML5 ‘te sadece bir bildirim vardır ve kullanımı çok basittir. Bunu yukarıdaki örnekte de inceleyebilirsiniz.

<!DOCTYPE html>

Yeni Yapı Elemanları

  • <article> : Makale tarzı yazıları kapsar.
  • <aside> : Ana içerikten ayrı yazılan kısımdır.
  • <bdi> : Metin ya da kelimeyi izole etmek için kullanılır.
  • <command> : Kullanıcının çağırabileceği bir komut düğmesi tanımlar.
  • <details> : Detay bilgisi içerir.
  • <summary> : Yazının başlığını belirler.
  • <figure> : Çeşitli medya içeriği gruplarını belirler.
  • <figcaption> : <figure> elementinin başlığını belirler.
  • <footer> : Sitelerin en alt kısmını içine alır.
  • <header> : Sitenin en üst kısmını içine alır.
  • <hgroup> : Başlık grubunu belirtir. h1, h2 gibi başlık elementleri burada tanımlanabilir.
  • <mark> : Yazı içerisinde özellikle üstünde durulan kelimeleri belirler.
  • <meter> : Bilinen bir aralık içinde sayısal bir ölçüm tanımlar.
  • <nav> : Menüler içindir.
  • <progress> : İşlem süreci göstergesi ekler.
  • <ruby> : Bir ruby açıklama tanımlar.
  • <rt> : Karakterler için bir açıklama / telaffuz tanımlar.
  • <rp> : Ruby açıklamalarını desteklemeyen tarayıcılarda göstermek için kullanılır.
  • <section> : Sitelerin ana içerik kısmını içine alır.
  • <time> : Tarih, saat verilerini kapsar.
  • <wbr> : Olası bir satır sonu tanımlar.

Yeni Medya Elemanları

  • <audio> : Sayfaya Ses oynatıcı modül ekler.
  • <video> : Sayfaya Video oynatıcı modül ekler.
  • <source> : <video> ve <audio> için çoklu ortam kaynaklarını tanımlar.
  • <embed> : Dışarıdan eklenen componentler için kullanılır.
  • <track> : <video> ve <audio> için metin parçaları tanımlar.

Yeni <canvas> Elemanı

  • <canvas> : Betik üzerinden anında grafik çizmek için kullanılır. (JavaScript)

Yeni Form Elemanları

  • <datalist> : Düzenlenebilir elementlere otomatik tamamlama özelliği verilmesini sağlar.
  • <keygen> : Bir çift anahtar oluşturur. (Formlar için)
  • <output> : Bir hesaplamanın sonucu belirtir.

HTML5 ile Kaldırılan Elemanlar

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>

--

--