การพิมพ์

การสร้างและออกแบบเนื้อหาที่เข้าถึงได้ง่ายนั้นไม่ใช่แค่การเลือกแบบอักษรที่อ่านง่าย แม้จะมีแบบอักษรที่เข้าถึงได้ แต่ผู้ที่สายตาเลือนราง มีความบกพร่องทางปัญญา ภาษา และการเรียนรู้อาจยังประมวลผลข้อความได้ยากเนื่องจากองค์ประกอบอื่นๆ เช่น รูปแบบแบบอักษร ขนาด ระยะห่าง และการปรับระยะห่างระหว่างอักขระ

โมดูลนี้จะพิจารณาข้อควรพิจารณาพื้นฐานเกี่ยวกับการออกแบบเพื่อให้เนื้อหาของคุณมีความครอบคลุมมากขึ้นและเข้าถึงผู้คนได้มากขึ้น

ลักษณะแบบอักษร

ปัจจัยหลักที่อาจส่งผลอย่างมากต่อความสามารถในการอ่านข้อความคือแบบอักษร การเลือกแบบอักษรและการจัดสไตล์อาจทำให้การออกแบบหน้าเว็บโดดเด่นหรือแย่ลง

ผู้ที่มีความบกพร่องด้านการอ่าน การเรียนรู้ และสมาธิ เช่น โรคดิสเล็กเซียและโรคสมาธิสั้น (ADHD) รวมถึงผู้ที่สายตาเลือนราง จะได้รับประโยชน์เมื่อคุณใช้แบบอักษรที่เข้าถึงได้ง่าย

เลือกแบบอักษรทั่วไปวิธีสร้างการออกแบบที่เข้าถึงได้ง่ายที่สุดคือการเลือกแบบอักษรทั่วไป (เช่น Arial, Times New Roman, Calibri, Verdana และอื่นๆ อีกมากมาย)

การศึกษาแบบอักษรจำนวนมากที่ทดสอบคนพิการแสดงให้เห็นว่าแบบอักษรทั่วไปช่วยให้อ่านได้เร็วขึ้นและมีความเข้าใจที่ลึกซึ้งยิ่งขึ้นเมื่อเทียบกับแบบพิมพ์ผิดทั่วไป แม้ว่าแบบอักษรทั่วไปจะไม่ได้เข้าถึงได้ง่ายกว่าแบบอักษรอื่นๆ แต่ผู้พิการบางรายอ่านแบบอักษรเหล่านี้ได้ง่ายขึ้นเนื่องจากมีประสบการณ์ในการใช้งาน (หรือหลีกเลี่ยง) แบบอักษรเหล่านี้มาอย่างยาวนาน

นอกจากการเลือกแบบอักษรทั่วไปแล้ว โปรดหลีกเลี่ยงแบบอักษรที่หรูหราหรือแบบอักษรที่เขียนด้วยมือ รวมถึงแบบอักษรที่มีเฉพาะอักขระตัวพิมพ์ใหญ่เท่านั้น (เช่น อักขระตัวพิมพ์ใหญ่เท่านั้น) ตัวอักษรพิเศษเหล่านี้ที่มีการออกแบบเป็นลายมือ รูปร่างแปลกๆ หรือลักษณะที่เหมือนงานศิลปะ เช่น เส้นบางๆ อาจดูดี แต่ผู้ที่มีความพิการบางรายอ่านได้ยากกว่าตัวอักษรทั่วไป

ลักษณะของตัวอักษรและการเว้นวรรค

งานวิจัยเกี่ยวกับแบบอักษรแบบ Serif หรือแบบ Sans Serif ใดอ่านง่ายกว่านั้นยังไม่แน่ชัด แต่ตัวเลข ตัวอักษร หรือชุดค่าผสมบางอย่างอาจทำให้ผู้ที่มีปัญหาด้านการเรียนรู้และความสามารถทางปัญญาซึ่งเกี่ยวข้องกับภาษาสับสนได้ สําหรับบุคคลที่มีความบกพร่องประเภทเหล่านี้ ตัวอักษรและตัวเลขทุกตัวต้องชัดเจนและมีลักษณะเฉพาะตัวเพื่อไม่ให้สับสนระหว่างตัวอักษรกับตัวเลข

