Metin Kutuları

Bir metin kutusuyla, kullanıcılar metin veya sayısal değer görüntüleyebilir, girebilir veya düzenleyebilir.

Tipik bir metin kutusu ve etiketekran görüntüsü

Tipik bir metin kutusu.

Doğru kontrol bu mu?

Karar vermek için şu soruları göz önünde bulundurun:

• Tüm geçerli değerleri verimli bir şekilde listelemek pratik mi? Bu durumda, tek seçimli liste , açılan liste, düzenlenebilir açılan liste veya kaydırıcı.
• Geçerli veriler tamamen kısıtlanmamış mı? Veya geçerli veriler yalnızca biçime göre kısıtlanmış mı (kısıtlanmış uzunluk veya karakter türleri)? Öyleyse, bir metin kutusu kullanın.
• Değer, özel bir ortak denetime sahip bir veri türünü temsil eder mi? Örnek olarak tarih, saat, IPv4 veya IPv6 adresi verilebilir. Öyleyse, metin kutusu yerine tarih denetimi gibi uygun denetimi kullanın.
• Veriler sayısalsa:
  • Kullanıcılar ayarı göreli miktar olarak algılıyor mu? Öyleyse kaydırıcıyı kullanın.
  • Kullanıcı, değişiklikleri ayarlamanın etkisiyle ilgili anında geri bildirimden yararlanabilir mi? Öyleyse, metin kutusuyla birlikte kaydırıcıyı da kullanabilirsiniz. Örneğin, kullanıcılar ton, doygunluk veya parlaklık değerlerindeki değişikliklerin etkisini hemen görebilmeleri için kaydırıcı kullanarak kolayca renk seçebilir.

Tasarım kavramları

Metin kutuları çok esnek olma avantajına sahip olsa da, en az kısıtlamaya sahip olmanın dezavantajı vardır. Düzenlenebilir bir metin kutusundaki tek kısıtlamalar şunlardır:

• İsteğe bağlı olarak en fazla karakter sayısını ayarlayabilirsiniz.
• İsteğe bağlı olarak girişi yalnızca sayısal karakterlerle (0 9) kısıtlayabilirsiniz.
• döndürme denetimi kullanıyorsanız, döndürme denetimi seçeneklerini geçerli değerlerle sınırlayabilirsiniz.

Metin kutularının uzunluğu ve isteğe bağlı bir döndürme denetiminin varlığı dışında, geçerli değerleri veya biçimlerini öneren görsel ipuçları yoktur. Bu, bu bilgileri kullanıcılara iletmek için etiketlere güvenmek anlamına gelir. Kullanıcılar geçerli olmayan bir metin girerse, hatayı bir hata iletisiyle işlemeniz gerekir.

Genel bir kural olarak, en kısıtlanmış denetimi kullanmanız gerekir. Son çare olarak metin kutuları gibi kısıtlanmamış denetimleri kullanın. Bu, kısıtlamaları göz önünde bulundurduğunuz zaman, küresel kullanıcıların gereksinimlerini göz önünde bulundurun. Örneğin, Abd Posta Kodları ile kısıtlanmış bir denetim genelleştirilmez, ancak herhangi bir posta kodu biçimini kabul eden kısıtlanmamış bir metin kutusudur.

Kullanım desenleri

Metin kutusu, çeşitli olası kullanımları olan esnek bir denetimdir.

