ឧបករណ៍ពិនិត្យការផ្ទុយពណ៌

ពិនិត្យពណ៌របស់អ្នក

សាកល្បងបន្សំពណ៌ដើម្បីធានាថាវាអនុវត្តតាមស្តង់ដារ WCAG សម្រាប់អានអក្សរបាន។

ការផ្ទុយ

លទ្ធផលអក្សរ

ល្អ

បានប្រៀបធៀប: #FFFFFF លើ #B331C3

អក្សរ

16px, ធម្មតា (400)

រាប់ជាអក្សរធម្មតា។

AA (WCAG 1.4.3): យ៉ាងតិច 4.5:1
ឆ្លងកាត់
AAA (WCAG 1.4.6): យ៉ាងតិច 7:1
ត្រូវការបន្ថែម 1.94
មិនឆ្លងកាត់

ផ្នែក UI និងក្រាហ្វិក

រូបតំណាង, ស៊ុមបញ្ចូល, សូចនាករភាពផ្តោត និងផ្នែកផ្សេងៗដែលអ្នកត្រូវឃើញដើម្បីប្រើចំណុចប្រទាក់។

AA (WCAG 1.4.11): យ៉ាងតិច 3:1
ឆ្លងកាត់

វិធីសាស្រ្តកំណត់

ពណ៌ដែលបានប្រៀបធៀប (បន្ទាប់ពីការលាយ): អក្សរ #FFFFFF លើផ្ទៃ #B331C3
ភាពភ្លឺដែលប្រភេទសើម: អក្សរ 1.0000, ផ្ទៃ 0.1572
រូបមន្ត: (L1 + 0.05) / (L2 + 0.05) ដែល L1 ជាបរិមាណភ្លឺរបស់ពណ៌ដែលភ្លឺជាង និង L2 ជាបរិមាណភ្លឺរបស់ពណ៌ដែលងងឹត។
អត្រាផ្លាស់ភាពនាពិតប្រាកដ: 5.0674 ទៅ 1, បង្ហាញជា 5.06 ទៅ 1. តម្លៃដែលបង្ហាញត្រូវបានកាត់ មិនមែនបង្គត់ទេ ដូច្នេះវាមិនមើលទៅល្អជាងការពិតឡើយ។ តម្លៃពិតប្រាកដគឺជាអ្វីដែលប្រៀបធៀបនឹងតម្រូវការ។

ទំហំអក្សរ: 16px, ធម្មតា (400)

រាប់ជាអក្សរធម្មតា។ អក្សរធំមានទំហំយ៉ាងតិច 24px (18pt) ឬយ៉ាងតិច 18.67px (14pt) ប្រសិនបើជាអក្សរដិត (កម្រាស់ 700 ឬលើសនេះ)។ ទំហំត្រូវបានបង្ហាញដោយកាត់ មិនមែនបង្គត់ទេ។

ក្រមវិទ្យា

ពណ៌អក្សរ

ពណ៌ផ្ទៃខាងក្រោយ

ទំហំអក្សរ (px)

ទំងន់អក្សរ

ចំណងជើងមើលជាមុន

ចចកពណ៌ត្នោតលោតលើឆ្កែខ្ជិល

គំរូអត្ថបទតូច (12px)

អត្ថបទ

#ffffff

ផ្ទៃខាងក្រោយ

#b331c3

ស្តង់ដារ WCAG

កម្រិត AA

អត្រាផ្ទុយអប្បបរមា 4.5:1 សម្រាប់អក្សរធម្មតានិង 3:1 សម្រាប់អក្សរធំ។ ត្រូវការសម្រាប់គេហទំព័រច្រើន។

កម្រិត AAA

អត្រាផ្ទុយកាន់តែប្រសើរ 7:1 សម្រាប់អក្សរធម្មតានិង 4.5:1 សម្រាប់អក្សរធំ។ សូមណែនាំសម្រាប់ការចូលប្រើបានល្អបំផុត។

គណនាអត្រាផ្ទុយរវាងអក្សរនិងពណ៌ផ្ទៃខាងក្រោយ។

