HTML: HTML'in Gelişimi

Web dünyasında HTML'in (HyperText Markup Language) gelişimi, internet teknolojilerinin ilerlemesiyle paralel olarak büyük değişiklikler geçirdi. Bu süreçte DHTML, XHTML ve HTML 5 gibi farklı teknolojiler ortaya çıktı ve web standartlarını belirledi. Bu makalede, HTML’in gelişim sürecine ve beraberinde getirdiği yeniliklere göz atacağız.

DHTML

DHTML (Dynamic HTML), iki büyük tarayıcı üreticisi olan Microsoft ve Netscape’in tarayıcıları ile bizleri tanıştırdıkları ve daha sonraki sürümlerinde de destekledikleri, World Wide Web Konsorsiyumu (W3C) tarafından artık bir web standardı olarak kabul gören teknolojiye verilen isimdir.

DHTML teknolojisi diye hitap edilen sanal kavram, aslında DHTML metodunun kullandığı HTML, CSS ve JavaScript teknolojilerinin bütününe verilen addır. Bu teknolojilerin her biri farklı bir amaç doğrultusunda geliştirilmiş ve birbirinden farklı konularda güçleri olan web standartlarıdırlar.

  • HTML – 1993
  • JavaScript – 1995
  • CSS1 – 1996

XHTML

XHTML (eXtensible Hypertext Markup Language), 26 Haziran 2000’den beri bir web standardıdır.

Kodlama olarak oldukça büyük farklar yaratan bu dil için: ‘XML sözdiziminin HTML içinde kullanılması.’ diyebiliriz.

HTML dilinin farklı tarayıcılarda (Internet Explorer, Firefox, Opera gibi) farklı yorumlanması ve sözdiziminde fazla düzensizlik ve hata olduğu için XHTML, W3C (World Wide Web Consortium) tarafından önerilmiştir. XHTML’nin diğer bir özelliği, kodlama yapanları CSS teknolojisini kullanmaya teşvik etmesidir.

Web sayfanızın bu standartlara uygun olup olmadığını validator.w3.org adresinden kontrol edebilirsiniz.

Örneğin:

Yukarıdaki kod doğru bir şekilde çalışır çünkü web tarayıcıları eksik olan etiketleri siz yazmasanız da kendisi tamamlar. Ancak böyle bir yöntem kullanmak doğru değildir çünkü bazen hatalara yol açabilir. Ayrıca, bu tamamlama işlemi tarayıcı açısından bir zaman kaybıdır.

Sonuç olarak ortaya XHTML fikri çıktı. XHTML (Extensible HyperText Markup Language), HTML ve XML’in birleşiminden oluşur. HTML’nin XML sözdizimine göre düzenlenmesidir. Bu yüzden XHTML’de kurallar katıdır.

XHTML Kuralları

  • DOCTYPE tanımlaması olmalıDOCTYPE, hazırladığınız sayfaların hangi tipte bir belge olduğunu tarayıcıya bildirmek için kullanılır. Bu sayede tarayıcı, sayfayı hangi standarda göre yorumlayacağını anlar. Eğer DOCTYPE kullanılmazsa tarayıcılar sayfaları standarda uygun olarak yorumlamaz, dolayısıyla her tarayıcı farklı sonuçlar verebilir. DOCTYPE tanımlaması <html> etiketinin bir üst satırında olmalı ve tanımlamanın üstünde hiçbir şey olmamalıdır.

HTML 5:

<!DOCTYPE html>

HTML 4.01 Strict: XHTML Dökümanlarını css dökümanları ile beraber kullanmanız gerektiğinde kullanılır. HTML’nin dizayn unsurlarını içermez.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

HTML 4.01 Transitional: CSS anlamayan web gezginlerini desteklemek ve HTML’nin dizayn unsurlarını kullanmak istiyorsanız bu döküman tipini kulanın.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

