Bu kılavuzda, web formlarında iki giriş alanı olan arama ve tel'in nasıl uygulanacağını göstereceğim. Bu giriş tipleri arama sorguları ve telefon numaraları için özel olarak tasarlanmış olup, size ve kullanıcılarınıza hayatı kolaylaştırabilecek bazı faydalı özellikler sunar. Bu inputları doğru bir şekilde nasıl kullanacağınızı ve size sağladıkları avantajları öğreneceksiniz.
En Önemli Bulgular
- Arama ve tel giriş alanları, formlara arama odaklı ve telefon tabanlı girişler eklemenin basit yollarını sunar.
- Arama işlevi birçok tarayıcıda desteklenir ve bazı kullanıcı dostu özelliklere sahiptir, tel ise özellikle telefon numaraları için uygundur.
- Her ikisi de özel doğrulama işlevlerine sahip değildir, ancak düzenli ifadelerle tamamlanabilir.
Giriş Alanı Türü "search"
İlk olarak, search için giriş alanını inceleyeceğiz. Normal bir metin girişi alanına benzer, ancak işlevselliğinde belirli uyumlamalar bulunur.
Giriş alanı genellikle basit bir metin girişi alanı olarak temsil edilir, örneğin Chrome'da girilen metni silmek için "X" simgesi gösterilir. Bu özellik, kullanıcıların hızlı bir şekilde girilen bir arama sorgusunu silip yeni bir giriş yapmasını sağlar.
Ayrıca, kullanıcıların bu alana ne gireceklerini gösteren bir yer tutucu ekleyebilirsiniz. Örneğin, "Arama kelimesi" gibi bir ipucu eklerseniz, bu metin yazılırken otomatik olarak gizlenir. Bu, kullanıcı yönlendirmeleri için netlik sağlar.
Bu gibi giriş alanı tipleri için doğrulama önceden belirlenmemiştir. Ancak özel gereksinimleriniz varsa, düzenli ifadeler (RegEx) kullanabilirsiniz.
Giriş Alanı Türü "tel"
Sonrasında telefon numaraları için tel giriş alanına bakacağız. HTML'deki yapı benzer olsa da, amacı farklıdır.
Tip tel ile tarayıcıya, kullanıcının bir telefon numarası girmesi gerektiğini bildirirsiniz. Mobil cihazlarda genellikle yalnızca sayısal klavye gösterilir, bu da girişi oldukça basitleştirir.
Normal metin giriş alanı ile büyük bir farkı yoktur. Burada da bir yer tutucu kullanabilir, önerilerde bulunabilir veya gerekirse uluslararası alan kodu formatını belirtebilirsiniz.
Bir diğer avantajı, ekran okuyucuların giriş alanlarının anlamını anlamasıdır. Tarayıcıya ve özellikle de engellilere net bir talimat verir, bu alanın telefon numarası girilmesi gerektiğini belirtir. Bu, web uygulamanızın erişilebilirliğini önemli ölçüde artırabilir.
Telefon Numaraları İçin Doğrulama
Kullanıcıların doğru bir telefon numarası girdiğinden emin olmak istiyorsanız, giriş için bir RegEx kullanmanızı öneririm. Ulusal veya uluslararası telefon numaralarını desteklemek isteyip istemediğinize bağlı olarak kolayca ayarlamalar yapabilirsiniz.
Alman telefon numaraları için bir RegEx iyi bir başlangıç olabilir. Uluslararası numaralar için karmaşıklaşır, çünkü farklı ülkelerin telefon numaraları için farklı formatlar vardır. İyi bir strateji, önce ülkeyi seçmek ve ardından seçilen ülke için özel bir doğrulama uygulamaktır.
Özet
Özetlemek gerekirse, search ve tel tipleri Web-Formlarda oldukça kolay bir şekilde uygulanabilir. Kapsamlı işlevler sunmasalar da, anlam ve kullanıcı dostuluğu ile etkileyicidirler. Bu tipleri uygulayarak web sitenizin kullanıcı deneyimini önemli ölçüde iyileştirebilirsiniz.
Sıkça Sorulan Sorular
search ve tel arasındaki başlıca farklar nelerdir?Anlamdaki başlıca fark, search'in arama terimleri için, tel'in ise telefon numaraları için tasarlanmış olmasıdır.
search ve tel tiplerinde özel doğrulama fonksiyonları mevcut mu?Hayır, her iki tipte de özel doğrulama fonksiyonları bulunmamakla beraber, düzenli ifadelerle tamamlanabilirler.
Bir giriş alanına yer tutucu nasıl eklenir?Bunu HTML'deki girişinize placeholder özelliğini ekleyerek kolayca yapabilirsiniz.
Bu tiplerin kullanıcı deneyimi açısından sağladığı avantajlar nelerdir?Mobil cihazlarda uygun giriş klavyelerini göstererek kullanıcı dostuluğunu artırırlar ve kullanıcılara hemen görsel ipuçları sağlarlar.
Uluslararası telefon numaralarını desteklemek istiyorsam nelere dikkat etmeliyim?Önce ülkeyi seçmek ve ardından o ülkenin spesifikasyonlarına göre telefon numarasını doğrulamak için bir alan oluşturmalısınız.
