HTML (HyperText Markup Language) Nedir?
HTML, HyperText Markup Language (Hipermetin İşaretleme Dili), web sayfalarını oluşturmak için kullanılan standart işaretleme dilidir. HTML, metin içeriğini yapılandırmak ve biçimlendirmek, resimler, videolar, bağlantılar gibi öğeleri sayfalara eklemek için kullanılır. Web tarayıcıları, HTML dosyalarını okuyarak web sayfalarını kullanıcıya görüntüler.
HTML'in Temel Özellikleri
-
Yapısal Dizinleme: HTML, web sayfasındaki öğelerin düzenini belirtmek için kullanılır. Başlıklar, paragraflar, listeler ve bağlantılar gibi öğeler, HTML etiketleriyle yapılandırılır.
-
İşaretleme Dili: HTML, metni biçimlendirme veya düzenleme değil, verinin yapısını tanımlar. Bunun için etiketler kullanılır.
-
Web Tarayıcıları ile Uyumluluk: HTML, web tarayıcıları tarafından render (görüntülenme) edilir. Tarayıcılar, HTML sayfalarını okuyarak bunları kullanıcıya görsel bir şekilde sunar.
-
Bağlantılar ve Hipermetin: HTML, sayfalar arasında bağlantılar kurmak için "hyperlink" (hipermetin) yapısını kullanır. Bu, kullanıcıların bir sayfadan diğerine geçiş yapabilmesini sağlar.
HTML Temel Etiketler
-
<html>
: HTML belgesinin başlangıcını belirtir.<html><!-- İçerik buraya gelecek --></html> -
<head>
: HTML belgesinin başlık bölümüdür. Sayfa hakkında bilgi veren öğeleri içerir.<title>
: Sayfanın başlık kısmını belirler.<head><title>Sayfa Başlığı</title></head>
-
<body>
: Web sayfasının görünür içeriğini içerir. Kullanıcıya gösterilen metin, resimler, bağlantılar bu bölümde yer alır.<body><!-- Sayfa içeriği buraya gelecek --></body> -
<h1>
-<h6>
: Başlık etiketleri.<h1>
en büyük başlık,<h6>
en küçük başlıktır.<h1>Bu en büyük başlık</h1><h2>Bu ikinci büyüklükte başlık</h2> -
<p>
: Paragraf etiketi, metin bloklarını tanımlar.<p>Bu bir paragraftır.</p>
-
<a>
: Bağlantı (anchor) etiketi, hipermetin bağlantıları oluşturur.href
özelliği, bağlantının hedefini belirtir.<a href="https://www.ornek.com">Bu bir bağlantıdır</a>
-
<img>
: Resim etiketi, sayfaya görsel ekler.src
özelliği, resmin dosya yolunu belirtir.<img src="resim.jpg" alt="Açıklama">
-
<ul>
ve<ol>
: Sırasız ve sıralı liste etiketleridir.<ul>
sırasız listeyi,<ol>
sıralı listeyi tanımlar. Her iki etikette de öğeler<li>
etiketi ile belirtilir.<ul><li>Liste öğesi 1</li><li>Liste öğesi 2</li></ul><ol><li>Sıralı liste öğesi 1</li><li>Sıralı liste öğesi 2</li></ol> -
<table>
: Tablo etiketi, bir tablo oluşturmak için kullanılır. Tablo satırları<tr>
, başlık hücreleri<th>
, veri hücreleri ise<td>
ile belirtilir.<table><tr><th>Başlık 1</th><th>Başlık 2</th></tr><tr><td>Veri 1</td><td>Veri 2</td></tr></table> -
<div>
: Blok düzeyinde bir kapsayıcı öğe olarak kullanılır. Genellikle sayfa bölümlerini gruplayıp düzenlemek için kullanılır.<div><p>Bu bir div içinde yer alan paragraftır.</p></div> -
<span>
: Satır içi öğeleri gruplamak için kullanılır. Genellikle metin üzerinde stil değişiklikleri yapmak için kullanılır.<span style="color: red;">Bu kırmızı renkte bir metin.</span>
HTML Yapısal Ögeler
-
Duyarlı Tasarım (Responsive Design): HTML, duyarlı web tasarımları oluşturmak için de kullanılır. CSS ve JavaScript ile birlikte kullanılarak, farklı ekran boyutlarına uyum sağlayan dinamik ve uyumlu sayfalar oluşturulabilir.
-
Formlar: HTML, kullanıcılardan veri almak için formlar sağlar.
<form>
,<input>
,<select>
,<textarea>
,<button>
gibi etiketlerle formlar oluşturulur.<form action="/submit" method="POST"><input type="text" name="name" placeholder="Adınızı girin"><button type="submit">Gönder</button></form> -
Metin Biçimlendirme: HTML, metinleri biçimlendirmek için çeşitli etiketler sunar. Örneğin,
<b>
(kalın metin),<i>
(italik metin),<u>
(altı çizili metin) gibi etiketler kullanılarak metinlerin görsel stili değiştirilebilir.<b>Kalın metin</b><i>İtalik metin</i>
HTML'in Avantajları
- Web Sayfaları Oluşturma: HTML, web sayfalarının temel yapı taşlarını oluşturur. HTML olmadan, bir web sayfasının içeriği tanımlanamaz.
- Erişilebilirlik: HTML, tarayıcılar tarafından okunabilir ve tüm internet kullanıcılarına erişilebilir.
- Esneklik: HTML, medya öğeleri, metin, bağlantılar, formlar ve görseller gibi birçok farklı öğeyi bir araya getirerek dinamik ve etkileşimli web sayfaları oluşturulmasına imkan tanır.
- Kolay Öğrenilebilir: HTML, oldukça basit ve sezgisel bir dildir. Yeni başlayanlar için web geliştirme öğrenmek adına iyi bir başlangıçtır.
Sonuç
HTML, web geliştirme dünyasının temel yapı taşlarından biridir ve web sayfalarını oluşturmak için vazgeçilmez bir dildir. Web tasarımcıları ve geliştiricileri için HTML, metin, görseller, bağlantılar ve formlar gibi öğeleri düzenlemek ve sunmak için kullanılır. HTML ile sayfaların yapısını tanımlayarak, tarayıcıların bu sayfaları doğru şekilde görüntülemesini sağlarız.
Hiç yorum yok:
Yorum Gönder
Yorumunuz İçin Teşekkürler