ในวิดีโอนี้ Jaci จากทีม WebFX Interactive จะอธิบายวิธีเริ่มต้นใช้งานการออกแบบเว็บที่สามารถเข้าถึงได้

การถอดเสียง:

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

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

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

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

การเข้าถึงเว็บไซต์คืออะไร?

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

ตามรายงานของ World Wide Web Consortium หรือที่เรียกว่า W3C เว็บไซต์ที่สามารถเข้าถึงได้นี้เหมาะสำหรับผู้ที่มีความบกพร่องทางการได้ยิน การรับรู้ ระบบประสาท ร่างกาย คำพูด และการมองเห็น

อย่ากังวลหากคุณไม่แน่ใจว่าจะเริ่มต้นจากตรงไหน W3C มีเอกสารที่บอกคุณว่าเว็บไซต์ของคุณควรมีอะไรบ้างเพื่อให้เป็นไปตามมาตรฐาน

เอกสารนี้รวมถึง:

• แนวทางการเข้าถึงเครื่องมือการเขียน (ATAG)
• แนวทางการเข้าถึงเนื้อหาเว็บ (WCAG)
• แนวทางการเข้าถึงของตัวแทนผู้ใช้ (UAAG)

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

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

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

ดังนั้นคุณจะรู้ได้อย่างไรว่าคุณมีเว็บไซต์ที่สามารถเข้าถึงได้? ทำการตรวจสอบ!

วิธีตรวจสอบการเข้าถึงเว็บไซต์ของคุณ

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

ตอนนี้ หากคุณต้องการจัดการสิ่งต่างๆ ภายในองค์กร คุณมีตัวเลือกมากมาย คุณสามารถสำรวจหน้าเว็บไซต์ของคุณเพื่อค้นหาปัญหาด้วยตนเอง แต่อาจต้องใช้เวลามาก

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

เว็บไซต์ W3C มีรายการ เครื่องมือช่วยสำหรับการเข้าถึง จำนวนมาก ดังนั้นคุณจึงไม่ต้องทำทุกอย่างด้วยตัวเอง

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

5 แนวทางการเข้าถึงการออกแบบเว็บ

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

1. ตรวจสอบให้แน่ใจว่าข้อความสามารถอ่านได้

ข้อความขนาดปกติที่สื่อสารข้อมูลสำคัญจะต้องอ่านง่าย

ความคมชัดมีบทบาทสำคัญในเรื่องนี้ ในตอนนี้ ข้อความขนาดใหญ่ (เช่น หัวเรื่องหลัก) จำเป็นต้องมีอัตราส่วนคอนทราสต์ข้อความต่อพื้นหลังเป็น 3:1 ข้อความธรรมดา (หรือเล็กกว่า) เช่น ข้อความที่ประกอบเป็นเนื้อหาของคุณ ต้องการอัตราส่วนคอนทราสต์ 4.5:1

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

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

2. ปรับแต่งภาพเพื่อดูและอ่าน

การ เพิ่ม ข้อความแสดงแทนให้กับรูปภาพ ไม่ได้เป็นเพียงแนวทางปฏิบัติเกี่ยวกับ SEO ทั่วไปเท่านั้น ช่วยให้ผู้ที่มองไม่เห็นภาพเข้าใจสิ่งที่อยู่ในภาพ

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

3. ให้ผู้ชมของคุณมีวิธีการเพิ่มเติมในการทำความเข้าใจวิดีโอ

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

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

คุณยังสามารถสั่งซื้อคำบรรยายโดยใช้เครื่องมือเช่น Rev แล้วเพิ่มลงในวิดีโอของคุณ

การใส่ข้อความถอดเสียงในวิดีโอทำให้เข้าถึงได้ง่ายขึ้น หากคุณเคยเขียนบท แสดงว่าคุณได้เตรียมทรานสคริปต์ไว้แล้ว!

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

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

แพลตฟอร์มโฮสติ้งเช่น Wistia ช่วยให้คุณสามารถ อัปโหลดคำอธิบายเสียง (และยังมีรายการตรวจสอบการเข้าถึงวิดีโอเมื่อคุณอัปโหลดวิดีโอของคุณ)

4. ออกแบบเว็บไซต์ของคุณให้เป็นมิตรกับเมาส์และคีย์บอร์ด

ไม่ใช่ทุกคนที่ใช้เมาส์เพื่อนำทางอินเทอร์เน็ต เว็บไซต์ของคุณควรสะท้อนให้เห็นว่า

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

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

เพื่อให้เป็นไปตามหลักเกณฑ์ของ WCAG ฟังก์ชันนี้ควรเกิดขึ้นเมื่อใช้แป้นพิมพ์

5. ทำให้การนำทางไซต์ของคุณเข้าใจง่าย

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

เขียนชื่อหน้าและหัวเรื่องที่มีจุดประสงค์ที่ชัดเจน ใช้ anchor text ที่ทำให้เข้าใจได้ง่ายว่ามีอะไรอยู่ในเนื้อหาที่คุณกำลังลิงก์ไป

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

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

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

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

หากต้องการเรียนรู้เกี่ยวกับการออกแบบเว็บและหัวข้อการตลาดดิจิทัลต่างๆ ต่อไป โปรดสมัครรับข้อมูลจาก ช่อง YouTube และจดหมายข่าวทางอีเมล Revenue Weekly คุณจะไม่ผิดหวัง

ขอบคุณที่เข้าร่วมกับฉัน!

เข้าร่วมนักการตลาด 5,000 รายที่ได้รับความรู้ด้านการตลาดจากวิดีโอ WebFX

สมัครสมาชิกตอนนี้