Etiket	Değer
Veri girişi Kısa dizeleri girmek veya düzenlemek için kullanılan tek satırlı, kısıtlanmamış bir metin kutusu.	bir metin kutusunun ekran görüntüsü Tek satırlı, kısıtlanmamış bir metin kutusu.
Biçimlendirilmiş veri girişi Belirli bir biçime sahip verileri girmek için kullanılan kısa, sabit boyutlu, tek satırlı metin kutuları kümesi.	Biçimlendirilmiş veri girişi için kullanılan metin kutusu. Not:otomatik çıkış özelliği, giriş odağını otomatik olarak bir metin kutusundan diğerine ilerler. Bu yaklaşımın bir dezavantajı, verilerin tek bir birim olarak kopyalanamaz veya yapıştırılamaz olmasıdır.
yardımlı veri girişi Dizeleri girmek veya düzenlemek için kullanılan ve kullanıcıların geçerli değerleri seçmesine yardımcı olan bir komut düğmesiyle birlikte tek satırlı, kısıtlanmamış bir metin kutusu.	metin kutusunun ekran görüntüsü Bu örnekte Gözat komutu kullanıcıların geçerli değerleri seçmesine yardımcı olur.
metin girişi Uzun dizeleri girmek veya düzenlemek için kullanılan çok satırlı, kısıtlanmamış bir metin kutusu.	Çok satırlı, kısıtlanmamış bir metin kutusu.
sayısal giriş Fare tabanlı girişi kolaylaştırmak için isteğe bağlı döndürme denetimi, sayıları girmek veya düzenlemek için kullanılan tek satırlı, yalnızca sayısal metin kutusu.	Sayısal giriş için kullanılan metin kutusu. Bir metin kutusu ile ilişkili döndürme denetiminin birleşimi, döndürme kutusu olarak adlandırılır.
parola ve PIN girişi Parolaları ve PIN'leri güvenli bir şekilde girmek için kullanılan tek satırlı, kısıtlanmamış bir metin kutusu.	Parola girmek için kullanılan metin kutusu.
Veri çıkışı Kısa dizeleri görüntülemek için kullanılan, her zaman kenarlıksız olarak görüntülenen tek satırlı, salt okunur bir metin kutusu.	Statik metinden farklı olarak, metin kutusu kullanılarak görüntülenen veriler kaydırılabilir (veriler denetimden daha genişse kullanışlıdır), seçili ve kopyalanabilir. yolunu gösteren metin kutusunun ekran görüntüsü Verileri görüntülemek için kullanılan tek satırlı, salt okunur bir metin kutusu.
metin çıktısı Uzun dizeleri görüntülemek için kullanılan çok satırlı, salt okunur metin kutusu.	Verileri görüntülemek için kullanılan salt okunur metin kutusu.

Yönerge -leri

Genel

• Metin kutusunu devre dışı bırakırken ilişkili etiketleri, yönerge etiketlerini, döndürme denetimlerini ve komut düğmelerini de devre dışı bırakın.

• Kullanıcılarıntekrar tekrar kullanılma olasılığı olan verileri girmelerine yardımcı olmak için otomatik tamamlama kullanın. Örnek olarak kullanıcı adları, adresler ve dosya adları verilebilir. Ancak parolalar, PIN'ler, kredi kartı numaraları veya tıbbi bilgiler gibi hassas bilgiler içerebilen metin kutuları için otomatik tamamlama özelliğini kullanmayın.

• Kullanıcıların gereksiz yere kaydırma yapmasını sağlama. Verilerin metin kutusundan büyük olmasını bekliyorsanız ve düzene zarar vermeden metin kutusunu kolayca büyütebiliyorsanız, kaydırma gereksinimini ortadan kaldırmak için kutuyu boyutlandırın.

  yanlış :

  

  Bu örnekte, metin kutusunun verilerini işlemek için çok daha uzun bir süre yapılması gerekir.

• Kaydırma çubukları:

  • Çok satırlı metin kutularına yatay kaydırma çubukları koymayın. Bunun yerine dikey kaydırma ve çizgi kaydırma kullanın.
  • Tek satırlı metin kutularına kaydırma çubuğu koymayın.

• Sayısal giriş için bir döndürme denetimi kullanabilirsiniz. Metin girişi için bunun yerine bir açılan liste veya düzenlenebilir açılan liste kullanın.

• Biçimlendirilmiş veri girişi dışında otomatik çıkış özelliğini kullanmayın. Odağın otomatik olarak değişmesi kullanıcıları şaşırtabilir.

Düzenlenebilir metin kutuları

• Giriş metninin uzunluğunu sınırlayabilirsiniz. Örneğin, geçerli giriş 0 ile 999 arasında bir sayıysa, üç karakterle sınırlı bir sayısal metin kutusu kullanın. Biçimlendirilmiş veri girişi kullanan metin kutularının tüm bölümlerinin kısa, sabit uzunlukta olması gerekir.

• Veri biçimleriyle esnek olun. Kullanıcıların çok çeşitli biçimler kullanarak metin girme olasılığı varsa, en yaygın olanları işlemeyi deneyin. Örneğin, isteğe bağlı boşluklar ve noktalama işaretleri ile birçok ad, sayı ve tanımlayıcı girilebilir ve büyük harf kullanımı genellikle önemli değildir.

