HTML NEDİR?

Vimaj9 dk okuma
HTML5 turuncu shield yanında büyük navy soru işareti ve içinde küçük html etiketi olan navy çerçeve kompozisyonu beyaz arka planda

HTML, "HyperText Markup Language" yani "köprülü metin işaretleme dili" demek; dünyadaki her web sitesinin altında yatan ortak dildir. Bu yazıda HTML'in ne olduğunu, ne işe yaradığını, programlama dili olmamasının ne anlama geldiğini, web geliştirme ekosistemindeki yerini ve nasıl öğrenileceğini sırasıyla açıklıyoruz.

1. HTML tam olarak nedir?

HTML bir programlama dili değil, bir işaretleme dilidir. Bu fark çok önemli ve sık karıştırılır. Bir programlama dili (JavaScript, Python, Java gibi) hesaplama yapar, mantık kurar, karar verir. Bir işaretleme dili sadece "bu metin bir başlıktır", "bu bir paragraftır", "bu bir bağlantıdır" şeklinde içerik üzerine etiket koyar.

Etiketleri tarayıcı yorumlar

Tarayıcı bu etiketleri okuyarak sayfayı nasıl göstereceğine karar verir. Yani HTML "ne yapacağını" değil "ne olduğunu" söyler.

Bir HTML belgesinin basit hali

<!DOCTYPE html>
<html lang="tr">
<head>
  <meta charset="UTF-8">
  <title>Benim İlk Sayfam</title>
</head>
<body>
  <h1>Merhaba Dünya</h1>
  <p>Bu benim ilk HTML sayfam.</p>
</body>
</html>

Bu yedi satırlık kod, tarayıcıda büyük "Merhaba Dünya" başlığı ve altında bir paragraf olarak görünür. Tarayıcı <h1> etiketini görünce "büyük başlık" anlar; <p> görünce "paragraf" anlar. Etiketler sayesinde içerik anlam kazanır.

2. HTML ne işe yarar?

HTML üç temel iş yapar:

  1. Sayfa yapısını oluşturur. Hangi alanda başlık, hangi alanda paragraf, hangi alanda görsel olacağını belirler.
  2. İçeriği anlamlandırır. Bir metnin bağlantı, bir metnin başlık, bir metnin liste olduğunu işaretler. Bu anlam tarayıcıların, arama motorlarının ve ekran okuyucuların sayfayı doğru yorumlamasını sağlar.
  3. Diğer teknolojilere zemin hazırlar. CSS ile şekillenir, JavaScript ile etkileşim kazanır. HTML olmadan ne CSS bir şey boyayabilir, ne JavaScript bir şey çalıştırabilir.

3. HTML programlama dili değildir — bu ne anlama geliyor?

"HTML öğrendim, programcı oldum" cümlesi yanlıştır. HTML mantık işlemi yapmaz. Şu işleri yapamaz:

  • İki sayıyı toplayamaz
  • Koşullu karar veremez ("eğer kullanıcı giriş yaptıysa şunu göster")
  • Veriyi saklayamaz
  • Sunucuyla iletişim kuramaz
  • Sayfayı dinamik olarak değiştiremez

Bu işlerin hepsi JavaScript veya sunucu tarafı dillerine (PHP, Python, Node.js) düşer. HTML sadece yapı tarif eder; her etiketin görevini ve doğru kullanımını MDN web dokümantasyonu ayrıntılı anlatır. Bu nedenle HTML'i ezberlemekten çok mantığını anlamak önemlidir; mantık basittir, ezber gerektirmez.

4. HTML, CSS ve JavaScript: üçlü ekibin görevleri

Modern bir web sayfası üç katmandan oluşur. Her birinin görevi farklıdır ve tek başına yetmez.

HTML CSS JavaScript üç katmanlı diyagram her katman farklı renk teal coral amber etiketli STRUCTURE STYLE INTERACTION görev tanımıyla yan yana
KatmanGörevBenzetme
HTMLYapı kurarBir evin duvar ve odaları
CSSGörünüm verirBoya, mobilya, perde
JavaScriptEtkileşim sağlarElektrik, ışık düğmesi, asansör

Sadece HTML ile yazılmış bir sayfa duvarları olan ama boyasız ve elektriksiz bir ev gibidir. CSS olmadan sayfa görsel olarak çekici değildir; JavaScript olmadan tıklamalara tepki vermez. Profesyonel siteler üçünü dengeli kullanır.

5. HTML'in tarihi ve sürümleri

