Ders 2: Etiket, Element ve Öznitelik Kavramları

? Okuma Hesaplanıyor... Okuma: %0

Gidenler.Me | Her yol bir hikaye... » Programlama Dersleri

Yazar Hasan | 120 Okuma | 10-04-2026, 10:58 AM

Ders 2: Etiket, Element ve Öznitelik Kavramları

Neden?
Etiketlerin nasıl bir yapı oluşturduğunu bilmeden kodu ezberlemek sürdürülebilir değildir.

Ne öğreneceğiz?
Bu derste Etiket, element, kapanış etiketi ve öznitelik farkını öğreneceğiz.

Nasıl ilerleyeceğiz?
Önce kavramın amacını düşün. Ardından aşağıdaki örneği kendin yaz. Kodu kaydet, tarayıcıda aç ve küçük bir değişiklik yaparak sonucu gözlemle.

Öğrenme kuralı: Kodu yalnızca kopyalama. Her satır için “Bu satır neden burada?” ve “Bu satırı silersem ne değişir?” sorularını sor.

Derse başlamadan önce kendini yokla

Bu konuyu gerçek bir web sayfasında hangi ihtiyacı çözmek için kullanırım?
Örnekteki hangi HTML elementi içeriğin anlamını taşıyor?
Uygulamayı kendi fikrimle nasıl değiştirebilirim?

Ders sonunda kontrol

Kodu kendim, bakmadan tekrar yazabildim mi?
Tarayıcıda sonucu test ettim mi?
Karşılaştığım bir hatayı neden oluştuğunu açıklayarak düzelttim mi?

Ders hedefi
HTML etiketlerini, elementleri ve öznitelikleri birbirinden ayırabileceksiniz.

HTML içerikleri etiketler le işaretler. Çoğu etiketin açılış ve kapanış bölümü vardır:

PHP Kod:
<p>Bu bir paragraftır.</p> 

Burada <p> açılış etiketi, </p> kapanış etiketi, ikisiyle birlikte içerik ise elementtir. Bazı etiketler kapanış etiketi kullanmaz:

PHP Kod:
<img src="profil.jpg" alt="Profil fotoğrafı">
<br>
<hr> 

Öznitelikler element hakkında ek bilgi verir. Öznitelik açılış etiketinin içinde yazılır:

PHP Kod:
<a href="https://example.com" target="_blank">Siteyi aç</a> 

Bu örnekte href, bağlantının adresini; target, bağlantının nasıl açılacağını belirtir. Öznitelik değerlerini genellikle çift tırnak içinde yazmak iyi bir alışkanlıktır.

HTML elementleri iç içe yazılabilir. İç içe elementleri girintilemek kodu okumayı kolaylaştırır:

PHP Kod:
<div>
    <h2>Haber başlığı</h2>
    <p>Haber açıklaması burada yer alır.</p>
</div> 

Etiketlerin doğru sırayla kapanması na dikkat et. Yanlış kullanım şöyledir:

PHP Kod:
<strong><em>Yanlış kapanış</strong></em> 

Doğru kullanım şöyledir:

PHP Kod:
<strong><em>Doğru kapanış</em></strong> 

Konuyu Dinle

Okuma hızı:

Hazır. Konuyu dinlemek için Oynat'a basın.

Programlama Dersleri

Yazarımız Hasan hakkında: Adım Hasan, ama bir dönem MyBB kullananlar beni Yondaime nicki ile tanırdı. 2009 da başladı web maceram, MyBB, Wordpress, Matematik, Adalet, Bilgisayar Programcılığı, derken şimdide burada bir şeyler yapmaya çalışıyorum :)

Yazıya herhangi bir yorum yapılmadı

Hızlı Cevap

Güvenlik Kodu:
Lütfen, resmin üzerindeki harf ve rakamlardan oluşan Güvenlik Kodunu, aşağıdaki metin kutusuna giriniz.

(Büyük/Küçük harf duyarsız)

Konuyu Yazdır

Hoşgeldiniz...

Hoşgeldin, Ziyaretçi:
Sitemize üye iseniz buradan oturum açabilirsiniz :)
Hala üye değil misiniz? Ücretsiz üyelik hesabı alın!

Reklam

Kategoriler

Yazı Arşivi

Ekim 202615 yazı Eylül 202627 yazı Ağustos 202610 yazı Temmuz 20261 yazı Haziran 20262 yazı Ocak 20262 yazı Aralık 20252 yazı Kasım 20253 yazı Mayıs 20252 yazı Nisan 20257 yazı Mart 20253 yazı Şubat 20253 yazı Tüm arşiv →

Yasal Uyarı

Bu internet sitesi içeriğinde yer alan tüm yazılar Gidenler.Me’ye ait olup, 5846 sayılı Fikir ve Sanat Eserleri Kanunu ve 5237 sayılı Türk Ceza Kanunu kapsamında korunmaktadır. Bu hakları ihlal eden kişiler, 5846 sayılı Fikir ve Sanat eserleri Kanunu ve 5237 sayılı Türk Ceza Kanununda yer alan hukuki ve cezai yaptırımlara tabi olurlar. Gidenler.Me, ilgili yasal işlem başlatma hakkına sahiptir. Gidenler.Me Blog'da yer alan tüm yazılar/makaleler bilgi edinme amacı ile sınırlı olup Gidenler.Me'den izin alınmaksızın değiştirilemez, çoğaltılamaz, yayımlanamaz, dağıtılamaz, umuma iletilemez, başka bir lisana çevrilemez.