ជ្រើសរើសពណ៌ដោយប្រើ color picker សម្រាប់អក្សរនិងពណ៌ផ្ទៃខាងក្រោយ ឬបញ្ចូលពណ៌ក្នុងទ្រង់ទ្រាយ RGB hexadecimal (ឧ. #259 ឬ #2596BE)។ អ្នកអាចកែសម្រួលបន្ទះរមូរដើម្បីជ្រើសរើសពណ៌។ គោលការណ៍ណែនាំសម្រាប់ការចូលប្រើមាតិកាបណ្តាញ (WCAG) មានគោលការណ៍ណែនាំជាក់លាក់ដើម្បីជួយកំណត់ថាអក្សរអាចអានបានសម្រាប់អ្នកប្រើដែលមានការមើលឃើញ។ លក្ខណៈវិនិច្ឆ័យនេះប្រើអាល់ហ្គរីធម៍ពិសេសមួយដើម្បីផ្គូផ្គងបន្សំពណ៌ទៅក្នុងអត្រាដែលអាចប្រៀបធៀបបាន។ ដោយប្រើរូបមន្តនេះ WCAG បានបញ្ជាក់ថា អត្រាផ្ទុយពណ៌ 4.5:1 ជាមួយអក្សរនិងផ្ទៃខាងក្រោយគឺគ្រប់គ្រាន់សម្រាប់អក្សរធម្មតា (body) ហើយអក្សរធំ (18+ pt ធម្មតា ឬ 14+ pt ដិត) គួរតែមានអត្រាផ្ទុយពណ៌យ៉ាងហោចណាស់ 3:1។

លក្ខណៈពិសេសសំខាន់ៗ

ការគណនាអត្រាប្រកួតគ្នាជាក់ស្តែង
ការត្រួតពិនិត្យភាពឆបគ្នា WCAG AA & AAA
HSL sliders សម្រាប់ការកែសម្រួលលម្អិត
ទម្រង់មើលជាមុនច្រើន

ឧបករណ៍កម្រិតខ្ពស់

ការកែសម្រួលពណ៌ដោយស្វ័យប្រវត្តិ
គំរូអក្សរ និងផ្ទៃខាងក្រោយ
ការរកឃើញឈ្មោះពណ៌
នាំចេញលទ្ធផល

សំណួរដែលគេសួរញឹកញាប់

សម្រាប់ការអនុលោម WCAG AA អក្សរធម្មតាត្រូវការអត្រាផ្ទុយអប្បបរមា 4.5:1 ខណៈអក្សរធំ (18pt ឬ 14pt ដិត) ត្រូវការ 3:1។

WCAG AAA ទាមទារអត្រាផ្ទុយខ្ពស់ជាង៖ 7:1 សម្រាប់អក្សរធម្មតា និង 4.5:1 សម្រាប់អក្សរធំ ធៀបនឹង AA ដែលមាន 4.5:1 និង 3:1 រៀងគ្នា។

ប្រើមុខងារកែតម្រូវស្វ័យប្រវត្តិរបស់យើង ដើម្បីកែអក្សរ ឬផ្ទៃខាងក្រោយ ខណៈរក្សាគោលបំណងរចនារបស់អ្នក ឬកែពណ៌ដោយដៃដោយប្រើរបារ HSL ដែលមានសញ្ញាមើលឃើញបង្ហាញតំបន់ល្អបំផុតសម្រាប់ការអនុលោម AA/AAA។

តំបន់ពណ៌បៃតង និងសញ្ញា AA/AAA បង្ហាញជួរល្អបំផុតសម្រាប់ការអនុលោម WCAG។ ការណែនាំទិស (ភ្លឺជាង/ងងឹតជាង) ជួយអ្នកឱ្យទៅរកការផ្ទុយកាន់តែប្រសើរ ដោយផ្អែកលើការផ្គុំពណ៌បច្ចុប្បន្នរបស់អ្នក។

បាន។ អ្នកអាចបញ្ចូលលេខកូដ HEX ណាមួយ ឬប្រើឧបករណ៍ជ្រើសរើសពណ៌ ដើម្បីជ្រើសពណ៌ផ្ទាល់ខ្លួន។ URL ត្រូវបានធ្វើបច្ចុប្បន្នភាពដោយស្វ័យប្រវត្តិ ដូច្នេះអ្នកអាចចែករំលែកការផ្គុំពណ៌ជាក់លាក់។