XHTML 1.0 Frameset: Eğer XHTML dökümanları pencerelere bölünmüş olarak gösterilecekse bu döküman tipini kullanın.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

html etiketinde xmlns özelliği tanımlanmalı

<html xmlns="http://www.w3.org/1999/xhtml">

  • html, head, title ve body etiketleri kesinlikle sayfanızda olmalı.
  • İç içe etiketler muntazam şekilde kapatılmalı.
  • XHTML'de iç içe elementler sırasıyla kapatılmalı.
  • Açılan etiket mutlaka kapatılmalı.
  • “br”, “hr” vb. etiketler mutlaka kapatılmalı (HTML'de bu tarz etiketlerin kapatılması gerekmez ama XHTML'de zorunludur.)
  • <br>, <hr>, <img …>, <meta …>, <input …> vb. etiketleri kapatma şekli farklıdır ayrıca etiketler ve etiket özellikleri küçük harfle tanımlanmalı.
  • Etiket özelliklerini tanımlarken tırnak kullanılmalı.

Örnek;

DOM (Document Object Model)

DOM, “Belge Nesnesi Modeli” anlamına gelir. İnternet tarayıcıları girilen internet sayfasını bir belge, bu belge (sayfa) içerisinde bulunan tüm elemanları da nesne olarak kabul eder.

Bir HTML dosyası aslında ağaç ve dallar şeklindedir. Bu ağaç yapısına “Düğüm Ağacı” (node-tree) denir. Tüm düğümlere bu ağaç üzerinden ulaşılabilir. İçerikleri değiştirilebilir, silinebilir veya yeni elemanlar eklenebilir. JavaScript veya jQuery kullanarak bu ağaç yapısını dinamik bir şekilde düzenlemek mümkündür.

HTML 5

Dikkatli incelendiğinde birçok websitesi tasarımı <div id="nav">  <div class="header">  <div id="footer">  gibi HTML kodları içerir. HTML 5 ile daha anlamlı etiketlere geçiş yapılmakla birlikte birçok yeni etiket ve özellik geliştirilmiştir.

Yeni birkaç HTML 5 Etiketi;

  • <article>
  • <aside>
  • <details>
  • <figcaption>
  • <figure>
  • <footer>
  • <header>
  • <main>
  • <mark>
  • <nav>
  • <section>
  • <summary>
  • <time>
  • 14 Mart 2022

Diğer Yazılarımız

Tüm Yazılarımız

Web Sitesi Neden Gerekli?

Günümüzde internet, bilgiye ulaşmanın en hızlı ve etkili yolu haline…

JavaScript: DOM Metotları

Document Object Model(Doküman Nesne Modeli)'in kısaltması olan DOM dokümanlara erişmek…

Linux ile Yüksek Performanslı Sunucuların Yönetimi

Günümüzde işletmeler, yüksek performanslı ve güvenilir sunuculara ihtiyaç duyuyor. Bu…

Ağ Güvenliğinde Sektörel Trendler ve Öne Çıkan Teknolojiler

Ağ güvenliği, modern dijital dünyada en kritik alanlardan biridir. Şirketler,…
HTML Gelişimi

Soru işareti kalmasın

Bu yazı hakkında aklınıza takılanlar, bir fikriniz belkide şikayetiniz vardır. Yada yazımızda hatalar olduğunu düşünüyor olabilirsiniz. Peki neden bize ulaşmayı düşünmeyesiniz ki?

İletişime geç

Hizmetlerimiz

Binlerce müşterimizin yararlandığı 100'e yakın hizmetlerimizden sizlerde yararlanabilirsiniz. Onlarca ücretsiz web hizmeti ve profesyonel destekle sizleri daima daha ileriye taşımayı hedefliyoruz.

Hizmetlerimiz

Tüm Yenilik ve Kampanyalardan Haberdar Ol

Önceki Yazımız
Tüm Yazılarımız
Sonraki Yazımız
No Comments

    Yazı hakkında ne Düşünüyorsunuz?