การปฏิบัติตามข้อกำหนดทำได้ง่าย: การนำทางแนวทาง WCAG สำหรับไซต์อีคอมเมิร์ซ
เผยแพร่แล้ว: 2019-09-10เนื่องจากผู้บริโภคหลายล้านคนหันมาใช้ร้านค้าออนไลน์เพื่อความต้องการในการซื้อ อีคอมเมิร์ซจึงเป็นธุรกิจที่ใหญ่มากขึ้นในปัจจุบัน
อย่างไรก็ตาม เพื่อให้แน่ใจว่าทุกคนมีสิทธิ์ใช้งานเว็บไซต์เหล่านี้ได้ การเข้าถึงเว็บอีคอมเมิร์ซถือเป็นสิ่งสำคัญ
การเพิ่มประสิทธิภาพไซต์เพื่อให้แน่ใจว่าสามารถเข้าถึงได้โดย มาตรฐาน Web Content Accessibility Guidelines (WCAG) ไม่ใช่ทางเลือกอีกต่อไป แต่เป็นเรื่องของความสอดคล้องและการปฏิบัติตามกฎหมาย
ข้ามไปที่:
- เหตุใดการเข้าถึงจึงมีความสำคัญสำหรับอีคอมเมิร์ซ
- ไซต์อีคอมเมิร์ซจำเป็นต้องสอดคล้องกับ WCAG อย่างไร
แหล่งที่มา
เหตุใดการเข้าถึงจึงมีความสำคัญสำหรับอีคอมเมิร์ซ
ในการศึกษาที่ดำเนินการโดย WebAIM พบว่า 95.9% ของหน้า Landing Page ที่บ้านไม่ผ่านมาตรฐาน WCAG 2.0 ซึ่งลดลงเพียงเล็กน้อยจาก 96.3% ในปี 2023
แม้ว่าสถิติดังกล่าวจะรวบรวมได้มากกว่าแค่อีคอมเมิร์ซ แต่ก็สามารถสันนิษฐานได้ว่าสถานที่ช็อปปิ้งออนไลน์มีเปอร์เซ็นต์ที่น่าตกใจขนาดนั้น
แต่เหตุใด ความสอดคล้องของ WCAG และการเข้าถึงโดยรวมจึงมีความสำคัญต่ออีคอมเมิร์ซ
จริยธรรม
การเพิ่มประสิทธิภาพเว็บไซต์อีคอมเมิร์ซเพื่อการเข้าถึงเป็นสิ่งที่ถูกต้อง ในแง่ของหลักจริยธรรมขั้นพื้นฐาน
เป็นขั้นตอนสำคัญในการแสดงให้เห็นความเห็นอกเห็นใจต่อลูกค้า และประสบการณ์การช้อปปิ้งที่ครอบคลุมนั้นถือเป็นคุณธรรม ความรับผิดชอบ และ การคำนึงถึงความเป็นอยู่ที่ดีของทุก คน
การขยายฐานลูกค้า
พูดง่ายๆ ก็คือ เมื่อไซต์เข้าถึงได้สำหรับคนจำนวนมากขึ้น ผู้คนก็จะใช้งานไซต์นั้นมากขึ้น
ไซต์อีคอมเมิร์ซที่ทุกคนสามารถใช้ได้ รวมถึงผู้ที่มีความบกพร่องทางการมองเห็น การได้ยิน ร่างกาย การพูด ภาษา การรับรู้ การเรียนรู้ หรือระบบประสาท ไม่เพียงแต่ครอบคลุมเท่านั้น แต่ยังมีประโยชน์มากขึ้นสำหรับทุกคน แม้แต่ผู้ที่ไม่มีความพิการอีกด้วย
ตาม รายงานการเจ็บป่วยและการเสียชีวิตของ CDC ผู้ใหญ่ 1 ใน 4 คนในสหรัฐอเมริกาอาศัยอยู่กับความพิการ การปิดกั้นประชากรกลุ่มใหญ่นี้จากการใช้เว็บไซต์อาจเป็นการจำกัดอย่างรุนแรง
บุคคลที่ไม่สามารถเข้าสู่ไซต์อีคอมเมิร์ซ ซื้อสินค้า และเดินทางไปยังจุดชำระเงินเพื่อดำเนินการซื้อให้เสร็จสิ้นโดยไม่ยากเกินไป จะต้องเด้งกลับและค้นหาสถานที่อื่นเพื่อซื้อสินค้าสิ่งที่พวกเขากำลังมองหาอย่างแน่นอน
ด้วยไซต์ที่ตรงตามหลักเกณฑ์การเข้าถึง ผู้มีโอกาสเป็นผู้ซื้อจะสามารถค้นหาไซต์และอยู่ที่ไซต์นั้นได้ นี่เป็นการเปิดโอกาสให้มีฐานลูกค้าที่สำคัญมากขึ้น
ประโยชน์ด้าน SEO
ไม่เพียงแต่ผู้คนจะสามารถใช้ไซต์ได้มากขึ้นเท่านั้น แต่การเพิ่มประสิทธิภาพเพื่อการเข้าถึงยังส่งผลต่อการจัดอันดับของเครื่องมือค้นหาและการเติบโตตามธรรมชาติอีกด้วย
การเข้าถึงไม่ได้เป็นปัจจัยในการจัดอันดับในตัวมันเอง อย่างไรก็ตาม มันเป็นแง่มุมของการใช้งานโดยรวมและ ประสบการณ์ผู้ ใช้
เมื่อเน้นการเข้าถึงบนไซต์ โปรแกรมรวบรวมข้อมูลการค้นหาของ Google สามารถตรวจจับอัตราตีกลับที่ต่ำกว่า เวลาบนหน้าเว็บนานขึ้น และการมีส่วนร่วมที่เพิ่มขึ้น
ดังนั้น พวกเขาสามารถสรุปได้ว่าหน้าที่สามารถเข้าถึงได้นั้น 'มีคุณค่า' และจัดอันดับให้สูงกว่าใน SERP
การปฏิบัติตามกฎหมาย
นอกเหนือจากการขยายฐานลูกค้าโดยทำให้ทุกคนสามารถเข้าถึงและนำทางไซต์ของคุณได้ การเข้าถึงเว็บอีคอมเมิร์ซยังเป็นกฎหมายที่สอดคล้องกับ ADA Title III
ADA Title III สรุปว่าสถานที่สาธารณะ รวมถึงเว็บไซต์ต่างๆ จะต้องสามารถเข้าถึงได้โดยผู้ทุพพลภาพ
ธุรกิจและเว็บไซต์ที่ข้ามมาตรการการเข้าถึง เช่น ข้อความแสดงแทนหรือการตั้งค่าคอนทราสต์ของสีที่เหมาะสม อาจประสบปัญหาทางกฎหมายได้ ซึ่งจะเป็นการเน้นย้ำถึงความสำคัญของการปฏิบัติตามมาตรฐาน ADA ในแง่ของ การออกแบบเว็บไซต์ ที่ ครอบคลุม
WCAG ไม่ใช่กฎหมาย แต่เป็นชุดแนวทางตามชื่อ
อย่างไรก็ตาม การตรวจสอบให้แน่ใจว่าไซต์เป็นไปตามแนวทางการเข้าถึงเหล่านี้จะเป็นไปตามมาตรฐาน ADA ด้วย
สิ่งนี้ไม่เพียงป้องกันการดำเนินการทางกฎหมายที่อาจเกิดขึ้นได้ แต่ยังสร้างสภาพแวดล้อมที่ครอบคลุมและเท่าเทียมกัน
แหล่งที่มา
ไซต์อีคอมเมิร์ซจำเป็นต้องสอดคล้องกับ WCAG อย่างไร
เพื่อให้เป็นไปตามแนวทาง WCAG ไซต์อีคอมเมิร์ซจะต้องสามารถรับรู้ ใช้งานได้ เข้าใจได้ และมีประสิทธิภาพ
ซึ่งหมายความว่าควรมีองค์ประกอบต่างๆ เช่น ความคมชัดของข้อความที่เหมาะสม ข้อความแสดงแทน และโครงสร้างส่วนหัวที่เหมาะสม
หากต้องการทำความเข้าใจวิธีทำให้เว็บไซต์ช็อปปิ้งอีคอมเมิร์ซเข้าถึงได้ สิ่งสำคัญคือต้องเข้าใจว่า WCAG คืออะไร
WCAG หมายถึงชุดแนวทางปฏิบัติที่มีจุดมุ่งหมายเพื่อรวมเข้าด้วยกันทั่วโลกเพื่อให้แน่ใจว่าไซต์ต่างๆ ทั่วทั้งเว็บ โดยไม่คำนึงถึงภาษาหรือสถานที่จะถือว่าสามารถเข้าถึงได้
แม้ว่าจะไม่มีเว็บไซต์สองแห่งที่สร้างขึ้นเหมือนกันทุกประการ และผู้ที่เข้าถึงเว็บไซต์เหล่านั้นก็จะแตกต่างกันพอๆ กัน แต่มีเกณฑ์มาตรฐานบางประการที่ไซต์อีคอมเมิร์ซต้องมีเพื่อให้เป็นไปตามมาตรฐานทั้งสี่ตามที่ WCAG กำหนดไว้ ซึ่งจัดเรียงเป็นตัวย่อ เท.
แหล่งที่มา
POUR แนะนำว่าเว็บไซต์จะต้อง:
- รับรู้ได้
- ใช้งานได้
- เข้าใจได้
- แข็งแกร่ง
ไซต์อีคอมเมิร์ซจะมั่นใจได้อย่างไรว่าเป็นไปตามหลักการทั้งสี่นี้ ซึ่งสอดคล้องกับมาตรฐาน WCAG
มีความเป็นไปได้หลายประการ แต่มีประเด็นปัญหาในการเข้าถึงบางประการที่ต้องแก้ไขจึงจะถือว่าสามารถเข้าถึงได้
ความคมชัดของข้อความที่เหมาะสม
ในการศึกษาเดียวกันที่ดำเนินการโดย WebAIM พบว่า 80% ของหน้าแรกที่สแกนมีข้อความที่มีคอนทราสต์ต่ำ
แหล่งที่มา
ความคมชัดของข้อความหมายถึงสีของข้อความบนหน้าจอเมื่อเทียบกับพื้นหลังที่เปิดอยู่
เว็บไซต์พื้นฐานส่วนใหญ่จะเลือกใช้ข้อความสีเข้มบนพื้นหลังสีอ่อน WCAG ใช้สิ่งที่อ้างถึงเป็นอัตราส่วนคอนทราสต์เพื่อตรวจจับความแตกต่างในความสว่างที่รับรู้ระหว่างสองสี
ตัวอย่างเช่น ข้อความสีขาวบนพื้นหลังสีขาวซึ่งมองไม่เห็น จะได้รับอัตราส่วน 1:1 สีดำบนพื้นหลังสีขาวจะได้รับอัตราส่วน 21:1 ซึ่งเป็นอัตราส่วนที่สูงกว่ามากเพื่อแสดงคอนทราสต์ที่มากขึ้น
การออกแบบที่บางคนเลือกสำหรับเว็บไซต์อีคอมเมิร์ซอาจดึงดูดสายตา แต่ความแตกต่างระหว่างพื้นหลังและข้อความในระดับต่ำอาจทำให้ผู้ใช้มองเห็นได้ยากขึ้น
ความยากลำบากนั้นเกิดขึ้นสำหรับทุกคน ไม่ใช่แค่ผู้ที่มีการมองเห็นจำกัดหรือตาบอดสีเท่านั้น ความเชี่ยวชาญด้าน UX ที่เหมาะสมเมื่อสร้างไซต์สามารถช่วยให้แน่ใจว่าระดับความคมชัดนั้นเหมาะสม
ไซต์อีคอมเมิร์ซควรพยายามสร้างความแตกต่างที่เหมาะสมในทุกด้านของไซต์ รวมถึง:
- ลิงค์เมนูและพื้นหลัง
- สินค้าในรถเข็น - นักช้อปควรมีมุมมองที่ชัดเจนเกี่ยวกับจำนวนสินค้าในรถเข็นและสิ่งที่พวกเขาได้เพิ่มไปแล้ว
- รูปภาพสินค้า
- รถเข็น การชำระเงิน และหน้ายืนยันการชำระเงิน
- ป้ายราคา
- ช่องค้นหา
- โลโก้และชื่อบริษัท
- ส่วนหัวและส่วนท้าย
ข้อความแสดงแทน
ข้อความแสดงแทน หรือที่เรียกว่าข้อความแสดงแทน คือข้อมูลที่เป็นข้อความที่อธิบายบริบทและวัตถุประสงค์ของรูปภาพนั้น
เมื่อบุคคลใช้อุปกรณ์อ่านหน้าจอ โปรแกรมอ่านหน้าจอจะถอดเสียงข้อความแสดงแทนเพื่อให้ผู้ใช้ทราบว่ารูปภาพนั้นคืออะไร ทำให้พวกเขาไม่พลาดบริบทที่สำคัญใดๆ
ข้อความแสดงแทนมีความสำคัญอย่างยิ่งในการเข้าถึงเว็บอีคอมเมิร์ซ
เมื่อช้อปปิ้งออนไลน์ รูปภาพผลิตภัณฑ์มักเป็นสิ่งที่ผู้ใช้ต้องทำเพื่อตัดสินใจซื้อ แทนที่จะอยู่ในร้านค้าจริงที่ผู้ใช้สามารถสัมผัสและมีส่วนร่วมกับผลิตภัณฑ์ได้
หากไม่มีข้อความแสดงแทน ผู้ใช้อาจมีความคิดน้อยลงว่ากำลังดูอะไรอยู่ และพบว่าตนเองไม่สนใจ
ข้อความแสดงแทนสำหรับอีคอมเมิร์ซ เป็นหนึ่งในวิธีที่ดีที่สุดในการสร้างประสบการณ์การช็อปปิ้งที่ครอบคลุมมากขึ้น
ย้อนกลับไปถึงการเปิดตัว WCAG 1.0 ในปี 1999 ข้อความแสดงแทนถือเป็นส่วนสำคัญของความสอดคล้อง โดยระบุว่าเว็บไซต์ต้อง "จัดหาทางเลือกที่เทียบเท่ากับเนื้อหาทางการได้ยินและภาพ"
ซึ่งหมายความว่าเพื่อให้ไซต์เป็นไปตามมาตรฐานเหล่านี้ ข้อความแสดงแทนต้องรวมอยู่ในรูปภาพที่ไม่ได้ตกแต่งทั้งหมด
การนำทางด้วยแป้นพิมพ์
แหล่งที่มา
คนหลายกลุ่มไม่ใช้เมาส์เพื่อนำทางผ่านเว็บไซต์
ผู้ใช้บางรายอาจเป็นผู้ใช้ที่ตาบอดหรือมองเห็นไม่ชัดซึ่งใช้โปรแกรมอ่านหน้าจอหรือแว่นขยายเพื่อสำรวจไซต์ ในขณะที่บางรายอาจมีความบกพร่องด้านการเคลื่อนไหวซึ่งส่งผลต่อความสามารถในการใช้เมาส์หรือ 'อุปกรณ์คลิก' อื่นๆ
ด้วยเหตุนี้ จึงมั่นใจได้ว่าทุกฟิลด์ที่สามารถโต้ตอบได้บนไซต์อีคอมเมิร์ซสามารถนำทางได้ทั้งหมดผ่านการควบคุมด้วยแป้นพิมพ์
เว็บไซต์หลายแห่งใช้ปุ่ม TAB เพื่อดำเนินการผ่านตัวเลือกต่างๆ ที่ถือว่า 'โฟกัสได้' เช่น ลิงก์ ปุ่ม และช่องป้อนข้อมูล
การกด TAB จะนำทางผ่านองค์ประกอบที่สามารถโฟกัสได้ของไซต์ตามลำดับที่องค์ประกอบเหล่านั้นปรากฏภายในซอร์สโค้ด
ขออภัย สิ่งนี้อาจไม่ตรงกับลักษณะการจัดวางหน้าเว็บ นี่อาจมีความสำคัญอย่างยิ่งใน การกรอกแบบ ฟอร์ม
สิ่งนี้อาจทำให้ตำแหน่งการลงจอดของแท่นกด TAB เหล่านี้คาดเดาไม่ได้และท้ายที่สุดก็ใช้งานยาก
เมื่ออยู่ในขั้นตอนการออกแบบ ไซต์อีคอมเมิร์ซควรตรวจสอบให้แน่ใจว่าการนำทางด้วยแป้นพิมพ์นั้นสมเหตุสมผลและเหมาะสมเพื่อช่วยให้ผู้อื่นเดินทางจากจุดหนึ่งไปยังอีกจุดหนึ่งได้
การเข้าถึงมีไว้สำหรับทุกคน
การเข้าถึงเว็บอีคอมเมิร์ซไม่ได้เป็นเพียงเรื่องของการปฏิบัติตามกฎหมายเท่านั้นและ SEO ก็ชนะ
สิ่งสำคัญคือต้องทำตามหลักจริยธรรม
การให้ผู้ซื้อสามารถใช้ นำทาง และซื้อสินค้าจากร้านค้าออนไลน์จะขยายฐานลูกค้า แสดงความเห็นอกเห็นใจ และมีประโยชน์เพิ่มเติมจากประสบการณ์ผู้ใช้ที่ได้รับการปรับปรุง
ไซต์ที่ได้มาตรฐานที่กำหนดโดยแนวทางการเข้าถึงเนื้อหาเว็บ เช่น การตรวจสอบให้แน่ใจว่าไซต์ของตนมีข้อความแสดงแทน การนำทางด้วยแป้นพิมพ์อย่างง่ายดาย และปริมาณคอนทราสต์ของสีที่ถูกต้อง จะเป็นไปตามมาตรฐานการเข้าถึงแบบดิจิทัลที่กำหนดโดย ADA .