• Olası biçimleri işleyemiyorsanız, biçimlendirilmiş veri girişi kullanarak belirli bir biçim gerektirebilir veya etiketteki geçerli biçimleri belirtebilirsiniz.

  Kabul Edilebilir:

  Sayısal girişekran görüntüsü

  Bu örnekte, metin kutusu belirli bir biçimde giriş gerektirir.

  Daha İyi:

  Biçimlendirilmiş veri girişi metin kutusunun

  Bu örnekte, biçimlendirilmiş veri girişi deseni belirli bir biçim gerektirmek için kullanılır.

  En İyisi:

  Kısıtlanmamış metin kutusunun ekran görüntüsünü

  Bu örnekte, metin kutusu olası tüm biçimleri işler.

• Maksimum giriş uzunluğunu seçerken biçimlendirme esnekliğini göz önünde bulundurun. Örneğin, geçerli bir kredi kartı numarası en fazla 19 karakter kullanabilir, bu nedenle uzunluğu daha kısa bir değerle sınırlandırmak, uzun biçimleri kullanarak sayı girmeyi zorlaştırabilir.

• Kullanıcıların uzun ve karmaşık verileri yapıştırma olasılığı daha yüksekse, biçimlendirilmiş veri girişi desenini kullanmayın. Bunun yerine, kullanıcıların verileri yazma olasılığının daha yüksek olduğu durumlar için biçimlendirilmiş veri giriş desenini ayırın.

  etiketli bir metin kutusunun ekran görüntüsünü

  Bu örnekte, kullanıcıların IPv6 adreslerini yapıştırabilmesi için biçimlendirilmiş veri girişi deseni kullanılmaz.

• Kullanıcıların değerin tamamını yeniden yazma olasılığı daha yüksekse, giriş odağındaki tüm metni seçin. Kullanıcıların düzenleme olasılığı daha yüksekse, şapka işaretini metnin sonuna yerleştirin.

  Parola metin kutusunun ekran görüntüsünü

  Bu örnekte, kullanıcıların değiştirme olasılığı düzenlemeye kıyasla daha yüksektir, bu nedenle giriş odağında değerin tamamı seçilir.

  

  Bu örnekte, kullanıcıların anahtar sözcük ekleme olasılığı metnin yerine daha yüksektir, bu nedenle şapka işareti metnin sonuna yerleştirilir.

• Yeni satır karakterleri geçerli bir girişse her zaman çok satırlı metin kutusu kullanın.

• Metin kutusu bir dosya veya yol içinse, her zaman bir Gözat düğmesi sağlayın.

Sayısal metin kutuları

• En uygun birimi seçin ve birimleri etiketle. Örneğin, litre yerine mililitre (veya tam tersi), doğrudan değerler yerine yüzdeler (veya tam tersi) kullanmayı düşünün.

  Doğru:

  Birim

  Bu örnekte, birim etiketlenmiştir, ancak kullanıcıların ondalık sayılar girmesini gerektirir.

  Daha İyi:

  Birim

  Bu örnekte, metin kutusu daha kullanışlı bir birim kullanır.

• Yararlı olduğunda bir döndürme denetimi kullanın. Ancak, bazen kullanıcıların çok sayıda büyük sayı girmesi gerektiğinde olduğu gibi döndürme denetimleri pratik değildir. Aşağıdaki durumlarda döndürme denetimlerini kullanın:

  • Giriş genellikle 100'den küçük bir sayı olabilir.
  • Kullanıcılar büyük olasılıkla mevcut bir sayıda küçük bir değişiklik yapabilir.
  • Kullanıcıların fare kullanma olasılığı klavyeden daha yüksektir.

• Sayısal metni her zaman sağa hizalama:

  • Birden fazla sayısal metin kutusu vardır.
  • Metin kutuları dikey olarak hizalanır.
  • Kullanıcıların değerleri eklemesi veya karşılaştırması olasıdır.

  Doğru:

  

  Bu örnekte, değerleri karşılaştırmayı kolaylaştırmak için sayısal metin sağa hizalanır.

  yanlış :

  rgb değerleri için metin kutularının ekran görüntüsünü

  Bu örnekte, sayısal metin yanlış sola hizalanmış.

