ALT Özelliği
altÖzelliği, (yani, bir etiket grubu tanımlanmıştır img, areave opsiyonel olarak, inputve applet) nesne için bir metin karşılığı girmesini sağlamak için.
Bir metin eşdeğeri, aşağıdaki yaygın durumlarda web sitenize ve ziyaretçilerine aşağıdaki faydaları sağlar:
- günümüzde, Web tarayıcıları çok farklı kapasitelere sahip çok çeşitli platformlarda mevcuttur; bazıları resimleri hiç görüntüleyemez veya yalnızca kısıtlı bir resim grubu grubunu görüntüleyemez; bazıları görüntüleri yüklemeyecek şekilde yapılandırılabilir. Kodunuzun resimlerinde alt özniteliği ayarlanmışsa, bu tarayıcıların çoğu, resimler yerine verdiğiniz açıklamayı görüntüler.
- ziyaretçilerinizden bazıları kör, renk körü, az gören olsun, görüntüleri göremez; alt özniteliği, sayfanızdakiler hakkında iyi bir fikir sahibi olmak için ona güvenebilecek kişiler için çok yararlıdır.
- arama motoru botları yukarıdaki iki kategoriye aittir: Web sitenizin hak ettiği gibi dizine eklenmesini istiyorsanız, sayfalarınızın önemli bölümlerini gözden kaçırmamalarını sağlamak için alt özelliğini kullanın.
Başlık Özniteliği
Bu tekniğin amacı, kullanıcılara bir titleöznitelikte yardım bilgilerini sağlayarak formlara veri girerken bağlama duyarlı yardım sağlamaktır . Yardım, format bilgilerini veya girdi örneklerini içerebilir.
Örnek 1: Bir
aramanın kapsamını sınırlayan bir açılır menü Bir arama formu, aramanın kapsamını sınırlamak için bir açılır menü kullanır. Açılır menü, arama terimini girmek için kullanılan metin alanının hemen yanındadır. Arama alanı ve açılır menü arasındaki ilişki, görünür bir etiket için yer olmayan görsel tasarımı görebilen kullanıcılar için açıktır. titleNitelik tanımlamak için kullanılan selectmenü. titleNitelik ekran okuyucular tarafından konuşulan veya ekran büyüteçlerini kullanan insanlar için bir araç ipucu olarak görüntülenebilir.
<label for="searchTerm">Search for:</label>
<input id="searchTerm" type="text" size="30" value="" name="searchTerm">
<select title="Search in" id="scope">
...
</select>
Örnek 2: Bir telefon numarası için giriş alanları
Bir Web sayfası, alan kodu, değişim ve son dört rakam için üç alanla birlikte Amerika Birleşik Devletleri'nde bir telefon numarası girmek için kontroller içerir.
<fieldset>
<legend>Phone number</legend>
<input id="areaCode" name="areaCode" title="Area Code" type="text" size="3" value="" >
<input id="exchange" name="exchange" title="First three digits of phone number" type="text" size="3" value="" >
<input id="lastDigits" name="lastDigits" title="Last four digits of phone number" type="text" size="4" value="" >
</fieldset>
Örnek 3: Bir Arama İşlevi
Bir Web sayfası, kullanıcının arama terimlerini girebileceği bir metin alanı ve aramayı gerçekleştirmek için "Ara" etiketli bir düğme içerir. titleNitelik formu kontrolünü tanımlamak için kullanılır ve arama terimi girmiş olması gereken yerde bir metin alanı olduğunu kullanıcıya açıkça belirtecek şekilde düğme metin alanına sonra hakkını konumlandırılmıştır.
<input type="text" title="Type search term here"/> <input type="submit" value="Search"/>
Örnek 4: Form kontrollerinin
bir veri tablosu Form kontrollerinin bir veri tablosunun her bir kontrolü o hücre için sütun ve satır başlıkları ile ilişkilendirmesi gerekir. Başlık (veya ekran dışı LABEL) olmadan, görsel olmayan kullanıcıların formda sekme yaparken yardımcı teknolojilerini kullanarak karşılık gelen satır / sütun başlık değerlerini duraklatması ve sorgulaması zordur.
Örneğin, bir anket formunun ilk satırında dört sütun başlığı vardır: Soru, Katılıyorum, Kararsızım, Katılmıyorum. Takip eden her satır, her hücrede üç sütundaki cevap seçeneğine karşılık gelen bir soru ve bir radyo düğmesi içerir. Her radyo düğmesinin başlık özniteliği, yanıt seçeneğinin (sütun başlığı) ve sorunun metninin (satır başlığı) ayırıcı olarak bir tire veya iki nokta üst üste ile birleştirilmesidir.
Img Öğesi
MDN'de belirtilen izin verilen öznitelikler .
altcrossorigindecodingheightimportance (deneysel api)intrinsicsize (deneysel api)ismapreferrerpolicy (deneysel api)srcsrcsetwidthusemap
Gördüğünüz gibi öğenin titleiçinde özniteliğe izin verilmiyor img. altÖzniteliği kullanırdım ve gerekirse öznitelik :hoveryerine CSS (Örnek: sözde sınıf ) kullanırdım title.