การพิมพ์

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

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

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

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

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

เลือกใช้ลักษณะแบบอักษรทั่วไป

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

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

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

ลักษณะของตัวอักษรและการจัดระยะห่างระหว่างตัวอักษร

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

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

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

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

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

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

ขนาดแบบอักษรและการจัดสไตล์การพิมพ์

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

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

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

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

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

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

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

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

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

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

การเว้นวรรค

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

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

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

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

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

โชคดีที่มีหลักเกณฑ์ที่ชัดเจนเกี่ยวกับการเว้นวรรคและเครื่องมือต่างๆ เช่น Good Line-Height และ Golden Ratio Calculator ที่จะช่วยให้ข้อความของเราเข้าถึงได้ง่ายขึ้น การใช้หลักเกณฑ์เหล่านี้จะช่วยให้ผู้ที่มีความบกพร่องด้านสมาธิ การอ่าน และการมองเห็นจดจ่ออยู่กับข้อความได้มากขึ้นและให้ความสนใจกับเลย์เอาต์น้อยลง

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

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

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

ข้อควรจำเกี่ยวกับการพิมพ์ที่เข้าถึงได้ง่าย

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