Uniweb

แนะนำ 5 ตัวเลือกของ "คอนทราสต์เช็กเกอร์" ที่ใช้งานง่ายสำหรับผู้รับผิดชอบ

2024/07/29

5 เครื่องมือเช็คคอนทราสต์แนะนำ

เครื่องมือตรวจสอบความเปรียบต่างใช้ในการคำนวณอัตราส่วนความเปรียบต่างระหว่างสีหน้า (ข้อความหรือองค์ประกอบกราฟิก) กับสีพื้นหลังบนเว็บไซต์หรือภาพเพื่อตรวจสอบว่าอัตราส่วนนั้นเป็นไปตามมาตรฐานแนวทางการเข้าถึงเว็บ เช่น WCAG และ JIS หรือไม่เป็นเครื่องมือสำหรับประเมินซึ่งมักเรียกว่าเครื่องมือตรวจสอบอัตราความเปรียบต่าง หรือเครื่องมือตรวจสอบความเปรียบต่างของสี

ในบทความนี้ เราจะแนะนำเครื่องมือตรวจสอบความเปรียบต่างยอดนิยม 5 ตัวดังนี้

① WebAIM
② ColorTester
③ AdobeColor
④ เครื่องมือตรวจสอบความเปรียบต่างสี WCAG
⑤ ContrastGrid

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

เครื่องมือตรวจสอบความเปรียบต่าง 5 อันดับที่ใช้งานง่ายสำหรับผู้ดูแลด้านการเข้าถึง

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

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

ชื่อเครื่องมือ คุณสมบัติ สภาพแวดล้อมการใช้งาน
① WebAIM เครื่องมือที่สามารถใช้งานได้ทันทีเมื่อเข้าถึงเว็บไซต์ แม้ว่าเว็บไซต์จะเป็นภาษาอังกฤษ แต่อินเทอร์เฟซใช้งานง่ายและเข้าใจได้ชัดเจน เบราว์เซอร์
② ColorTester สามารถลากและวางรูปภาพเพื่อตรวจสอบคอนทราสต์ได้ เนื่องจากเป็นโปรแกรมแบบติดตั้ง อาจมีข้อจำกัดในการใช้งานในที่ทำงาน การติดตั้ง
(Windows / Mac)
③ AdobeColor นอกจากฟังก์ชันตรวจสอบคอนทราสต์ ยังมีฟังก์ชันด้านการจัดสีที่หลากหลาย สามารถเชื่อมต่อกับผลิตภัณฑ์ของ Adobe เช่น Photoshop, Illustrator, inDesign ได้ เบราว์เซอร์
④ เครื่องมือตรวจสอบความเปรียบต่างสี WCAG ติดตั้งบน Google Chrome ใช้เป็นส่วนขยาย เหมาะอย่างยิ่งสำหรับตรวจสอบคอนทราสต์ของเว็บไซต์ เบราว์เซอร์
(ส่วนขยายของ Chrome)
⑤ ContrastGrid เครื่องมือที่สามารถตรวจสอบคอนทราสต์ของสีที่ตั้งค่าไว้ในรูปแบบรายการ สามารถตั้งค่าโค้ดสีหลายค่า ทำให้ผู้ที่ไม่ถนัดเรื่องสีสามารถเข้าใจและเลือกใช้สีได้ง่ายขึ้น เบราว์เซอร์

 

① WebAIM

WebAIM

ตั้งค่าสีตัวอักษร (Foreground) และสีพื้นหลัง (Background) เพื่อคำนวณอัตราคอนทราสต์ตรวจสอบว่าสอดคล้องกับเกณฑ์ WCAG หรือไม่ได้ สีสามารถระบุโดยโค้ดสีหรือตัวเลือกสี สามารถปรับความสว่างได้ เมื่อกำหนดสีแล้ว อัตราคอนทราสต์จะคำนวณแบบเรียลไทม์ และสามารถดูตัวอย่างได้ทั้งข้อความปกติ ตัวหนา และวัตถุกราฟิก เช่น เครื่องหมายถูก

