Bu yazıyı okuyorsanız World Wide Web'i kullanıyorsunuzdur. Formlarınız farklı diller konuşan, insanlar ve farklı kültürel geçmişlere sahip kişiler. Formunuzu uluslararası hale getirme ve yerelleştirme için nasıl hazırlayacağınızı öğrenin.
Formunuzun farklı dillerde çalıştığından emin olma
Formunuzun farklı dillerde çalıştığından nasıl emin olabileceğinize bakalım.
Sitenizi yerelleştirmeye hazır hale getirmenin ilk adımı <html>
öğesinde lang
dil özelliğini tanımlamaktır.
Bu özellik, ekran okuyucuların doğru telaffuzu çağırmasını sağlar.
ve tanımlanan dil varsayılan tarayıcı dili değilse tarayıcıların sayfanın çevirisini sunmasına yardımcı olur.
<html lang="en-us">
lang
özelliği hakkında daha fazla bilgi edinin.
Bir formu Almancaya çevirdiğinizi varsayalım.
Arama motorlarının ve tarayıcıların çevrilmiş sürüm hakkında bilgi sahibi olmasını nasıl sağlayabilirsiniz?
Sitenizin <head>
bölümüne, alternatif sürümleri açıklayan <link>
öğeleri ekleyebilirsiniz.
<link rel="alternate" title="The form element"
href="https://example.com/en/form" hreflang="en">
<link rel="alternate" title="Das Formularelement"
href="https://example.com/de/form" hreflang="de">
Başka bir dil konuşan kullanıcıların formunuzu kullanmasına yardımcı olun
Formunuzu her dile çeviremezsiniz. ancak çeviri araçlarının sizin için çevirebilmesini sağlayabilirsiniz.
Çeviri araçlarının formunuzdaki tüm metni çevirdiğinden emin olmak için tüm metnin HTML'de tanımlandığından ve görünür olduğundan emin olun. Bazı araçlar JavaScript'te tanımlanan içerikle de çalışır, ancak uyumluluğu iyileştirmek için HTML'ye mümkün olduğunca çok metin eklemeye çalışın.
Formunuzun farklı yazma sistemleriyle çalıştığından emin olun.
Farklı dillerde farklı yazma sistemleri ve karakter kümeleri kullanılır. Bazı metinler soldan sağa, bazıları da sağdan sola yazılır.
Boşlukları yazı sistemlerinden bağımsız hale getirin
Formunuzun farklı yazma sistemlerinde çalıştığından emin olmak için CSS mantıksal özelliklerini kullanabilirsiniz.
Girişin tüm kenarlarında kenarlık kalınlığı 1px
kenarlığın 4px
kalın olduğu sol taraf dışında.
Şimdi CodePen'i düzenleyin ve yazma sistemini sağdan sola olacak şekilde değiştirin
<main>
öğesine dir="rtl"
ekleyerek
Kalın kenarlık artık sağ taraftadır. Bunun nedeni, sınırı mantıksal bir özellik kullanarak tanımlamamızdır.
input {
border-inline-start-width: 4px;
}
Mantıksal özellikler hakkında daha fazla bilgi edinin.
Formunuzun farklı ad biçimlerini işleyebildiğinden emin olun
Kullanıcının, adını doldurması gereken bir formunuz olduğunu varsayalım. Alanı formunuza nasıl eklersiniz?
Ad ve soyadı için birer alan ekleyebilirsiniz. Ancak, adlar birbirinden farklıdır. soyadlarını bile bilmezler. Peki, soyadını soyadı alanına sahip mi?
Adların girilmesini hızlı ve kolay bir hale getirmek ve ne olursa olsun herkesin adını girebilmesini sağlamak biçiminde olmalıdır. Mümkün olduğunda adlar için tek bir form alanı kullanın.
Kişisel adlar hakkında daha fazla bilgi edinin.
Latin alfabesinde olmayan karakterler içeren bir adınız varsa
Adınızın bazı formlarda invalid
olarak bildirilmesi sorunuyla karşılaşmış olabilirsiniz. Google Takvim widget'ını
formlar oluşturun, olası tüm karakterlere izin verdiğinizden emin olun ve bir adın yalnızca
birkaç karakter var.
Çeşitli adres biçimlerine izin verin
Google'ın genel merkezi 1600 Amphitheatre Parkway, Mountain View, CA 94043, ABD adresindedir.
Bu adres; sokak numarası, sokak, şehir, eyalet, posta kodu ve ülke bilgilerini içerir. Ülkenizde, adres biçimi tamamen farklı olabilir. Formunuza herkesin adresini girebilmesini nasıl sağlayabilirsiniz?
Bunlardan biri genel girişler kullanmaktır.
Diğer ortak çalışma yolları hakkında daha fazla bilgi uluslararası adres alanlarına bakın.
Öğrendiklerinizi sınayın
Uluslararasılaştırma ve yerelleştirme bilginizi test edin
Ekran okuyucular için doğru telaffuzu nasıl çağırırsınız?
lang
özelliğiyle.language
özelliğiyle.hreflang
özelliğiyle.Web sitenizdeki yazı sistemini nasıl değiştirebilirsiniz?
<link>
öğesi kullanılıyor.dir
özelliğiyle.direction
özelliğiyle.Kaynaklar
- W3C Uluslararasılaştırma makaleleri ve eğiticileri
- Frank'in Posta Adresleri Kompülsif Kılavuzu, 200'den fazla ülkedeki adres biçimleri için yararlı bağlantılar ve kapsamlı bilgiler sağlar.
- DataHub.io, ülke kodlarını ve adları indirmek için kullanılan bir araçtır.