Top

HTML 5 Dersleri – Bölüm 2 – Yeni elementler

HTML 5 Dersleri – Bölüm 2 – Yeni elementler

HTML 4.01 1999’da standart olduğundan beri internet epey değişime uğradı.

Günümüzde, bazı HTML 4.01 elementlerinin ya modası geçti ya hiç kullanılmadı ya da amacının dışına çıktı kullanımı. Bu elementler de yeni HTML 5’te yeniden yazıldı ya da kaldırıldı.

Günümüzün internet kullanımının üstesinden daha iyi bir şekilde gelme, HTML5’in yapı için yeni elementlerin,çizim, medya içeriği, ve daha iyi form işleme ile mümkün.


Yeni işaretleme elementleri

Daha iyi bir yapı için elementler:

Etiket Tanım
<article> Harici bir kaynağa ait içerik için kullanılır. Blog, forum içeriği gibi.
<aside> İçeriği çerçeveler ve içeriğin yer aldığı yerdedir.
<command> Bir buton, radyo butonu ve bir onay kutusu için.
<details> Bir belge veya belge parçası için ayrıntıları ifade eder.
<summary> Bir başlık, veya özet, element içindeki ayrıntılara dair
<figure> Bir bölümün yerleşik içeriğinin gruplanması, misal video
<figcaption> Figure bölümü(section) için başlık
<footer> Bir belge veya bölümün footer kısmı için, yazarın adını içerebilir, belgenin tarihini de, iletişim bilgilerini de, veya kullanım haklarına dair ibareler de…
<header> Bir belge veya bölümün için tanıtım kısmı için, navigasyon yani yönlendirme menüsünü de içerebilir.
<hgroup> Başlıkların bir bölümüdür,  <h1> den <h6> ya kadardır, en büyük olan bölümün başlığı olur, ve diğerleri de alt başlık olur.
<mark> Yazıları vurgulamak için
<meter> Ölçü birimi için, en düşük ve en  yüksek değerleri bildiğinizde kullanırsınız.
<nav> Navigasyon bölgesi için
<progress> Bir çalışmanın sürecine dair bilgi verir. Flash’taki loading meselesi…
<ruby> Ruby için(Cince karakterler ve noktalamalar da dahil)
<rt> Ruby notuna dair açıklama için
<rp> Ruby elementini desteklemeyen tarayıcıların ne göstereceğini belirtiriz.
<section> Belgedeki bir bölge. Bölümler, başlıklar, footers veya belgenin diğer bölümleri
<time> Zaman ya da tarih tanımlamak için ya da her ikisi…
<wbr> kelime sonu. Satır sonu nun alternatifi.

 


Yeni medya elementleri

HTML5 yeni medya standartları sunmakta:

etiket tanım
<audio> Multimedya içerik, sesler, müzik ve diğer akışlar için
<video> Video içerikleri içn, film gibi diğer medya akışları için
<source> medya elementleri için medya kaynağı, video ve audio elementi içinde tanımlanır.
<embed> Eklenti gibi gömülen medya için.

 


Canvas Elementi

Canvas elementi bir web sayfasında javascript ile beraber çizim yapmak için kullanılır.

Etiket Tanım
<canvas> Script ile grafikler oluşturmak için

 


Yeni form elementleri

HTML5 işlevi fazla olan ve daha fazla form elemanı sunmakta:

Etiket Tanım
<datalist> Giriş değerleri için ayar listeleri -input value-
<keygen> Kullanıcı girişleri için doğrulama
<output> Çıktıların değişik türleri için. Misal scriptlerce yazılan çıktılar

Yeni input type özelliğinin değerleri

Input type bile yeni özelliklere sahip ve daha iyi bir test için sunucuya göndermelisiniz:

Type Tanım
tel Telefon numarası girişi
search Arama bölgesi
url URL değeri
email bir veya daha fazla eposta adresi girişi
datetime tarih veya zaman değeri
date tarih değeri
month Ay değeri
week Hafta değeri
time Zamanın tipine dair değer
datetime-local Yerel zamana ait değer
number Sayısal değer
range Verilen aralık için sayısal değer
color Hexadecimal kod değeri için giriş

 


Yararlı olması dileğiyle ve bir sonraki derste görüşmek dileğiyle…

Siz neler düşünüyorsunuz? Yazımızı beğendiyseniz aşağıdaki butonlardan tavsiye edebilirsiniz, paylaşabilirsiniz veya yorumlarınızı sunabilirsiniz. Teşekkürler okuduğunuz için!

Bir önceki yazımız olan HTML 5 Dersleri - Bölüm 1 - Tanıtım başlıklı makalemizde article, audio ve Bölüm hakkında bilgiler verilmektedir. Daha fazla yazımızı görmek için HYTürkyılmaz Dijital pazarlama ve growth hacking blogu anasayfası'yı ziyaret edebilirsiniz. Yazımızı aşağıdaki paylaşım butonlarıyla paylaşarak sevginizi yayınız! Teşekkürler!

Hasan Yasin Türkyılmaz

Sosyolog, dijital stratejist. Dijital medya, reklam ve growth hacking eğitimleri ve hizmetleri sunarım. PC, konsol fark etmez. Oyun oynamayı severim.

Tüm yazıları - Websitesi

Beni takip edin!:
TwitterFacebookLinkedInPinterestGoogle PlusDiggFlickrStumbleUponYouTubeYelpRedditDelicious

  • Yazınız çok iyi ve yeterli derecede teknik. Html5 ile gelen yeni elementler ve kaldırılacak elementlerle ilgili farklı bir anlatıma da buradan ulaşabilirsiniz.

  • Leyla

    Gayet açıklayıcı bir anlatım olmuş. Teşekkürler

    • nefarkederki

      Ben teşekkür ederim. 🙂