• Parasal değerleri her zaman sağa hizalayın.

• Bu özel anlamlar uygulamanız tarafından dahili olarak kullanılıyor olsa bilebelirli sayısal değerlere özel anlamlar atamayın. Bunun yerine, açık bir kullanıcı seçimi için onay kutularını veya radyo düğmelerini kullanın.

  yanlış :

  Etiketin devre dışı bırakmak için -1 kullanın

  Bu örnekte, -1 değerinin özel bir anlamı vardır.

  Doğru:

  Onay kutusu etiketinin

  Bu örnekte, onay kutusu seçeneği açık hale getirir.

Parola ve PIN girişi

• Kendi parolanızı oluşturmak yerine her zaman parola ortak denetimini kullanın. Parolaların ve PIN'lerin güvenli bir şekilde işlenmesi için özel işlem gerekir.

Daha fazla yönerge ve örnek için bkz. balonlar .

Metin çıktısı

• Büyük, çok satırlı salt okunur metinler için beyaz arka plan sistemi rengini kullanmayı göz önünde bulundurun. Beyaz arka plan, metnin okunmasını kolaylaştırır. Gri arka plandaki çok sayıda metin okumayı caydırır.

Arka plan renkleri hakkında daha fazla bilgi için bkz. Yazı Tipleri.

Veri çıkışı

• Tek satırlı, salt okunur metin kutuları için kenarlık kullanmayın. Kenarlık, metnin düzenlenebilir olduğuna dair görsel bir ipucudur.
• Tek satırlı, salt okunur metin kutularını devre dışı bırakma. Bu, kullanıcıların metni seçip panoya kopyalamasını engeller. Ayrıca, sınırların boyutunu aşarsa kullanıcıların verileri kaydırmasını engeller.
• Kullanıcının metni kaydırması veya kopyalaması gerekmediği sürece tek satırlı, salt okunur metin kutusunda sekme durağı ayarlamayın.

Giriş doğrulama ve hata işleme

Metin kutuları genellikle yalnızca geçerli girişi kabul etmek için kısıtlanmadığından, girişi doğrulamanız ve sorunları işlemeniz gerekebilir. Çeşitli giriş sorunlarını aşağıdaki gibi doğrulayın:

• Kullanıcı geçerli olmayan bir karakter girerse, karakteri yoksayın ve geçerli karakterleri açıklayan bir giriş sorunu balonu görüntüleyin.

  Ürün anahtarı metin kutusunun

  Bu örnekte, balon yanlış bir giriş karakteri bildiriyor.

• Giriş verilerinin geçerli olmayan bir değeri veya biçimi varsa, metin kutusu giriş odağını kaybettiğinde bir giriş sorunu balonu görüntüleyin.

• Giriş verileri penceredeki diğer denetimlerle tutarsızsa, girişin tamamı tamamlandığında , örneğin kullanıcılar kalıcı bir iletişim kutusu için Tamam'a tıkladığında bir hata iletisi verin.

Kullanıcılar hataları kolayca düzeltemediği sürece geçersiz giriş verilerini temizlemeyin. Bunun yapılması, kullanıcıların baştan başlamadan hataları düzeltmesine olanak tanır. Örneğin, kullanıcılar bunları kolayca düzeltemediği için yanlış parolaları ve PIN'leri temizlemeniz gerekir.

Diğer yönergeler ve örnekler için bkz. Hata İletileri ve balonlar .

Ister

İstem, metin kutusunun içine varsayılan değeri olarak yerleştirilmiş bir etiket veya kısa yönergedir. Statik metinden farklı olarak, kullanıcılar metin kutusuna bir şey yazdığında veya giriş odağı aldığında istemler ekrandan kaybolur.

etiketli istem metin kutusunun

Tipik bir istem.

Aşağıdaki durumlarda istem kullanın:

• Ekran alanı, araç çubuğunda olduğu gibi etiket veya yönerge kullanmak istenmeyen bir özelliktir.
• İstem öncelikli olarak metin kutusunun amacını küçük bir şekilde tanımlamaya yöneliktir. Kullanıcının metin kutusunu kullanırken görmesi gereken önemli bilgiler olmamalıdır.

