İçindekiler
Aşağıdaki makale yayınlayacağımız HTML 5 Dersleri serisinin ilk yazısıdır. Web sitemizi takip ederek yayınlayacağımız diğer eğitimlerden haberdar olabilirsiniz.
HTML5, HTML dilinin en son sürümü olan HTML5 yeni web uygulamalarını geliştirmek için gereken yeni özellikler ve etiketler sunmaktadır. HTML5 için yeni hedefler ve stratejiler ortaya koyan ve farklı şekillerdeki web tarayıcıları için standardiziyasyonu amaçlayıp yeni nesil bir sürüm olarak karşımıza çıkıyor. HTML ile HTML5 dilinin işlevselliği, sunum ve programlama gücü artırmaktadır.
HTML5’e yeni eklenen elemanlar sayesinde artık fazla kod yazamadan sitenizin görsel tasarımını yapabilirsiniz, CSS3 ve JavaScript teknolojilerini daha etkili şekilde kullanabilirsiniz. Tasarımcıların web sayfalarında interaktif web uygulamaları geliştirebilmelerini ve zengin medya içerikleri kullanabilmesini sağlayan yeni elemanlar, teknolojiler ve özellikler barındırır.
HTML5 dilini özetliyecek olursak:
- Daha çok yapısal eleman, form elemanları ve yeni özellikler barındırır.
- Sadeleştirilmiş, düzeltilmiş XHTML ve HTML4 dillerinin son sürümü.
- Gelişmiş bir multimedia desteği sunar.
- İçerisinde son teknolojileri barındırır ya da önceden olan teknolojilerin kullanmamızı sağlar.
- CSS3 ve JavaScript teknolojilerini daha etkili bir biçimde kullanmamızı sağlmaktadır.
HTML 5 Dilinin Etiketleri
Etiket | Açıklama |
Embedded | Dış kaynaklı, başka bir etiketleme dili ile yada prgoramatik olarak tanımlanan içeriklerdir. |
Flow | Metin, başka eleman ya da gömülü şekilde tanımlanan içerik. |
Heading | Bir bölümün başlığını tanımlayan içeriklerdir. |
Sectioning | aside, article, section, nav elemanlarının içerik türü. |
Metadata | base, command, link, meta, nocsript, script, style, title elemanlarının içerik türüdür. Sayfaların görselğini ve davranışlarını değiştirebilen içeriklerdir. |
Phrasing | Metin ya da satır içi elemanların oluşturdukları içeriklerdir. |
Interactive | Kullanıcıyla etkileşim için tanımlanmış içerik. |
HTML 5 Dersleri – Örnek Sayfa
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> Sayfamızın başlığıdır </title> <style type="text/css"> div { float:right; width:270px; height:275px; margin:8px; </style> </head> <body> <a href="www.sosyaldurak.com">Sayfa Linki </a> <p> Paragraf veya açıklama </p> <div> Div elemanımız</div> </body>
Standart özelikler
- class
- id
- style
- title
- accesskey
- lang
- dir
- tabindex
- contenteditable (HTML5)
- contextmenu (HTML5)
- draggable (HTML5)
- hidden (HTML5)
- spellcheck (HTML5)
- dropzone (HTML5)
Tarayıcı desteği
- Internet Explorer – (Javascript Engine : Chakra)
- Firefox (Gecko) – (Javascript Engine : JagerMonkey)
- Chrome – (Javascript Engine : V8)
- Opera – (Javascript Engine : Carakan)
- Safari – (Javascript Engine : Nitro)