HTML etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
HTML etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

26 Haziran 2016 Pazar

HTML Nedir?

4.2.2 HTML

HTML günümüzde internet üzerinde veri paylaşımı için kullanılan en yaygın metin tabanlı dildir. HTML, bir programlama dili olarak tanımlanamaz. Zira HTML kodlarıyla kendi başına çalışan bir program yazılamaz. Ancak bu dili yorumlayabilen programlar aracılığıyla çalışabilen programlar yazılabilir. Programlama dili denilememesinin nedeni tam olarak budur. Temel gereği yazı, görüntü, video gibi değişik verileri ve bunları içeren sayfaları birbirine basitçe bağlamak, buna ek olarak söz konusu sayfaların web tarayıcısı yazılımları tarafından düzgün olarak görüntülenmesi için gerekli kuralları belirlemektir.

1980 yılında CERN'de görevli olan Tim Berners-Lee, CERN araştırmacılarının bilgilerini ve dokümanlarını birbirleriyle paylaşabilmeleri için bir sistem olması gerektiğine inanıyordu. Bu yüzden prototip olarak ENQUIRE isimli sistemi önerdi.1989 yılına gelindiğinde internet tabanlı sistemin ilk temellerini yine aynı isim Tim Berners Lee attı.1990 yılında HTML işaretleme dilini geliştirmesinden sonra World Wide Web(WWW) sistemini kurmuştur. Bu şekilde CERN'de bilgi paylaşımını kolaylaştırma amacı doğrultusunda ortaya çıkan HTML günümüzde hayatımızın vazgeçilmezi olan internetin başlıca temelini oluşturmuştur[15].





En Basit HTML Kodu
Şekil 4.2.HTML kod örneği.






HTML aslen bir metin işaretleme dilidir. Web sayfasına eklenen metinlerin boyutlandırılması, renklendirilmesi ve konumlandırılması gibi tasarım amaçlı işlerin yapılabilmesini sağlar. Biçimlendirilmek istenen yazı HTML etiketleri(tagları) arasına yazılır. Şekil 4.2’de basit bir HTML kod örneği verilmiştir. Web sayfasına eklenmek istenen resim video kullanıcı formu gibi elemanlar HTML etiketleri aracılığıyla çağrılırlar. HTML sadece biçimlendirme ve görüntüleme ile ilgilidir. Kullanıcılarla etkileşim kurmaz, sabittir. Bu dille oluşturulan bir sayfanın kullanıcılar ile etkileşim kurabilmesi için HTML etiketlerinin JavaScript, AJAX, PHP, ASP gibi yazılımlar ile ilişkilendirilmiş olması gerekmektedir. Bu şekilde hazırlanmış web sayfaları artık statik olmaktan çıkar ve DHTML(Dinamik HTML) sayfa olarak nitelendirilirler. Bu sayfalar kullanıcılar ile sunucu bilgisayarı arasında bilgi alışverişinin sağlıklı bir şekilde gerçekleşebilmesini sağlarlar. HTML’nin kullanıcıların ihtiyaçlarını karşılayamaması, görsel açıdan zayıf olması, her tarayıcılarda farklı yorumlanması ve yavaş çalışması gibi nedenlerden dolayı geliştirilmesine ihtiyaç duyulmuştur. Bu ihtiyaç doğrultusunda yapılan çalışmalar sonucunda Genişletilebilir Zengin Metin İşaret Dili (Extensible HyperText Markup Language- XTHML) geliştirilmiş ve bu dil Geniş Dünya Ağ Konsorsiyumu (World Wide Web Consortium- W3C) tarafından standartlaştırılmıştır.


Turgut ARSLAN
Uzaktan Eğitim ve Öğrenme Yönetim Sistemlerinin Karşılaştırılması, Tez çalışması, Danışman: Doç.Dr. Seyfettin Dalgıç
Trakya Üniversitesi 2013


Kaynaklar:

[15] http://tr.wikipedia.org/wiki/HTML (12 Şubat 2012).

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

4 Haziran 2009 Perşembe

HTML KODU İLE KAYAN YAZI EFEKTİ VERMEK

WEB SAYFANDA HAREKETLİ YAZILAR GÖRMEK İSTİYORSAN İŞTE SANA GÜZEL, KUILLANIŞLI BİR HTML KODU (YA DA TAGI)..

< marquee > < /marquee >
HAREKET ETTİRMEK İSTEDİĞİN METNİ BU İKİ TAGIN ARASINA YAZIYORSUN VE WEB SAYFANA EKLİYORSUN. HAREKET DEMİŞKEN HEMEN HATIRLATALIM SAYFAYI ZİYARET EDENLER AŞIRI HAREKETLİ NESNELERDEN RAHATSIZ OLABİLİRLER. BUNDAN DOLAYI BU TAGI KULLANIRKEN ÇOK DA AŞIRIYA KAÇILMAMASI ÖNERİLİR.BU TAGI ÖYLE KURU KURUYA KULLANMIYORSUN, KENDİNCE BİR TAKIM AYARLARI VAR.YAZILAR NASIL HAREKET EDECEK? NE YÖNDE GİDECEK? ARKA PLAN RENGİ NE OLACAK? GİBİ SORULARIN CEVAPLANMASI LAZIM.İŞTE BU SORULARIN CEVABI:
LOOP="TEKRAR SAYISI"_________HAREKETİN TEKRARLANMA SAYISINI BELİRLEMEK İÇİNKULLANILIR -1 DEĞERİ VERİLİRSE HAREKET SÜREKLİ OLUR.
BEHAVIOR=""__________________YAZININ HAREKET ŞEKLİNİ BELİRLER. BEHAVIOR="ALTERNETE" YAZILIRSA,YAZI BELİRLENEN ALAN İÇİNDE SAĞ-SOL HAREKETİ YAPAR, KOD KULLANILMAZSA YAZI SAYFANIN BİR UCUNDAN GİRİP DİĞERİNDEN ÇIKAR.
BGCOLOR="RENK"________________YAZININ FON RENGİNİ BELİRLER
SCROLLAMOUNT="YAZININ HIZI"___GİRİLEN SAYI DEĞERİNE GÖRE YAZININ HAREKET HIZI DEĞİŞİR
WIDTH="GENİŞLİK"______________GİRİLEN SAYI DEĞERİNE GÖRE YAZININ HAREKET EDECEĞİ BÖLGENİN GENİŞLİĞİ BELİRLENİR.
HEIGHT="YÜKSEKLİK"____________GİRİLEN SAYI DEĞERİNE GÖRE YAZI ALANININ YÜKSEKLİGİ BELİRLENİR.
ŞİMDİ BU BİLGİLER IŞIĞINDA BİR İKİ KAYAN YAZI DENEMESİ YAPALIMM

<marquee scrollamount="10" behavior="alternate" width="200" bgcolor="#EE0000" height="45" > < H4 > < B > DENEME 1 < /B > < /H4 > < /marquee >

DENEME1 YAZISI BELİRLENEN ÖLÇÜLERDEKİ ALAN İÇİNDE SAĞ-SOL HAREKETİ YAPAR.

DENEME 1



< marquee scrollamount="4" loop="15" width="200" bgcolor="##00EE00" height="75"> < H4 > < B > DENEME 2 < /B > < H4 > < /marquee >


DENEME 2 YAZISI KENDİSİ İÇİN BELİRLENEN ALANIN SAĞINDAN DAHA DÜŞÜK BİR HIZLA HAREKETİNE BAŞLAYACAK VE SOLUNDAN DIŞARI ÇIKACAK BU HAREKETİNİ 15 DEFA TEKRARLAYIP DURACAK

DENEME 2