ตัวอย่างที่พบบ่อยคือ "I" ตัวพิมพ์ใหญ่ (India), "l" ตัวพิมพ์เล็ก (lettuce) และตัวเลข "1" ในทำนองเดียวกัน บางครั้งคู่ตัวอักษร เช่น b/d, p/q, f/t, i/j, m/w และ n/u อาจพลิกซ้ายไปขวาหรือขึ้น-ลง สำหรับผู้อ่านบางคนได้

นอกจากนี้ ความอ่านง่ายของข้อความจะลดลงเมื่อการเว้นวรรคระหว่างตัวอักษรหรือระยะห่างระหว่างอักขระแคบเกินไป โปรดระมัดระวังเป็นพิเศษในเรื่องระยะห่างระหว่างอักขระ โดยเฉพาะระหว่างคู่อักขระ r/n ที่มีปัญหา ไม่เช่นนั้นคำอย่าง "ไหมพรม" อาจเปลี่ยนเป็น "yam" หรือ "stern" เป็น "stem" ซึ่งจะเปลี่ยนความหมายของข้อความที่คัดลอกไปโดยสิ้นเชิง

คอลเล็กชันแบบตัวพิมพ์แบบโอเพนซอร์สอย่าง Google Fonts จะช่วยคุณเลือกแบบตัวพิมพ์ที่ครอบคลุมที่สุดสำหรับการออกแบบครั้งต่อไปของคุณ หากใช้ผลิตภัณฑ์ Adobe คุณสามารถฝังชุดแบบอักษรที่เข้าถึงได้จากพาร์ทเนอร์โรงพิมพ์แบบอักษรลงในการออกแบบได้โดยตรง ซึ่งรวมถึงGoogle Fonts บางชุด

เมื่อมองหาแบบอักษรแบบถัดไป ให้คำนึงถึงสิ่งต่อไปนี้เป็นพิเศษ

  • ใช้แบบอักษรทั่วไปเมื่อเป็นไปได้
  • หลีกเลี่ยงการใช้แบบอักษรที่มีลวดลายมากหรือแบบอักษรที่เขียนด้วยลายมือ รวมถึงแบบอักษรที่มีอักขระแบบตัวพิมพ์ใหญ่หรือตัวพิมพ์เล็กเพียงแบบเดียว
  • เลือกแบบอักษรที่มีลักษณะเฉพาะตัว โดยให้ความสนใจเป็นพิเศษกับตัวพิมพ์ใหญ่ I, ตัวพิมพ์เล็ก l และ 1
  • ตรวจสอบชุดค่าผสมของตัวอักษรบางตัวเพื่อให้แน่ใจว่าไม่ใช่ภาพที่สะท้อนถึงกันจริงๆ
  • ตรวจสอบระยะห่างระหว่างอักขระ โดยเฉพาะระหว่างคู่อักขระ r และ n

ขนาดแบบอักษรและการจัดรูปแบบตัวอักษร

ผู้คนมักคิดว่าการเลือกแบบอักษรที่เข้าถึงได้ง่ายเป็นวิธีเดียวในการสร้างเนื้อหาที่ครอบคลุม แต่คุณควรคำนึงถึงขนาดแบบอักษรและการจัดรูปแบบข้อความในหน้าเว็บด้วย

ตัวอย่างเช่น ผู้ที่สายตาเลือนรางหรือตาบอดสีอาจอ่านข้อความบางส่วนไม่ได้หากข้อความมีขนาดเล็กเกินไป โดยใช้ AT เช่น การซูมเบราว์เซอร์เพื่ออ่านข้อความ ผู้ใช้รายอื่นๆ เช่น ผู้ที่มีความบกพร่องในการอ่านหรือโรคดิสเล็กเซีย อาจอ่านข้อความตัวเอียงได้ยาก โปรแกรมอ่านหน้าจอมักไม่สนใจวิธีการจัดรูปแบบ เช่น ตัวหนาและตัวเอียง ดังนั้นผู้ใช้ตาบอดหรือผู้ที่มีสายตาไม่ดีจึงไม่สามารถรับรู้ถึงเจตนาของรูปแบบเหล่านี้

ไม่ควรทำ
h2 {font-size: 16px;}
ควรทำ
h2 {font-size: 1rem;}

