HTML5, web sayfası hazırlamak için kullanılan ve uzun zamandır varlığını sürdüren bir kodlama dilidir. HTML5 Türkçe açılımı, Hiper Metin İşaretleme Dili anlamına gelmektedir. Kullanıcı deneyimi son derece yüksek web sayları hazırlamak, bu işaretleme dili ile mümkün olabilmektedir. Bu konuda web masterlara büyük kolaylık sağlamaktadır. Bu işaretleme dili, herkes tarafından kısa sürede öğrenilebilir. Yeni nesil web sayfası hazırlanmasında HTML5 en fazla tercih edilen işaretleme dili olmaktadır. Bu nedenle de günümüzde hala web tasarımcıları tarafından bu dil kullanılmaya devam edilmektedir. Peki, HTML5 nedir? Özellikleri nelerdir? Yazımızda bu soruların cevapları ve daha birçok detay üzerinde duracağız.
HTML5 Tarihçesi
Tim Berners Lee’nin 1980 yılında, CERN’de görevi sırasında, kişilerin bilgi ve dökümanlarını bir şekilde paylaşabileceklerini düşünmekteydi. Bu nedenle de ENQUIRE isimli bir sistemi önererek ön plana çıkardı. Bu işaretleme dili, internet tabanlı olup, Berners Lee tarafından temelleri atılmıştır. “www” adı verilen “World Wide Web” de yine Berner Lee tarafından oluşturulmuştur. HTML5, günümüzde kullanılan ismidir. Sondaki 5 rakamı zaman içinde değişmiş ve son olarak HTML5 olarak kalmıştır.
HTML5, piyasa sürülen son sürümdür. Programlama dili olarak bilinse de esas işi işaretleme yapmaktır. Bu dili kullanarak herhangi bir uygulama ya da program yazmak mümkün değildir. Sadece belli programlar bu işaretleme diline destek verdiği takdirde ortaya bir uygulama ya da yazılım konulabilmektedir.
HTML sayesinde web sayfalarına görsel ekleme, video oynatma ve SEO uyumlu yazılar yüklemek mümkündür. HTML içinde bulunan H1- H6 tagleri ile iç SEO çalışması yapmak da mümkündür.
HTML5 Ne İşe Yarar?
HTMl5, tüm web sayfaları tarafından okunabilme özelliği taşıyan bir dil olarak bilinmektedir. Tüm web sitelerinin çalışma prensibi de bu işaretleme diline dayalıdır. Güncel olarak kullanılan birçok arama motoru, HTMl5 işaretleme dilini süzgeçten geçirerek web sayfaları hakkında bilgi sunmaktadır. Sayfalar, yazılar ve hatta görseller bile HTML5 sayesinde SEO’ya uyumlu hale getirilebilmektedir.
Kullanıcılar, web sayfası hazırlarken yaptıkları kodların içine yerleştirdikleri anahtar kelimeler ile web sayfasının okunurluğunu ve index hızını artırmaktadır. Dolayısıyla HTML5 işaretleme dili, dinamik web sayfaları oluşturmada büyük önem arz etmektedir.
HTML5 Nasıl Öğrenilir?
Dünya genelinde önemli bir yere sahip olup sıklıkla kullanılan HTML5, öğrenilmesi kolay bir işaretleme dilidir. Günümüzde birçok kurs, HTML5 eğitimi vermektedir. Ancak HTML5 öğrenmek isteyen kişiler son sürümüne hakim olmalı ve devamlı pratik yaparak kendilerini geliştirmelidirler.
Kursların yanı sıra, internet üzerinde HTML öğreten açıklamalı videolar da bulunmaktadır. Üniversitelerin bazı bölümlerinde de HTML5 okutulmaktadır. Böylece kişilerin iş hayatlarına katkı sağlaması hedeflenmektedir.
HTML5 Yapısı
HTML5 ile hazırlan web sayfalarında belli etiketler kullanılmaktadır. Bu etiketler insan vücudundan esinlenerek isimlendirilmiştir. Body etiketi web sayfasının orta kısmını, footer alt bölümü, header ise en üst bölümü ifade etmektedir.
HTML5 ile işaretleme yapılırken açılan her bir etiketin mutlaka bir kapanışı olmalıdır. Kapatılmamış olan etiketler, yazılan taglerin çalışmamasına neden olur. Etiketlerin hepsi “<” (küçüktür) işareti ile başlarken, “>” (büyüktür) işareti ile kapatılmaktadır. Etiket kapatmak için ise büyüktür işaretinin önüne “/” işareti eklenmelidir. HMTL5 işaretleme dili için şöyle bir örnek verebiliriz:
<head>
<title> veridyen </title>
</head>
<body>
<p>HTML Nedir?</p>
</body>
</html>
HTML5 ile web sayfası hazırlama sürecinde hangi bölüme ne yazılacağı oldukça önemlidir.
Head bölümü adı altındaki baş kısma;
- Stil kodları
- JavaScript
- CSS Kodları
- Tittle etiketi yazılabilir.
Web sayfasının footer bölümden ise web sitesi hakkında bilgiler yer almaktadır. Bunlar iletişim bilgileri, site haritası ya da buna benzer bilgiler olabilmektedir.
HTML5 ile Birlikte Gelen Yenilikler
HTML5, programlama dilinin en son sürümüdür. Bu sürümle birlikte programcıların kullanabileceği birçok yenilik de gelmiştir. Bu yenilikler şunlardır:
- Dil kodlama satırları kısaldı
- <video> etiketi
- <audio> etiketi
- <progress> etiketi
- <header> etiketi
- <footer> etiketi
- <nav> etiketi
- 0 Teknolojisine uyumlu formlar
- Daha kısa DOCTYPE
- <canvas> etiketi
HTML5 sadece temiz bir kodlama sağlamakla kalmıyor. İşinizi kolaylaştırmanın yanı sıra tarayıcıların sitenizi doğru biçimde görüntülemesine de yardımcı oluyor. İçerdiği güncel kod parçacıkları ile oldukça verimli bir içerik oluşturmanıza olanak sağlıyor.
Dil Kodlama Satırları Kısaldı
Kod fazlalığı yapmakta olan dil kodlama satırlarının farkına varan geliştiriciler bu su sürümde sorun çözüm bulmuştur. <meta charset=”UTF-8”/> kodu ile bu işlem artık daha kısa bir şekilde hallediliyor.
<video> Etiketi
HTML5 <video> kodu ile kullanıcılar web sitelerinde rahatça video oynatabilir, otomatik başlamasını veya tekrarlanmasını sağlayabilirler. Youtube şuanda HTML5 için bu testi kullanıcılara açmıştır. Bu linkten inceleyebilirsiniz: http://www.youtube.com/html5
<audio> Etiketi
<audio> kodu ile ses dosyalarını, HTML5 ile kodlanmış web sitelerinde kullanabilirsiniz.
<progress> Etiketi
<progress> kodu ile yapılan web sitesinde kullanıcılar sitedeki yükleme işlemleri sırasında yükleme aşamasını görebilirler.
<header> Etiketi
Önceki HTML sürümünde <div id=”header”> kodu ile belirtilen header kısmı artık <header> etiketi ile belirtilebilecek.
<footer> Etiketi
Önceki HTML sürümünde <div id=”footer”> kodu ile belirtilen footer kısmı artık <footer> etiketi ile belirtilebilecek.
<nav> Etiketi
Önceki HTML sürümünde <div id=”nav”> kodu ile belirtilen nav kısmı artık <nav> etiketi ile belirtilebilecek.
Web 2.0 Teknolojisine Uyumlu Formlar
Önceki HTML sürümünde form oluşturmak için çok fazla seçenek yoktu. HMTL5 ile birlikte web 2.0 teknolojisine uyumlu formlar oluşturmak mümkün. Oluşturulacak formlara tarih ve renk araçları kolaylıkla eklenebilir.
Daha Kısa DOCTYPE
HTML5 ile artık sadece <!doctype html> yeterli olmaktadır.
<canvas> Etiketi
<canvas> kodu, web sitesi ve uygulamalarında 2 boyutlu çizim alanı isteyenleri düşünerek yaratılmıştır. Bu kod, javascript ile kontrol edilmektedir.
HTML5 ile Kaldırılan Etiketler
Son sürüm ile birlikte kaldırılan etiketlerin çoğu kullanılmaya ihtiyaç duyulmayan ya da diğer kodların işini yaptığı için fazlalık oluşturan kodlardan oluşmaktadır. Kullanımdan kaldırılan kodlar şunlardır:
- acronym
- applet
- basefont
- big
- center
- dir
- font
- frame
- frameset
- noframes
- strike
- tt
- u
Gelişen internet teknolojisi ile gelen farklı ihtiyaç ve beklentiler kodların eklenmesini veya çıkarılmasını gerektirmiştir. Bu, kullanımda kolaylık sağlayacak geliştirmelerden biridir.