HTML 1991'de Tim Berners-Lee tarafından CERN'de geliştirildi. Amacı bilim insanlarının belgeleri internet üzerinden paylaşmasıydı. Sonraki yıllarda büyük değişiklikler yaşandı:

  • HTML 1.0 (1993): İlk halk sürümü. Temel etiketler vardı, ama görsel ve form yoktu
  • HTML 2.0 (1995): Form etiketleri eklendi
  • HTML 3.2 (1997): Tablo, script desteği geldi
  • HTML 4.01 (1999): Stil dosyaları (CSS) destekledi, semantik ayrım başladı
  • XHTML (2000-2008): Daha katı kurallı bir geçiş sürümü; uzun ömürlü olmadı
  • HTML5 (2014): Bugün hâlâ kullanılan standart. Semantik etiketler, video/audio, canvas, geliştirilmiş formlar

Bugün tüm modern siteler HTML5 kullanır. Yeni bir sürüm planı yoktur; HTML5 "yaşayan standart" (living standard) olarak güncellenmektedir.

6. HTML nasıl çalışır?

Bir HTML sayfasının tarayıcıda nasıl göründüğünü anlamak için arka planda olanlara bakmak gerekir:

  1. Kullanıcı tarayıcıya bir URL yazar
  2. Tarayıcı bu URL'in sunucusuna istek gönderir
  3. Sunucu o sayfanın HTML dosyasını tarayıcıya geri yollar
  4. Tarayıcı HTML'i yukarıdan aşağıya okur
  5. Etiketleri görerek DOM (Document Object Model) adında bir ağaç yapı oluşturur
  6. Varsa CSS dosyalarını çeker, stilleri uygular
  7. Varsa JavaScript dosyalarını çalıştırır
  8. Sonuç olarak ekrana sayfa çizilir

Bu süreç saliseler içinde gerçekleşir. Sayfa "yavaş" hissi verdiğinde genelde sorun bu sekiz adımdan birindedir; teknik SEO ve performans optimizasyonu bu adımları hızlandırmaya odaklanır.

7. HTML nerelerde kullanılır?