ผลลัพธ์แต่ละรายการจะแสดงชัดเจนว่า ผ่าน (Pass) หรือ ไม่ผ่าน (Fail)แม้ว่าการนำทางจะเป็นภาษาอังกฤษ แต่ใช้งานง่ายและเข้าใจได้ทันทีจึงไม่น่าจะมีปัญหาในการใช้งานทั่วไป

เว็บไซต์ทางการ:WebAIM

② ColorTester

ColorTester

คำนวณอัตราคอนทราสต์ของสีสองสี และประเมินตามมาตรฐาน JIS X 8341-3:2010 (WCAG 2.0)สามารถลากและวางไฟล์รูปภาพลงในหน้าต่างเพื่อให้ซอฟต์แวร์ทำนายสีพื้นหน้าและสีพื้นหลังของภาพโดยอัตโนมัติและประเมินได้เป็นเช่นนั้น

เป็นเครื่องมือที่ผลิตในญี่ปุ่น รองรับทั้ง Windows และ Macจำเป็นต้องติดตั้งเครื่องมือเวอร์ชันที่รองรับของแต่ละ OS คือ Windows 8.1 ขึ้นไป และ Mac OS X 10.10 ขึ้นไป มีเวอร์ชันภาษาอังกฤษด้วย

เว็บไซต์ทางการ:ColorTester

③ Adobe Color

AdobeColor

เครื่องมือที่ Adobe พัฒนาขึ้นและจำหน่ายสำหรับนักสร้างสรรค์ เครื่องมือนี้เป็นเครื่องมือจัดสีที่มีฟังก์ชันหลากหลายเพื่อช่วยในงานสร้างสรรค์ และรวมฟังก์ชันหนึ่งคือเครื่องมือตรวจสอบคอนทราสต์สำหรับการตรวจสอบการเข้าถึง

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

เว็บไซต์ทางการ:Adobe Color

④ เครื่องมือตรวจสอบความเปรียบต่างสี WCAG

WCAGColorcontrastchecker

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

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

เว็บไซต์ทางการ:ตัวตรวจสอบความเปรียบต่างของสี WCAG

⑤ Contrast Grid

ContrastGrid

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

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

เว็บไซต์ทางการ:กริดความเปรียบต่าง

เราได้แนะนำเครื่องมือตรวจสอบความเปรียบต่างที่มีประโยชน์ 5 รายการไปแล้ว แต่ทำไมเราจึงต้องตรวจสอบความเปรียบต่างตั้งแต่แรก? ต่อไปจะอธิบายเรื่องนี้

ทำไมการตรวจสอบความเปรียบต่างจึงจำเป็น

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

โดยเฉพาะอย่างยิ่ง เว็บไซต์ส่วนใหญ่นำเสนอข้อมูลผ่านสายตา ฝ่ายที่ไม่มีปัญหาทางสายตา (晴眼者 : ผู้ซึ่งไม่มีความบกพร่องทางสายตา) ไม่เพียงแต่เท่านั้นต้องมีการตรวจสอบว่าผู้ใช้ที่มีภาวะสายตาเลือนราง ผู้สูงอายุ หรือผู้ที่มีลักษณะพิเศษทางการรับรู้สีสามารถรับรู้ข้อความและภาพได้หรือไม่และต้องตรวจสอบอย่างละเอียดว่ามาตรฐานเว็บเข้าถึงได้ถูกปฏิบัติหรือไม่ พร้อมทั้งปรับปรุงตามความเหมาะสม

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

มาดูตัวอย่างกันว่า การเปลี่ยนแปลงอัตราส่วนความเปรียบต่างส่งผลต่อการมองเห็นอย่างไร ดูได้ที่ด้านล่างนี้

◆ ความแตกต่างของการมองเห็นตามอัตราส่วนความเปรียบต่าง