เนื่องจากคุณไม่สามารถคาดเดาความต้องการของผู้ใช้ทุกคนได้ ดังนั้นเมื่อเพิ่มแบบอักษรลงในเว็บไซต์และเว็บแอปพลิเคชัน โปรดพิจารณาหลักเกณฑ์ต่อไปนี้

  • ควรกําหนดขนาดแบบอักษรฐานด้วยค่าสัมพัทธ์ (%, rem หรือ em) เพื่ออนุญาตให้ปรับขนาด
  • จำกัดจำนวนรูปแบบแบบอักษร เช่น สี ตัวหนา ตัวพิมพ์ใหญ่ล้วน และตัวเอียง เพื่อเพิ่มความสามารถในการอ่าน แต่ให้ใช้วิธีเน้นคําในข้อความแทน เช่น เครื่องหมายดอกจัน เครื่องหมายขีดกลาง หรือการไฮไลต์คําแต่ละคํา
  • ใช้มาร์กอัปแทนข้อความในรูปภาพทุกครั้งที่เป็นไปได้ โปรแกรมอ่านหน้าจออ่านข้อความที่ฝังในรูปภาพไม่ได้ (หากไม่มีการเพิ่มโค้ดพิเศษ) และข้อความที่ฝังอาจแตกเป็นพิกเซลเมื่อผู้ใช้ที่มีสายตาไม่ดีขยาย

โครงสร้างและเลย์เอาต์

แม้ว่าแบบอักษร ขนาดแบบอักษร และการจัดรูปแบบตัวอักษรจะสำคัญต่อการพิมพ์ตัวอักษรที่เข้าถึงได้ แต่โครงสร้างและเลย์เอาต์ของข้อความโฆษณาในหน้าเว็บก็มีความสำคัญต่อความเข้าใจของผู้ใช้ไม่แพ้กัน

เลย์เอาต์ที่ซับซ้อนอาจเป็นอุปสรรคที่แท้จริงสำหรับผู้ที่มีสายตาเลือนราง ผู้ที่บกพร่องทางการอ่าน และผู้ที่เป็นโรค ADHD ประมาณ 6.1 ล้านคนในสหรัฐอเมริกา ประเภทของข้อบกพร่องเหล่านี้ทําให้ผู้ใช้ติดตามข้อความและอ่านตามลําดับได้ยากขึ้น เนื่องจากไม่มีเส้นทางที่ชัดเจน ขาดส่วนหัว และไม่มีการจัดกลุ่มองค์ประกอบ

สิ่งสำคัญในการออกแบบเลย์เอาต์ที่เข้าถึงได้ง่ายคือทำให้องค์ประกอบที่สำคัญมีความแตกต่างกันและจัดกลุ่มองค์ประกอบที่คล้ายกันไว้ด้วยกัน หากองค์ประกอบอยู่ใกล้เกินไป การบอกตำแหน่งเริ่มต้นและสิ้นสุดขององค์ประกอบหนึ่งๆ อาจเป็นเรื่องยาก โดยเฉพาะอย่างยิ่งหากมีการจัดรูปแบบคล้ายกัน

ให้คิดว่าข้อความเป็นคอลเล็กชันของหัวข้อย่อยแต่ละหัวข้อในโครงร่างเอกสาร ซึ่งจะช่วยให้คุณวางแผนโครงสร้างหน้าเว็บโดยรวมได้ รวมถึงใช้ส่วนหัว ส่วนหัวย่อย และรายการตามความเหมาะสม

การเว้นวรรค

การเว้นวรรคระหว่างย่อหน้า ประโยค และคำจะช่วยรักษาความสนใจของผู้อ่านไว้กับข้อความและเพิ่มความเข้าใจภาพโดยรวมของหน้า บรรทัดข้อความที่ยาวอาจทำให้เกิดปัญหาสําหรับผู้อ่านที่มีความพิการ เนื่องจากผู้อ่านกลุ่มนี้อาจมีปัญหาในการติดตามข้อความและอ่านตามลำดับได้

ข้อความที่แบ่งเป็นย่อหน้าแคบๆ จะช่วยให้ผู้อ่านอ่านบรรทัดถัดไปได้ง่ายขึ้น

การจัดแนวเนื้อหา

อีกสิ่งที่ทำให้คนพิการจำนวนมากไม่พอใจคือการอ่านข้อความที่มีการจัดวางแบบชิดขอบ ระยะห่างที่ไม่เท่ากันระหว่างคำในข้อความที่กําหนดค่าให้ชิดขอบอาจทําให้เกิด "ช่องว่างมากมาย" ตลอดหน้าเว็บ ซึ่งทําให้อ่านข้อความได้ยาก

