หากคุณอ่านอยู่ แสดงว่าคุณใช้เวิลด์ไวด์เว็บ ผู้คนที่พูดภาษาต่างๆ อาจใช้แบบฟอร์มของคุณ ผู้คนจากประเทศต่างๆ และภูมิหลังทางวัฒนธรรมที่แตกต่างกัน ดูวิธีเตรียมแบบฟอร์มสำหรับการปรับให้เป็นสากลและการแปล
ตรวจสอบว่าแบบฟอร์มใช้งานได้ในหลายภาษา
มาดูกันว่าคุณจะตรวจสอบว่าแบบฟอร์มของคุณทำงานกับหลายภาษาได้อย่างไร
ขั้นตอนแรกในการทำให้เว็บไซต์พร้อมแปลให้เหมาะกับท้องถิ่นคือการกำหนดแอตทริบิวต์ภาษา lang
ในองค์ประกอบ <html>
แอตทริบิวต์นี้ช่วยให้โปรแกรมอ่านหน้าจอเรียกใช้การออกเสียงที่ถูกต้อง
และช่วยให้เบราว์เซอร์เสนอการแปลหน้าเว็บในกรณีที่ภาษาที่กำหนดไว้ไม่ใช่ภาษาเริ่มต้นของเบราว์เซอร์
<html lang="en-us">
ดูข้อมูลเพิ่มเติมเกี่ยวกับแอตทริบิวต์ lang
สมมติว่าคุณแปลแบบฟอร์มเป็นภาษาเยอรมัน
คุณจะแน่ใจได้อย่างไรว่าเครื่องมือค้นหาและเบราว์เซอร์รู้จักเวอร์ชันที่แปลแล้ว
คุณเพิ่มองค์ประกอบ <link>
ใน <head>
ของเว็บไซต์เพื่ออธิบายเวอร์ชันทางเลือกได้
<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">
ช่วยให้ผู้ใช้ที่พูดภาษาอื่นใช้แบบฟอร์มของคุณได้
คุณไม่สามารถแปลแบบฟอร์มของคุณในทุกภาษา แต่คุณมั่นใจได้ว่าเครื่องมือแปลภาษา จะแปลเนื้อหานั้นให้คุณได้
เพื่อให้เครื่องมือแปลภาษาแปลข้อความทั้งหมดในแบบฟอร์ม ตรวจดูให้แน่ใจว่าข้อความทั้งหมดกำหนดไว้ใน HTML และมองเห็นได้ เครื่องมือบางอย่างยังทำงานกับเนื้อหาที่กำหนดไว้ใน JavaScript ได้ด้วย แต่เพื่อปรับปรุงความเข้ากันได้ ให้พยายามใส่ข้อความให้มากที่สุดใน HTML
ตรวจสอบว่าแบบฟอร์มของคุณทำงานร่วมกับระบบการเขียนแบบต่างๆ ได้
ภาษาต่างๆ ใช้ระบบการเขียนและชุดอักขระที่แตกต่างกัน บางสคริปต์เขียนจากซ้ายไปขวา และบางสคริปต์เขียนจากขวาไปซ้าย
เว้นระยะห่างจากระบบการเขียน
เพื่อให้แบบฟอร์มของคุณทำงานได้กับระบบการเขียนแบบต่างๆ คุณจะใช้คุณสมบัติเชิงตรรกะของ CSS ได้
ข้อมูลที่ป้อนมีความหนา 1px
ทุกด้าน
ยกเว้นด้านซ้ายที่เส้นขอบหนา 4px
แก้ไข CodePen และเปลี่ยนระบบการเขียนจากขวาไปซ้าย
โดยเพิ่ม dir="rtl"
ลงในองค์ประกอบ <main>
ตอนนี้เส้นขอบแบบหนาอยู่ทางด้านขวาแล้ว นั่นเป็นเพราะเรากำหนดเส้นขอบโดยใช้คุณสมบัติเชิงตรรกะ
input {
border-inline-start-width: 4px;
}
ดูข้อมูลเพิ่มเติมเกี่ยวกับพร็อพเพอร์ตี้เชิงตรรกะ
ตรวจสอบว่าแบบฟอร์มของคุณสามารถจัดการชื่อรูปแบบต่างๆ ได้
สมมติว่าคุณมีแบบฟอร์มที่ให้ผู้ใช้กรอก คุณจะเพิ่มช่องในแบบฟอร์มอย่างไร
คุณสามารถเพิ่มช่องสำหรับชื่อและอีก 1 ช่องสำหรับนามสกุลได้ แต่ชื่อจะต่างกัน จากรอบโลก ตัวอย่างเช่น บางคนไม่มีนามสกุล - เขาควรกรอก ฟิลด์นามสกุล
เพื่อให้ป้อนชื่อที่ง่ายและรวดเร็ว และเพื่อให้ทุกคนสามารถป้อนชื่อได้ ไม่ว่าจะเป็นชื่อ รูปแบบ - ใช้ช่องแบบฟอร์มเดียวสำหรับชื่อเมื่อเป็นไปได้
ดูข้อมูลเพิ่มเติมเกี่ยวกับชื่อส่วนตัว
หากคุณมีชื่อที่มีอักขระที่ไม่ใช่ภาษาละติน
คุณอาจพบปัญหาว่าชื่อของคุณถูกรายงานเป็น invalid
ในบางรูปแบบ เมื่อคุณ
สร้างฟอร์ม ตรวจสอบให้แน่ใจว่าได้อนุญาตอักขระที่เป็นไปได้ทั้งหมด และอย่าทึกทักเอาว่าชื่อมีเพียง
อักขระละติน
อนุญาตรูปแบบที่อยู่ที่หลากหลาย
สำนักงานใหญ่ของ Google อยู่ที่ 1600 Amphitheatre Parkway, Mountain View, CA 94043, United States
ที่อยู่นี้ประกอบด้วยหมายเลขถนน ถนน เมือง รัฐ รหัสไปรษณีย์ และประเทศ รูปแบบที่อยู่ในประเทศของคุณอาจแตกต่างกันโดยสิ้นเชิง คุณจะแน่ใจได้อย่างไรว่าทุกคนสามารถป้อนที่อยู่ของตนในแบบฟอร์มของคุณได้
วิธีหนึ่งก็คือการใช้อินพุตทั่วไป
ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีอื่นๆ ในการทำงาน ที่อยู่ระหว่างประเทศ
ตรวจสอบความเข้าใจ
ทดสอบความรู้ด้านการปรับให้เป็นสากลและการแปล
คุณเรียกใช้การออกเสียงที่ถูกต้องสำหรับโปรแกรมอ่านหน้าจออย่างไร
hreflang
lang
language
คุณสามารถเปลี่ยนระบบการเขียนในเว็บไซต์ของคุณได้อย่างไร
<link>
dir
direction
แหล่งข้อมูล
- บทความและบทแนะนำการทำให้ W3C เป็นสากล
- คู่มือเชิงบังคับเกี่ยวกับที่อยู่ไปรษณีย์ของ Frank มีลิงก์ที่เป็นประโยชน์และคำแนะนำเพิ่มเติมเกี่ยวกับรูปแบบที่อยู่ในกว่า 200 ประเทศ
- DataHub.io เป็นเครื่องมือสำหรับดาวน์โหลดรหัสประเทศและชื่อ