ภาพเปรียบเทียบคอนทราสต์

นอกจากนี้ เพื่อจำลองภาพในกรณีที่ตัวอักษรเบลอเหมือนผู้ที่มีสายตาต่ำ เราได้ใส่เอฟเฟกต์เบลอที่ภาพด้านบน

◆ ความแตกต่างของการมองเห็นในกรณีที่ภาพเบลอ

ภาพเปรียบเทียบคอนทราสต์ (ผู้มีปัญหาการมองเห็นต่ำ)

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

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

3 จุดสำคัญของการตรวจสอบความเปรียบต่าง

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

จุดที่ 1 เข้าใจอัตราความเปรียบต่างที่เป็นไปตามมาตรฐาน JIS

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

องค์ประกอบที่ประกอบเว็บไซต์มีหลากหลายประเภท แต่ละประเภทมีมาตรฐานการเข้าถึงกำหนดไว้ และเกณฑ์การบรรลุทั้งหมดถูกกำหนดโดยมาตรฐานสากลที่เรียกว่า WCAG 2.0 (Web Content Accessibility Guidelines 2.0) โดยในประเทศญี่ปุ่นมาตรฐาน JIS (JIS X 8341-3:2016)คือสิ่งที่เกี่ยวข้อง

นอกจากนี้ ในมาตรฐานนี้ยังมีระดับการบรรลุที่กำหนดไว้ตั้งแต่ A ถึง AAA และตามที่กระทรวงกิจการภายในและสื่อสารแห่งชาติกล่าวว่าการรับรองการเข้าถึงเว็บไซต์จำเป็นต้องเป็นไปตามระดับ AA หรือ AAA (ซึ่งแนะนำ)เป็นที่ยอมรับ

ข้อมูลอ้างอิง:การตอบสนองการเข้าถึงบนเว็บไซต์ของหน่วยงานภาครัฐ (กระทรวงกิจการภายในและสื่อสาร)

และเกี่ยวกับอัตราความเปรียบต่างก็มีการกำหนดมาตรฐานไว้ด้วยเช่นกัน

◆อัตราความเปรียบต่างเพื่อปฏิบัติตามระดับ AA และ AAA

ระดับการปฏิบัติตาม อัตราความเปรียบต่างที่จำเป็น
AA 4.5:1 ขึ้นไป
AAA 7:1 ขึ้นไป

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

สำหรับอัตราความเปรียบต่าง AAA ที่ 7:1 นั้นตั้งอยู่บนสมมติฐานของผู้ใช้ที่มีการมองเห็นลดลงประมาณ 20/80 และ W3C สมมติว่าผู้ใช้ที่มีการมองเห็นลดลงเกินกว่า 20/80 โดยปกติจะใช้เทคโนโลยีช่วยเหลือเพื่อเข้าถึงเนื้อหา

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

ข้อมูลอ้างอิง:ทำความเข้าใจเกณฑ์การบรรลุ 1.4.6 | คู่มืออธิบาย WCAG 2.0 (W3C)

จุดที่ 2 ให้ความสำคัญกับขนาดตัวอักษรด้วย

ในจุดที่ 1 ได้กล่าวว่า "อัตราความเปรียบต่างต้องไม่น้อยกว่า 4.5:1" แต่จริง ๆ แล้วมีข้อยกเว้นในกรณีนี้ในกรณีเช่นต่อไปนี้ ไม่จำเป็นต้องปฏิบัติตามอัตรา 4.5:1 เสมอไป

◆ข้อยกเว้นในการปฏิบัติตามมาตรฐานอัตราความเปรียบต่าง

・ข้อยกเว้น 1 ตัวอักษรขนาดใหญ่และตัวหนา
สำหรับตัวอักษรขนาดใหญ่หรือตัวหนา (ตัวอักษรปกติขนาด 18 พอยต์ขึ้นไป หรือตัวหนาขนาด 14 พอยต์ขึ้นไป)อัตราความเปรียบต่าง 3:1ถือว่าเป็นไปตามเกณฑ์ เนื่องจากตัวอักษรขนาดใหญ่มีความสามารถในการมองเห็นสูง จึงยังยอมรับอัตราความเปรียบต่างที่ต่ำลงบ้างได้

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

