HTML5 i kim geliştirmiştir etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
HTML5 i kim geliştirmiştir etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

26 Mayıs 2013 Pazar

HTML5 Nedir?

HTML5 İle Web Tasarıma Girelim


Nedir HTML5 ?


HTML5 Logo Image
HTML5, temel olarak HTML dilinin yeni standardıdır.

Kim İcat Etti  HTML5'i?

Bu standart World Wide Web Consortium(W3C) ve Web Hypertext Application Technology Working Group (WHATWG)'in ortak çalışmasının sonucu olarak ortaya çıkmıştır.

HTML5'in Getirdiği Yenilikler Nelerdir?

Bu standart HTML CSS DOM ve Javascript teknolojilerinin etkin kullanılmasını temel alarak Web tasarıma hız, etkinlik ve sağlamık getirmiştir.

- HTML5 ile tasarlanan bir sitede etkileşimli grafik animasyon oluşturmak için Java applet ve flash gibi pluginlerin kullanılma zorunluluğu ortadan kalkmıştır.

- Hata ayıklama ve düzeltme sürece daha hızlı ve kolaydır.

- Evelce JavaSript ile yapılabilen bazı işler artık HTML5 tagları ile script kullanmadan browser'a yapıtırılabilir.

- HTML5 ile tasarlanan siteler PC, iPad, TabletPC gibi farklı ortamlarda da çalışabildiğinden taasarım ve üretim süreci kolaylaşmış ve hızlanmıştır.

HTML5 Site Nasıl Tanımlanır?


Bir siteyi HTML5 olarak tanımlamak için HTML kodlarının en başına sadece <!DOCTYPE html> yazmak yeterlidir. Bu tag tarayıcıya sitenin bir HTML5 sitesi olduğunu ve kodların  bu standarda göre yorumlanacağını söyler.

Temel HTML5 sayfa kodlaması ise şu şekildedir:

<!DOCTYPE html>
<html>
        <head>
                  <title>Sayfa Başlığı</title>
        </head>

<body>

Sayfa İçeriği

</body>

</html>

HTML5 ile web tsarım daha esnek ve zevkli bir hale geldi. Özellikle Javascriptle 2D, 3D animasyonlar üretmek de dahil pek çok yeteneği olan <canvas> elemanı Front-End Developer'ların gözdesi olacak.

24 Mayıs 2013 Cuma

HTML5 Destekli Tagların Listesi


HTML5 Teknolojisi'nin Desteklediği Tüm Tag'lar

HTML5 Web dünyasının yeni standardı... HTML5 teknolojisi ile artık daha canlı ve daha güzel. HTML5 World Wide Web Consortium (W3C) ve Web Hypertext Application Technology Working Group (WHATWG)'unun ortak çalışmasının bir ürünüdür. Bu standat ile birlite web sayfalarına canlılık getiren yeni taglar tanımlanmış ve artık web tasarımda pek kullanılmayan bazı taglar yürürlülükten kaldırılmıştır.

HTML5'in desteklemediği taglar:

HTML5 standardı, <acronym>, <applet>, <basefont>, <big>, <center>, <dir>, <font>, <frame>, <frameset>, <noframes>, <strike> ve <tt> taglarını artık desteklememektedir.

HTML5 ile gelen yeni taglar:
<article>, <aside>, <basefont>, <audio>, <bdi>, <canvas>, <command>, <datalist>, <details>, <dialog>, <embed>, <figure>, <figcaption>, <footer>, <header>. <hgroup>, <keygen>, <mark>, <meter>, <nav>, <output>, <progress>, <rp>, <rt>, <ruby>, <section>, <source>, <summary>, <time>, <track>, <video> ve <wbr> taglarıdır.


HTML5'in desteklediği tagları ve ne işe yaradıklarını aşağıda sıralıyorum umarım hepimiz için aydınlatıcı bir HTML5 referansı olur.



<!--...--> : Yorum satırı tanımlar

<!DOCTYPE > : Doküman tipini tanımlar

<a> : Bağlantı oluşturur

<abbr> : Kısaltma yapmak için kullanılır (HTML, XML, WYSIWYG gibi)

<address > : Belgeye iletişim ya da site sahibi ile ilgili blgileri koymak için kullanılır

<area> : image-map içinde bir alan tanımlar

<article> : Makale görüntülemek için bir alan tanımlar

<aside> : Sayfa içeriği içinde bir bölüm tanımlar

<audio> : Ses içeriği oluşturur

<b> : Yazıyı kalın yapar

<base> : Sayfa içinde tanımlanan URL'ler için bir temel adres tanımlar

<bdi> : çift yönlü yazı alanı tanımlar

<bdo> : Yazı yönünü ters çevirir

<blockquote > : Alıntı yaparken kullanılır

<body> : Tüm Döküman içeriğini kapsayan temel tag

<br> : Bir satır boşluk bırakır

<button> : Bir düğme oluşturur

<canvas> : Script ile kontrol edilebilen bi grafik çizim alanı tanımlar

<caption> : Table elemanı için başlık tanımlar

<cite> : İtalik başlık tanımlar

<code> : Metne bilgisayar kodu formatı verir

<col> : <col> elemanı ile birllikte tablo sütunlarını özelleştirmek için kullanılır

<colgroup> : Tablo sütunlarını formatlar

<command> : Bir buton oluşturur(Browserlar desteklemiyor şimdilik)

<datalist> : Kendinden filtreli açılır liste elemanı


