HTML Form Label
Html Form Label : Html form veri gönderme etiketinin başlığı niteliğinde kullanılmaktadır. Tam olarak kullanılma amacı form üzerindeki çeşitli input, textarea, radio, checkbox, submit vb veri girişi yapılan etiketler için başlık oluşturma gerektiğinde form label etiketi kullanılmaktadır. Label etiketi üzerine tıklanıldığı zaman ilgili veri girişi yapılan elemanın içine doğrudan yazılmaya hazır olarak fokuslanır.
Doğrudan tıklandığı zaman label içindeki for parametresine karşılığı gelen veri girişi etiketinin id bölümündeki isimle aynıysa o etikete focus olmaktadır. Bu da kullanıcıların form doldururken zorlanmaması veri giriş alanlarının ne olduğu hakkında doğrudan bilgi verme işlemi yapmaktadır. Kesinlikle Web tasarım yaparken düşünülmesi gereken form olaylarından birisidir.
Form Label Ne işe Yarar?
Label etiketi form içindeki veri girişi yapılan etiketlerin ne olduğunu tanımlamak için yerleştirilen kısa tanımlar yaptığınızda anlamlı duran etikettir. Bir özelliği daha vardır tıklandığında ilgili veri girişi elemanına fokus olmasıdır.
- Label bir form etiketi üyesidir.
- Form içinde kullanılmalıdır.
- Label etiketi for parametresi alarak veri girişinde bulunan id etiketiyle aynı olduğu taktirde veri girişi etiketine focus olmaktadır.
- İnsanlar formları konudan uzaklaşmadan ve zorlanmadan doldurabilir.
Form elemanlarının ne işe yaradıkları anlamını tanımlamak için kullanılmalıdır.
HTML Form Label Örnekleri
Form label örnekleri hakkında bir çok örnek tanımlamaları yapılabilir. Bu yazıda sizlere aşağıda sıraladığım veri girişi elemanları için örnekleme yapacağım ve aynı zamanda fotoğraflarını da sizlerle paylaşacağım.
- input
- textarea
- radio buton
- checkbox
Yukarıda yazmış olduğum form giriş elemanlarının label örneklerini aşağıda örneklerini başlıklar altında sizler için yapıyorum.
İnput Label Örneği
input label örneği ad soyad, telefon vb kısa veri girişlerinde kullanılmaktadır.
Örnek:
<label for="adsoyad">Ad Soyad :</label><br /> <input type="input" name="adsoyad" id="adsoyad" value="" />
Textarea Label Örneği
textarea label örneği genelde mesaj, adres vb uzun veri alımlarında kullanılır.
Örnek:
<label for="mesaj">Mesaj :</label> <br /> <textarea name="mesaj" id="mesaj"></textarea>
Radio Buton Label Örneği
radio buton label örneği yapım amacı tek seçmeli form ögeleri için geçerli olmasıdır.
Örnek:
<input type="radio" name="cinsiyet" id="erkek" value="erkek"> <label for="kadin">Kadın</label><br /> <input type="radio" name="cinsiyet" value="erkek"> <label for="erkek">Erkek</label>
Checkbox Label Örneği
checkbox label örneği çoktan seçmeli form veri girişi elemanlarında kullanılmaktadır.
Örnek:
<input type="checkbox" name="hobiler" id="hobi1" value="hobi1"><label for="hobi1">Hobi 1</label><br> <input type="checkbox" name="hobiler" id="hobi2" value="hobi2"><label for="hobi2">Hobi 2</label>