・ข้อยกเว้น 3 ตัวอักษรภายในภาพ
ตัวอักษรในภาพถ่ายหรือภาพประกอบก็อยู่ในข้อยกเว้นนี้เช่นกัน แต่สำหรับข้อความที่สำคัญเพื่อการให้ข้อมูล แม้จะอยู่ในภาพก็ควรมีอัตราความเปรียบต่างที่เหมาะสมเป็นที่แนะนำ

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

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

ตัวอย่างเช่น ด้านล่างนี้เป็นการจัดปุ่มที่มักพบในแบบฟอร์มอีเมลของเว็บไซต์ โดยปุ่มทั้งสองนี้มีอัตราส่วนความต่างของสีพื้นหลังและสีตัวอักษรที่สอดคล้องกับมาตรฐาน AA

◆ ปุ่มที่สอดคล้องกับอัตราส่วนความต่างของสีระดับ AA

ปุ่มอัตราคอนทราสต์ที่เหมาะสม

มักจะคิดว่า 'เพราะอัตราส่วนความต่างของสีผ่านเกณฑ์ จึงมั่นใจได้ในเรื่องการเข้าถึง' แต่เป็นการตัดสินใจที่เร็วเกินไป ปุ่มนี้เมื่อผ่านการมองเห็นสีแบบ D (การมองเห็นสีประเภท 2 แบบ 2 สี)ผ่านตัวกรองแล้วจะเห็นได้ดังนี้

◆ ลักษณะการมองเห็นปุ่มสำหรับผู้ที่มีการมองเห็นสีแบบ D

การมองเห็นปุ่มสำหรับผู้มีภาวะบกพร่องทางการมองเห็นสีประเภท D

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

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

หากเป็น Uniweb ผู้ใช้สามารถปรับความเปรียบต่างได้เอง

หากไม่มีทรัพยากรสำหรับตรวจสอบความต่างของสีในเว็บไซต์ของบริษัท คุณสามารถใช้บริการของเราเครื่องมือเพื่อความสามารถในการเข้าถึง '[ [1] ]'เราแนะนำให้ติดตั้ง Uniweb ซึ่งเพียงแค่เพิ่มโค้ด 1 บรรทัดลงในซอร์สของเว็บไซต์ ก็สามารถใช้งานฟังก์ชันการเข้าถึงที่หลากหลายได้ทันทีการติดตั้งใช้งานได้ทันทีในวันเดียวกันเป็นเครื่องมือแบบปลั๊กอินที่ใช้งานได้อย่างง่ายดาย

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

◆ ฟังก์ชันการปรับอัตราส่วนความต่างของสีของ Uniweb

ตัวอย่างคอนทราสต์ของ Uniweb

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

◆ หน้าจอการจัดการของ Uniweb

หน้าจอการจัดการของ Uniweb

ที่มุมล่างขวาของบทความนี้คลิกที่ "ไอคอนรูปคนวงกลมสีน้ำเงิน"เมนูการเข้าถึงของ Uniweb จะปรากฏขึ้น นอกจากการสลับความต่างของสีแล้วยังมีฟังก์ชันการเข้าถึงหลากหลายประเภทอีกด้วย โปรดลองใช้งานฟังก์ชันของ Uniweb ดูด้วยตัวเอง

สรุป

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

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

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

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

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

การประเมินความเข้าถึงได้ฟรี (Uniweb)

เครื่องมือตรวจสอบความเปรียบต่าง

เริ่มต้นด้วยการขอข้อมูลเบื้องต้นง่าย ๆ

จะแนะนำเกี่ยวกับฟังก์ชันและขั้นตอนการนำเข้าของUniweb

ขอเอกสาร