HTML (HyperText Markup Language), web sayfalarının oluşturulmasını sağlayan temel işaretleme dilidir. HTML, internetin yapı taşlarından biridir ve tarayıcıların web sayfalarını anlamasını ve görüntülemesini sağlar. Günümüzde kullanılan tüm web siteleri HTML ile oluşturulur ve CSS (Cascading Style Sheets) ile şekillendirilirken, JavaScript ile dinamik hale getirilir.
Bu yazıda, HTML’nin ne olduğu, nasıl çalıştığı, hangi bileşenlerden oluştuğu ve web geliştirme açısından neden bu kadar önemli olduğu detaylı bir şekilde ele alınacaktır.
HTML Nedir?
HTML, “HyperText Markup Language” kelimelerinin baş harflerinden oluşur ve “Hiper Metin İşaretleme Dili” anlamına gelir. HTML, web sayfalarını oluşturmak için kullanılan bir işaretleme dilidir. HTML, bir programlama dili değil, yapısal bir dildir. Bu, HTML’nin, bir sayfanın içeriğini düzenlemek için kullanılan etiketlerden (tags) oluştuğu anlamına gelir.
HTML’nin temel amacı, bir web sayfasındaki metin, resim, video, bağlantı ve diğer içeriklerin nasıl görüntüleneceğini tarayıcılara anlatmaktır.
HTML Ne İşe Yarar?
HTML, aşağıdaki temel işlevleri yerine getirir:
- Web Sayfalarının Yapısını Oluşturur: HTML, bir web sayfasının temel yapısını belirler. Başlıklar, paragraflar, listeler, tablolar ve formlar gibi sayfanın temel bileşenlerini içerir.
- Metin ve Medya İçeriklerini Düzenler: HTML, web sayfalarında metinlerin nasıl görüntüleneceğini düzenler. Ayrıca resim, ses, video ve diğer medya içeriklerini sayfaya eklemeye olanak tanır.
- Bağlantılar (Hyperlinks) Sağlar: HTML, web sayfaları arasında bağlantılar oluşturmayı sağlar. Kullanıcılar, bir sayfadan diğerine kolayca geçiş yapabilir.
- Formlar ve Etkileşimli Öğeler Sunar: Kullanıcı girdisi almak için HTML formlar kullanılır. Formlar sayesinde kullanıcılar bilgi girişi yapabilir, anketler doldurabilir veya bir web sitesiyle etkileşime girebilir.
- SEO ve Erişilebilirlik Sağlar: Arama motorları, HTML’nin yapısını analiz ederek sayfanın içeriğini anlamlandırır. Doğru HTML kullanımı, SEO (Arama Motoru Optimizasyonu) açısından önemlidir. Ayrıca, HTML erişilebilirliği artırarak görme engelli kullanıcılar için sayfaların okunabilir olmasını sağlar.
HTML’nin Temel Yapısı
Bir HTML belgesi, belirli bir yapıya sahiptir ve aşağıdaki ana bölümlerden oluşur:
1. <!DOCTYPE html> Bildirimi
Bu satır, tarayıcıya hangi HTML sürümünün kullanıldığını bildirir. Modern HTML belgeleri için genellikle şu şekilde kullanılır:
<!DOCTYPE html>2. <html> Etiketi
HTML belgesinin başlangıcını ve bitişini belirtir.
<html>
</html>3. <head> Bölümü
<head> etiketi, sayfa hakkında meta bilgileri içerir. Başlık, karakter seti ve CSS dosyaları gibi öğeler burada tanımlanır.
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Web Sayfam</title>
</head>4. <body> Bölümü
<body> etiketi, web sayfasının görünen içeriğini barındırır. Metinler, resimler, bağlantılar, butonlar ve diğer HTML öğeleri burada bulunur.
<body>
<h1>Merhaba, Dünya!</h1>
<p>Bu bir HTML sayfasıdır.</p>
</body>HTML’nin Temel Etiketleri
HTML, birçok etiket içerir. İşte en yaygın kullanılan bazı etiketler:
- Başlık Etiketleri:
<h1>–<h6><h1>Başlık 1</h1> <h2>Başlık 2</h2> - Paragraf:
<p><p>Bu bir paragraf örneğidir.</p> - Bağlantılar:
<a><a href="https://www.example.com">Bağlantıya Git</a> - Resimler:
<img><img src="resim.jpg" alt="Resim Açıklaması"> - Listeler:
- Sırasız Liste:
<ul><ul> <li>Elma</li> <li>Armut</li> </ul> - Sıralı Liste:
<ol><ol> <li>Birinci</li> <li>İkinci</li> </ol>
- Sırasız Liste:
- Formlar ve Giriş Alanları:
<form> <label for="name">Adınız:</label> <input type="text" id="name" name="name"> <button type="submit">Gönder</button> </form>
HTML ve CSS İlişkisi
HTML, sayfanın içeriğini belirlerken, CSS (Cascading Style Sheets) tasarım ve stil kazandırmak için kullanılır. Örneğin, aşağıdaki gibi bir CSS kodu ile HTML sayfanızın görünümünü değiştirebilirsiniz:
<style>
body {
background-color: lightblue;
font-family: Arial, sans-serif;
}
h1 {
color: darkblue;
}
</style>Sonuç
HTML, web geliştirmenin temel taşlarından biridir ve web sayfalarının iskeletini oluşturur. HTML, metinleri biçimlendirmekten resimler ve videolar eklemeye kadar birçok işlevi yerine getirir. CSS ve JavaScript ile birlikte kullanıldığında, güçlü ve etkileyici web siteleri oluşturmak mümkün hale gelir.
Bir web geliştirici olmak isteyen herkesin HTML’yi öğrenmesi gerekir. HTML, basit bir dil gibi görünse de, modern web geliştirme için temel bir beceridir ve internet dünyasında çok büyük bir rol oynamaktadır.