นอกจากนี้ การจัดข้อความชิดขอบยังอาจทำให้คำอยู่ชิดกันหรือยืดออกในลักษณะที่ไม่เป็นธรรมชาติ ทำให้ผู้อ่านหาขอบเขตของคำได้ยาก

โชคดีที่เรามีหลักเกณฑ์ที่ชัดเจนเกี่ยวกับระยะห่างและเครื่องมือต่างๆ เช่น ความสูงของบรรทัดที่ดีและเครื่องคำนวณสัดส่วนทองเพื่อช่วยทําให้ข้อความของเราเข้าถึงได้ง่ายขึ้น การใช้หลักเกณฑ์เหล่านี้จะช่วยให้ผู้ที่มีความบกพร่องด้านสมาธิ การอ่าน และสายตาสามารถโฟกัสที่ข้อความได้มากขึ้นและโฟกัสที่เลย์เอาต์น้อยลง

แนวทางปฏิบัติแนะนำสำหรับโครงสร้างและเลย์เอาต์

เมื่อพิจารณาโครงสร้างและเลย์เอาต์ โปรดตรวจสอบว่าคุณได้ทำสิ่งต่อไปนี้

  • ใช้องค์ประกอบ เช่น ส่วนหัว ส่วนหัวย่อย รายการ ตัวเลข เครื่องหมายคำพูด และการจัดกลุ่มภาพอื่นๆ เพื่อแบ่งหน้าเว็บออกเป็นส่วนต่างๆ
  • ใช้ย่อหน้า ประโยค และระยะห่างระหว่างคำที่ชัดเจน
  • สร้างคอลัมน์ข้อความที่มีความกว้างน้อยกว่า 80 อักขระ (40 อักขระสําหรับโลโกแกรม)
  • หลีกเลี่ยงการจัดแนวย่อหน้าแบบจัดชิด ซึ่งจะทำให้เกิด "ช่องว่าง" ตรงกลางข้อความ

สรุปเกี่ยวกับแบบอักษรที่เข้าถึงได้

การจัดรูปแบบตัวอักษรที่เข้าถึงได้ง่ายอาจสรุปได้ว่าเป็นทางเลือกการออกแบบที่เน้นความสมเหตุสมผลโดยอิงตามความรู้เกี่ยวกับความต้องการของผู้ใช้ การวางโมดูลนี้ไว้ในใจขณะออกแบบและสร้างเนื้อหาจะช่วยให้คุณสื่อสารกับผู้คนจำนวนมากได้อย่างชัดเจน

ทดสอบความเข้าใจ

ทดสอบความรู้เกี่ยวกับการวัดการช่วยเหลือพิเศษ

หากต้องการให้ข้อความอ่านง่าย ฉันควรใช้สีของข้อความและพื้นหลังที่คอนทราสต์สูงเสมอ

จริง
แม้ว่าคอนทราสต์สูงจะมีประโยชน์สําหรับผู้ที่บกพร่องทางการมองเห็น แต่บางคนอาจมีความบกพร่องที่ทำให้อ่านเนื้อหาคอนทราสต์สูงได้ยาก
เท็จ
ผู้พิการบางรายจะอ่านเนื้อหาของคุณไม่ได้หากคอนทราสต์สูงเกินไป หากทำได้ ให้ใช้การตั้งค่าระบบปฏิบัติการของผู้ใช้เพื่อกำหนดคอนทราสต์

แบบอักษรใดเหมาะกับการช่วยเหลือพิเศษมากที่สุด

แบบอักษรของระบบ เช่น Arial และ Verdana
แบบตัวพิมพ์ทั่วไปทำให้อ่านได้เร็วขึ้นและมีความเข้าใจในระดับที่ลึกขึ้นเมื่อเทียบกับแบบตัวพิมพ์ทั่วไป
ตัวอักษรที่เข้าถึงได้
คอลเล็กชันแบบอักษรที่เข้าถึงได้ เช่น Google Foundry ใน Adobe Fonts ช่วยให้คุณเลือกแบบอักษรที่ครอบคลุมมากที่สุดสำหรับการออกแบบครั้งถัดไปได้
ไม่สำคัญเลย
การเลือกแบบอักษรส่งผลต่อความง่ายในการอ่านได้ หลีกเลี่ยงการใช้สคริปต์และแบบอักษรอาร์ตที่ซับซ้อน