Sadece web siteleri değil, beklediğinizden çok daha fazla yerde HTML çalışır:

  • Web siteleri: Her web sitesi HTML üzerine kuruludur
  • E-posta tasarımları: Outlook ve Gmail içindeki kampanya e-postaları HTML ile yazılır
  • Mobil hibrit uygulamalar: React Native ve Ionic gibi araçlar HTML benzeri yapı kullanır
  • Masaüstü uygulamalar: VS Code, Slack, Discord gibi popüler programlar HTML+CSS+JavaScript tabanlıdır (Electron framework'ü)
  • PDF üretimi: Birçok PDF oluşturma aracı HTML üzerinden çalışır
  • E-kitap formatları: EPUB dosyaları HTML temellidir

Bu yaygınlık HTML bilmenin neden temel beceri olduğunu açıklar. Bir geliştirici hangi alanda çalışırsa çalışsın, kariyerinin bir noktasında HTML ile karşılaşır.

8. HTML öğrenmeye nasıl başlamalı?

HTML öğrenmenin üç ana adımı vardır:

1. İlk hafta: temel etiketleri tanıma

Başlık etiketleri (h1-h6), paragraf (p), bağlantı (a), görsel (img), liste (ul/ol/li) ve sayfa iskeleti (doctype, html, head, body). Bu altı grup günlük kullanımın yüzde 80'ini karşılar. Hangi etiketin tüm HTML kodlarını içerdiğini görmek için HTML kodları ve anlamları rehberi başvuru kaynağıdır.

2. İkinci hafta: tablo, form ve semantik etiketler

Tablo etiketleri (table, tr, th, td), form etiketleri (form, input, label, button) ve semantik etiketler (header, nav, main, section, footer). Buraya kadar geldiğinizde kendi başınıza basit bir blog sayfası yazabilirsiniz.

3. Üçüncü hafta ve sonrası: CSS ile birlikte

Tek başına HTML, boya almamış bir ev gibidir. Üçüncü haftadan itibaren CSS öğrenmeye başlayın. HTML yapıyı kurarken CSS renk, font, boşluk ve düzen ekler. İkisi paralel öğrenildiğinde sayfayı görsel olarak şekillendirme deneyimi çok daha akıcı olur.

Browser rendering süreç akış diyagramı URL request DNS HTML response parse DOM tree CSS apply paint sekiz aşama numaralı kutular ok ile bağlı

9. HTML öğrenmenin pratik ipuçları

  • Sadece okuma, yaz. Etiketleri kitaptan değil, gerçek bir dosyada yazarak öğrenirsiniz
  • Tarayıcıyı sürekli açık tut. Her değişikliği F5 ile gör; geri bildirim öğrenmeyi hızlandırır
  • Devtools (F12) ile incele. Sevdiğin sitelerin koduna bak; nasıl yapıldığını gör
  • Mükemmel sayfa peşinde koşma. İlk projelerin çirkin olması normal. Önemli olan tamamlanmış proje sayısı
  • MDN dokümantasyonunu kullan. Mozilla'nın MDN sitesi HTML'in resmi referansıdır

Kendi başına ilerlemek zorlanıyorsa kapsamlı bir HTML eğitimi programı temel etiketleri, semantik yapıyı ve erişilebilirlik kurallarını sıralı şekilde aktarır; sonrasında CSS ve JavaScript ile devam etmek doğal akıştır.

Toparlarsak

HTML, web'in ortak dilidir. Programlama dili olmasa da web sayfası üretmenin başlangıç noktasıdır. Bir sayfanın yapısını kurar, içeriği anlamlandırır ve CSS ile JavaScript'in çalışacağı zemini hazırlar. Temel etiketleri öğrenmek bir hafta, akıcı yazabilmek bir ay, profesyonel düzeyde semantik ve erişilebilir kod üretmek 2-3 ay alır. Web geliştirme kariyerine başlamak isteyen herkes için HTML, hiç tartışmasız ilk durak olmalıdır.

Sıkça Sorulan Sorular

HTML programlama dili midir?

Hayır, HTML işaretleme dilidir. Programlama dilleri (JavaScript, Python gibi) hesaplama yapar, karar verir, mantık kurar. HTML ise sadece içeriği etiketler; 'bu başlık, bu paragraf, bu bağlantı' der. Tarayıcı bu etiketleri okuyarak sayfayı görüntüler. Bu fark teknik olarak çok önemlidir ve HTML öğrenenlerin kendilerini 'programcı' sanmaması açısından netleştirilmelidir.

HTML öğrenmek tek başına yeterli mi?

Modern bir web sitesi yapmak için HTML tek başına yetmez. Görsel düzen ve şekillendirme için CSS, etkileşim ve dinamik davranış için JavaScript gerekir. HTML üçlünün temelidir ama ilk projenin tamamlanması için üçü birlikte öğrenilmelidir. Yine de başlangıç noktası her zaman HTML'dir; sırasız öğrenmek kafa karıştırır.

Eski HTML sürümlerini hâlâ kullanan siteler var mı?

Çok eski siteler veya bakım yapılmamış uygulamalarda HTML4 izleri görülebilir ama bugünkü standart HTML5'tir. HTML5 yaklaşık 10 yıldır kullanımdadır ve tüm modern tarayıcılar tarafından desteklenir. Yeni başlayanların eski sürümleri öğrenmesi gerekmez; doğrudan HTML5 ile başlamak yeterli ve doğrudur.

HTML dosyası nasıl oluşturulur ve çalıştırılır?

Notepad gibi basit bir metin editörü açın, içine HTML kodu yazın ve dosyayı .html uzantısıyla kaydedin (örneğin 'sayfam.html'). Dosyaya çift tıklayın; varsayılan tarayıcınız sayfayı açar. Profesyonel çalışma için VS Code gibi kod editörleri tercih edilir; Live Server eklentisi her değişiklikte sayfayı otomatik yeniler. Sunucu kurmaya veya program yüklemeye gerek yoktur.

HTML kursları çevrimiçi mi gerçek dünyada mı daha verimli?

İkisinin de avantajı vardır. Çevrimiçi kurslar hızlı ve esnektir; istediğiniz saatte ilerleyebilir, durup tekrar izleyebilirsiniz. Sınıf eğitimi ise hocayla doğrudan etkileşim ve diğer öğrencilerle birlikte çalışma sağlar. Çoğu öğrenen için en verimli yol karma: çevrimiçi kaynaklarla başlayıp belirli aşamada bir kurs veya mentor desteği almak. Asıl belirleyici öğrenenin disiplini ve uygulama miktarıdır.

Mobil uygulama yapmak için HTML yeterli mi?

Doğrudan native mobil uygulama (iOS Swift veya Android Kotlin gibi) için HTML kullanılmaz. Ama 'hibrit uygulama' adı verilen yaklaşımda HTML+CSS+JavaScript ile mobil uygulamalar yapılabilir. React Native ve Ionic gibi framework'ler bu yöntemi kullanır. Hibrit uygulamalar tek kod tabanından hem iOS hem Android için derlenebilir; ama native uygulamalar kadar performanslı değildir.

HTML için en iyi öğrenme kaynağı hangisidir?

Resmi referans MDN Web Docs'tur (developer.mozilla.org); Mozilla tarafından tutulur ve doğrulanmış kaynaktır. İnteraktif pratik için freeCodeCamp ve W3Schools öne çıkar. Türkçe içerik için yerli eğitim platformlarındaki HTML kursları, başlangıç seviyesi için yeterli temel kazandırır. Birden fazla kaynağı paralel kullanmak farklı anlatım stillerinden yararlanma açısından en pratik yoldur.

 Vimaj