🚀 HTML Attributes: Elementlerin Özellik Paneli

Elementlere Komut Vermek: Attributes

Selamlar. Etiketleri (tags) öğrendik, peki bu etiketleri nasıl özelleştiririz? Bir oyun motorunda bir 'Sprite' objesi oluşturduğunuzda, ona hangi görseli kullanacağını veya ekrandaki koordinatlarını bir Properties (Özellikler) paneli üzerinden söylersiniz. HTML'de bu işi Attributes (Nitelikler) yapar.

Attributes, her zaman açılış etiketinin içine yazılır ve standart bir sözdizimine (syntax) sahiptir: ad="değer".

En Çok Kullanılan Nitelikler

  • href (Hypertext Reference): <a> (link) etiketiyle kullanılır. Gidilecek adresin yolunu belirtir.
  • src (Source): <img> veya <script> etiketlerinde kullanılır. Dosyanın (resim, kod vs.) nerede olduğunu gösterir.
  • alt (Alternative Text): Eğer resim yüklenemezse görünecek olan ve ekran okuyucular için kritik olan metindir.
  • target="_blank": Linkin yeni bir sekmede açılmasını sağlar.

Biz OvidRacer projesinde araç görsellerini yüklerken src niteliğini çok dinamik kullanıyoruz. Eğer bir dosya yolu yanlışsa veya sunucu o an yavaşsa, alt metni kullanıcıya ne görmesi gerektiğini söyleyen can simididir. Sadece estetik değil, hata yönetimi için de bu nitelikler hayati önem taşır.

🚀 Sanal Kodlama Alanı Yükleniyor...

Dikkat Edilmesi Gerekenler

Nitelikleri yazarken tırnak işaretlerini (" ") kullanmak zorunlu değildir ama bir standarttır ve hataları önler. Ayrıca, bazı niteliklerin (örneğin required veya checked) bir değeri yoktur; sadece orada bulunmaları yeterlidir.

Bir sonraki derste, bu etiketleri başlıklar ve paragraflar olarak nasıl gruplandıracağımızı, yani metin içeriğini nasıl yapılandıracağımızı göreceğiz. Unutmayın, HTML bir dökümandır ve doğru nitelikler o dökümanı akıllı bir uygulamaya dönüştüren ilk adımdır.


Teknik İpucu: title niteliği, farenizi elementin üzerine getirdiğinizde çıkan küçük bir ipucu (tooltip) metni oluşturur. Kullanıcı deneyimi için ufak ama etkili bir dokunuştur.

Ovid Notu: ovidgame.com