HTML (HyperText Markup Language), Türkçesiyle Hipermetin İşaretleme Dili, web sayfalarının iskeletini oluşturmak için kullanılan bir işaretleme dilidir. HTML, bir programlama dili değil; tarayıcıların okuyabileceği şekilde sayfa içeriğini tanımlayan, düzenleyen ve yapılandıran bir metin biçimidir.
Web tarayıcıları, HTML dosyalarını okuyarak bu belgeleri görsel olarak kullanıcıya sunar. Bir web sayfasında gördüğünüz başlıklar, paragraflar, görseller, bağlantılar, tablolar ve daha fazlası HTML sayesinde görünür hale gelir.
HTML Ne İşe Yarar?
HTML, internet üzerindeki içeriklerin nasıl sunulacağını belirler. Şu işlevleri yerine getirir:
- Metinleri başlık, paragraf, liste gibi bölümlere ayırır.
- Resimleri, videoları ve diğer medya içeriklerini web sayfasına yerleştirir.
- Linkler aracılığıyla sayfalar arasında gezinmeyi sağlar.
- Formlar oluşturularak kullanıcıdan veri toplanmasına yardımcı olur.
- Sayfa yapısını semantik hale getirerek SEO ve erişilebilirlik açısından avantaj sağlar.
HTML’nin Tarihçesi
HTML’nin geçmişi, internetin doğuşuyla paralel ilerler:
- 1991 – Tim Berners-Lee tarafından ilk HTML sürümü geliştirildi.
- 1995 – HTML 2.0 yayımlandı.
- 1997 – HTML 4.0 sürümü ile CSS ve JavaScript entegrasyonu başladı.
- 1999 – HTML 4.01 ile daha stabil hale geldi.
- 2008 – HTML5 geliştirilmeye başlandı.
- 2014 – HTML5 resmi olarak standart haline geldi.
HTML’nin Temel Yapısı
Bir HTML belgesi genel olarak şu yapı taşlarından oluşur:
<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<title>Örnek Sayfa</title>
</head>
<body>
<h1>Merhaba Dünya</h1>
<p>Bu bir örnek HTML sayfasıdır.</p>
</body>
</html>
Açıklamalar:
<!DOCTYPE html>: HTML5 kullanıldığını belirtir.<html>: Sayfanın başlangıcını ve bitişini tanımlar.<head>: Meta bilgiler, başlık, stil dosyaları burada yer alır.<body>: Sayfanın kullanıcıya görünen kısmıdır.
Sık Kullanılan HTML Etiketleri
| Etiket | Açıklama |
|---|---|
<h1> – <h6> | Başlık etiketleri (h1 en büyük) |
<p> | Paragraf |
<a> | Bağlantı (anchor) |
<img> | Görsel eklemek için |
<ul>, <ol>, <li> | Listeler |
<div> | Blok alanı oluşturur |
<span> | Satır içi alan |
<table>, <tr>, <td> | Tablolar |
<form>, <input>, <button> | Form elemanları |
HTML5 ile Gelen Yenilikler
HTML5, modern web’in ihtiyaçlarına cevap verecek şekilde geliştirildi. Öne çıkan yenilikler:
- Video ve ses desteği:
<video>ve<audio>etiketleri ile medya oynatımı artık eklentiye gerek kalmadan yapılabiliyor. - Yeni semantik etiketler:
<header>,<footer>,<article>,<section>gibi etiketlerle sayfa yapısı daha anlamlı hale getirildi. - Form geliştirmeleri: Tarih, renk, sayı gibi gelişmiş form alanları sunuldu.
- Canvas ve SVG desteği: Grafik çizimi ve animasyonlar için alan açıldı.
- Offline çalışma ve yerel depolama:
localStoragevesessionStorageile veri tarayıcıda saklanabiliyor.
HTML ve Diğer Web Teknolojileri
HTML, genellikle diğer web teknolojileriyle birlikte kullanılır:
- CSS (Cascading Style Sheets): Sayfanın görünümünü düzenler.
- JavaScript: Dinamiklik ve kullanıcı etkileşimi sağlar.
- Frameworkler: React, Vue, Angular gibi modern yapılar HTML ile birlikte çalışır.
- Backend Dilleri: HTML, PHP, Python, Node.js gibi dillerle birlikte dinamik sayfalar oluşturmak için kullanılır.
SEO Açısından HTML’nin Önemi
HTML yapısı, arama motorlarının sayfanızı anlaması için kritik öneme sahiptir:
<title>ve<meta>etiketleri SEO’nun temel taşlarıdır.<h1>etiketi yalnızca bir kez kullanılmalı, sayfa ana başlığı olarak belirlenmelidir.- Görseller için
altetiketleri kullanılmalıdır. - Anlamlı bağlantılar ve semantik yapı hem erişilebilirlik hem SEO için önemlidir.
HTML Öğrenmek İsteyenler İçin Tavsiyeler
- w3schools.com gibi siteler üzerinden pratik yapabilirsiniz.
- MDN Web Docs oldukça detaylı kaynaklar sunar.
- Küçük projeler oluşturarak öğrendiklerinizi pekiştirin.
- HTML editörleri (VS Code gibi) ile anında çıktılar alarak deneme-yanılma yöntemiyle öğrenin.
HTML, modern internetin temel yapı taşıdır. Web sayfalarının içeriğini tanımlar, kullanıcıya sunulmasını sağlar ve diğer teknolojilerle birlikte kullanıldığında çok daha güçlü hale gelir. Web dünyasında yer almak isteyen herkesin HTML’yi öğrenmesi ve etkin kullanması büyük avantaj sağlar.