<dd> : Definition list için bir eleman tanımlar.

<del> : Metin üzerine çizgi çizer.

<details> : Metin üzerine tıklandığında gizlenmiş olan diğer bir metinin görünmesini sağlar.

<dfn> : Metni İtalik yapar

<dialog> : Kutucuk görüntüler

<div> : Sayfada bir bölüm oluşturur

<dl> : Definition list tanımlar

<dt> : Definition list için bir eleman tanımlar.

<em> : Eğik yazı oluşturur

<embed> : HTML dışı uygulamaları (swf gibi) çalıştıran bir alan tanımlar

<fieldset> : form içindeki elemanları sarmak için kullanılır.

<figcaption> : <figure> elemanı içine başlık metni tanımlamada kullanılır.

<figure> : İçeriği sarmalar. Kendine özgü margin değeri vardır. içine yazdığınız içeriği sayfa elemanlarından ayırır.

<footer> : Sayfada CSS kullanmadan footer oluşturur

<form> : Form alanı oluşturur

<h1>, <h2>, <h3>, <h4>, <h5>, <h6> : Sayfaya başlık metni eklerler Sayı değeri büyüdükçe başlığın puntosu küçülür.

<head> :  Sayfada üst kısımda özel bilgi alanı oluşturut burdaki içeriği kullanıcılar görmez.

<header> : Sayfaya CSS kullanmadan header kısmı ekler

<hgroup> : <h1>, <h2>, <h3>, <h4>, <h5>, <h6> elemanlarını gruplar.

<hr> : Sayfaya yatay çizgi çizer.

<html> : HTML sayfasının kök elemanı. tüm içeriği kapsar

<i> : İtalik metin oluşturur

<iframe> : ifame nesnesi oluşturur(iframe içinde başka bir web sayfası görüntülenir)

<img> : Resim eklemek için kullanılır.

<input> : Buton metin kutusu gibi form elemanlarını tanımlamak için kullanılır

<ins> : Metnin altını çizen HTML tagı

<kbd> : metin alanı tanımlar

<keygen> : formlarda kullanılır şifrelemek için kullanılır

<label> : input elemanlarını etiketlemek için kullanılır

<legend> : <fieldset> ile tanımlanan elemanlara başlık oluşturur.

<li> : Liste elemanı tanımlar

<lik> : HTML dokumanına stil ya da script dosyaları bağlamak için kullanılır

<map> : Özellikle resim elemanlarında özel bölgeler tanımlamak için kullanılır.

<mark> : Metni işaretlemek için kullanılır.

<menu> : command elemanlarının listelenmesinde oluşan bir menü tanımlar şu anlık browser desteği yok

<meta> : Web sayfaları için üst veri tanımlar

<meter> : Web sayfası içinde progressbar benzeri bir eleman tanımlar ,nernet explorer desteği yok

<nav> : CSS kullanmadan navigasyon menüsü oluşturur

<noscript> : Browser Javascript desteklemediğinde uyarı mesajı çıkarmak için kullanılır

<object> : Sayfa içinde gömülü olarak .swf gibi nesneleri görüntülemek için kullanılır

<ol> : sayfaya 1, 2, 3 gibi sıralı liste eklemek için kullanılır

<optgroup> : açılır menu elemenlarını gruplamak için kullanılır.

<option> : Açılır menuye eleman eklemek için kullanılır

<output> : Hesaplama sonucunu görüntülemek için kullanılır.

<p> : Sayfaya paragraf eklemek için kullnılan HTML tagı

<param> : Object nesnesi için parametre tanımlar

<pre> : Önceden biçimlendirilmiş bir metin tanımlar

<progress> : Sayfaya bir progress bar eklemek için kullanılan HTML kodu

<q> : metne çifttırnak ekler

<rp> : Browser ruby kodlarını desteklemediğinde görüntülenecek metni tanımlar

<rt> : Özel karakter gösterilmesini sağlar

<ruby> : ruby yazılarını gösterir

<s> : Metni üstü çizili yapar

<samp> : metin düzenler

<script> : Kullnıcı tarafında çalışan script kodlarını eklemek için kullanılır

<section> : Dokumanda bir bölge tanımlar

<select> : Açılır menu tanımlar

<small> : Metni küçültür

<source> : Media elemanları için kaynak tanımlar

<span> : HTML dökümanı içinde satır cinsinden bir alan tanımlar

<strong> : Metni kalın yapar

<style> : CSS tanımlar

<sub> : Satır altı metin oluşturur

<summary> : HTML dokumanında özet alanı öluşturur

<sup> : Satırüstü metin oluşturur

<table> : Tablo tanımlar

<tbody> : Tablo elemanlarını gruplar

<td> : Tabloda bir hücre tanımlar

<textarea> : HTML form içinde çok satırlı metin giriş elemanı tanımlar

<tfoot> :  Tablonun footer elemanların gruplar

<th> : Başlık biçiminde tablo hücre elemanları oluşturur

<thead> : Tablo başlık elemanlarını gruplar

<time> HTML dokumanında zaman bilgisi göstermek için kullanılır

<title> : HTML dokumanının başlık çubuğuna yazı yazmak için kullanılır

<tr> : tabloya satır elemanı eklemek için kullanılan HTML kodu

<u> : metnin altını çizmek için kullanılan HTML tagı

<var> : Eğik yazı oluşturur

<video> : HTML sayfasına video  eklemek için kullanılan HTML5 tagı

<wbr> : Satır sonu tanımlar