Yalnızca kullanıcıları bir şey yazmaya veya düğmelere tıklamaya yönlendirmek için istemleri kullanmayın. Örneğin, Dosya adı girin yazan bir komut istemi metni yazmayın ve gönder'e tıklayın.

İstemler kullanılırken:

• İstem metnini italik gri ve gerçek giriş metnini normal siyah olarak çizin. İstem metni gerçek metinle karıştırılmamalıdır.
• İstem metnini kısa tutun. Tümceler yerine parçaları kullanabilirsiniz.
• Tümce stili büyük harfe çevirmeyi kullanın.
• Bitiş noktalama işaretlerini veya üç noktalamayı kullanmayın.
• İstem metni düzenlenebilir olmamalıdır ve kullanıcılar metin kutusuna tıkladıktan veya metin kutusuna sekmeyle girdikten sonra kaybolmalıdır.
  • Özel Durum: Metin kutusunun varsayılan giriş odağı varsa, komut istemi görüntülenir ve kullanıcı yazmaya başladığında kaybolur.
• Metin kutusu giriş odağını kaybettiğinde hala boşsa istem metni geri yüklenir.

Önerilen boyutlandırma ve aralık

tek satırlı ve iki satırlı metin kutularının

Metin kutuları için önerilen boyutlandırma ve aralık.

Metin kutusunun genişliği, beklenen giriş boyutunun görsel bir ipucudur. Metin kutularını boyutlandırırken:

• En uzun geçerli veriler için uygun bir genişlik seçin. Çoğu durumda, kullanıcıların girecekleri veya görüntüleydikleri en uzun olası dizeyi kaydırmaları gerekmez.
• Yerelleştirilecek tüm metinler (sayı değil) için ek yüzde 30 (daha kısa metinler için yüzde 200'e kadar) ekleyin.
• Beklenen girişin belirli bir boyutu yoksa, penceredeki diğer metin kutuları veya denetimlerle tutarlı bir genişlik seçin.
• Çok satırlı metin kutularını, tam sayı metin satırlarını görüntülemek için boyutlandırın.

Etiket

Metin kutusu etiketleri

• Tüm metin kutuları etiketlere ihtiyaç duyar. Etiketi cümle olarak değil, iki nokta üst üste ile biten ve statikmetin kullanarak bir sözcük veya tümcecik olarak yazın.

  Özel Durumları:

  • Alanın premium olduğu yerde bulunan istemlerin bulunduğu metin kutuları.

  • Etiketleme için, biçimlendirilmiş veri girişi için kullanılan bir metin kutusu grubu tek bir metin kutusu olarak kabul edilmelidir.

  • Metin kutusu bir radyo düğmesine veya onay kutusuna bağlıysa ve etiketi iki nokta üst üste ile bitiyorsa, metin kutusuna başka bir etiket koymayın.

  • Ana yönergeyi yeniden ifade eden denetim etiketlerini atla. Bu durumda, ana yönerge iki nokta üst üste (soru değilse) ve erişim anahtarını alır.

    Kabul Edilebilir:

    

    Bu örnekte, metin kutusu etiketi yalnızca ana yönergenin yeniden ifade edilmesidir.

    Daha İyi:

    Yalnızca ana yönerge

    Bu örnekte, yedekli etiket kaldırılır, bu nedenle ana yönerge iki nokta üst üste ve erişim anahtarını alır.

• Benzersiz bir erişim anahtarı atayın. Erişim tuşu atama yönergeleri için bkz. klavye .

• Tümce stili büyük harfe çevirmeyi kullanın.

• Etiketi metin kutusunun soluna veya üstüne getirin ve etiketi metin kutusunun sol kenarıyla hizalayın. Etiket sol taraftaysa, etiket metnini metin kutusu metniyle dikey olarak hizalayın.

  Doğru:

  Metin kutusunun üzerine sola hizalanmış etiketin ekran görüntüsü

  Metin kutusunun solunda metin hizalı etiketin ekran görüntüsünü

  Bu örneklerde, üstteki etiket metin kutusunun sol kenarıyla, soldaki etiket ise metin kutusundaki metinle hizalanır.

  yanlış :

  

  Metin kutusunun sol üst hizalı etiketinin ekran görüntüsünü

  Bu yanlış örneklerde, üstteki etiket metin kutusundaki metinle, soldaki etiket ise metin kutusunun üst kısmıyla hizalanır.

• Etiket sonrasında ayraç içinde birimleri (örneğin, saniyeler veya bağlantılar) belirtebilirsiniz.

• Bir metin kutusu rastgele olarak en fazla karakter sayısını kabul ederse, etiketteki en fazla girişi belirtebilirsiniz. Metin kutusu genişliği de en büyük boyutu önermelidir.

  Parola metin kutusu

  Bu örnekte, etiket en fazla karakter sayısını verir.

• Metin kutusunun (veya birim etiketinin) içeriğini tümcenin parçası yapmayın, çünkü bu yerelleştirilebilir değildir.

• Metin kutusu birden çok öğe girmek için kullanılabiliyorsa, etiketteki öğelerin nasıl ayrılabileceğini açıkça belirtin.

  Etiket ayrı adlarının noktalı virgülleekran görüntüsü

  Bu örnekte, öğe ayırıcısı etikette verilmiştir.

• Gerekli girişi gösterme yönergeleri için bkz. İletişim Kutuları'nda gerekli giriş.

Yönerge etiketleri

• Bir metin kutusu hakkında yönerge metni eklemeniz gerekiyorsa, bunu etiketin üzerine ekleyin. Noktalama işaretlerini sona erdirmek için tümceleri kullanın.

• Tümce stili büyük harfe çevirmeyi kullanın.

• Yararlı olan ancak gerekli olmayan ek bilgiler kısa tutulmalıdır. Bu bilgileri etiket ve iki nokta üst üste arasına parantez içinde veya metin kutusunun altına parantez olmadan yerleştirin.

  Metin kutusu

  Bu örnekte, metin kutusunun altına ek bilgiler yerleştirilir.

İstem etiketleri

• İstem metnini kısa tutun. Tümceler yerine parçaları kullanabilirsiniz.
• Tümce stili büyük harfe çevirmeyi kullanın.
• Bitiş noktalama işaretlerini veya üç noktalamayı kullanmayın.
• İstem, kullanıcıları metin kutusunun yanındaki bir düğmeyle işlem yapılacak bilgileri girmeye yönlendirirse, düğmeyi metin kutusunun yanına yerleştirmeniz yeterlidir. Kullanıcıları düğmeye tıklamaya yönlendirmek için istem kullanmayın (örneğin, Bir dosyayı sürükleyin ve gönder'e tıklayın yazan bir komut istemi metni yazmayın).

Belge

Metin kutularına başvururken:

• Yazma veya yapıştırma gerektiren kullanıcı etkileşimlerine başvurmak için türü kullanın; aksi takdirde, kullanıcılar bir listeden değer seçme veya Gözat düğmesi kullanma gibi başka yöntemler kullanarak metin kutusuna bilgi yerleştirebiliyorsa enter komutunu kullanın.

• Salt okunur metin kutusundaki bir girdiye başvurmak için seçme özelliğini kullanın.

• Büyük harfe çevirme dahil olmak üzere tam etiket metnini kullanın ve sözcük kutusunu ekleyin. Erişim anahtarı alt çizgisini veya iki nokta üst üste eklemeyin. Metin kutusuna metin kutusu veya alan olarak başvurmayın.

• Mümkün olduğunda, kalın metin kullanarak etiketi biçimlendirin. Aksi takdirde, etiketi yalnızca karışıklığı önlemek için gerekiyorsa tırnak içine koyun.

  Örnek: parolanızı Parola kutusuna yazın ve ardından Tamam'ıtıklayın.

• Metin kutusu belirli bir biçim gerektiriyorsa, yalnızca en yaygın kullanılan kabul edilebilir biçimi belgele. Kullanıcıların kendi başlarına başka biçimler keşfetmesine izin verin. Veri biçimlerinde esnek olmak istiyorsunuz, ancak bunu yapmak karmaşık belgelere neden olmamalıdır.

  Doğru:

  1234-56-7890 biçimini kullanarak parçanın seri numarasını girin.

  yanlış :

  Aşağıdaki biçimlerden birini kullanarak parçanın seri numarasını girin:

  1234567890

  1234-56-7890

  1234 56 7890