# عناصر باید حداقل آستانه‌های نسبت کنتراست رنگ را برآورده کنند

<https://www.fixreports.com/fa/issues/color-contrast>

WCAG ⁨1.4.3 Contrast (Minimum)⁩ · سطح ⁨AA⁩

برخی متن‌ها به اندازه کافی از پس‌زمینه خود متمایز نیستند تا افراد کم‌بینا بتوانند آن‌ها را بخوانند.

## این قاعده چه چیزی را بررسی می‌کند
بررسی می‌کند که کنتراست میان رنگ متن و پس‌زمینه حداقل آستانه‌های نسبت کنتراست WCAG 2 در سطح AA را برآورده کند.

## چرا اهمیت دارد
WCAG 1.4.3 برای متن معمولی نسبت کنتراست دست‌کم 4.5:1 و برای متن بزرگ 3:1 را الزامی می‌کند. قیمت‌ها، نشان‌ها و بنرهای کم‌رنگ برای افراد کم‌بینا، و برای همه در نور شدید، به‌سختی خوانده می‌شوند.

## نحوه رفع
### در هر وب‌سایت
1. متن کم‌کنتراست را پیدا کنید و رنگ متن و پس‌زمینه آن را یادداشت کنید: یک ابزار بررسی کنتراست یا ابزارهای توسعه‌دهنده مرورگر هر دو را نشان می‌دهند.
2. رنگ متن یا پس‌زمینه را در CSS قالب خود تغییر دهید تا نسبت کنتراست دست‌کم 4.5:1 شود (3:1 برای متن 24px و بزرگ‌تر، یا متن پررنگ 18.66px).
3. به نشان‌های حراج، متن placeholder، لینک‌های فوتر و دکمه‌های روی تصاویر توجه ویژه داشته باشید.

### در Shopify
1. متن کم‌کنتراست را پیدا کنید و رنگ متن و پس‌زمینه آن را یادداشت کنید: یک ابزار بررسی کنتراست یا ابزارهای توسعه‌دهنده مرورگر هر دو را نشان می‌دهند.
2. در Online Store > Themes > Customize > Theme settings > Colors، رنگ متن را تیره‌تر یا پس‌زمینه را روشن‌تر کنید، برای همان طرح رنگی که مشکل دارد، تا نسبت کنتراست دست‌کم 4.5:1 شود.
3. به نشان‌های حراج، متن placeholder، لینک‌های فوتر و دکمه‌های روی تصاویر توجه ویژه داشته باشید.

### در WooCommerce و WordPress
1. متن کم‌کنتراست را پیدا کنید و رنگ متن و پس‌زمینه آن را یادداشت کنید: یک ابزار بررسی کنتراست یا ابزارهای توسعه‌دهنده مرورگر هر دو را نشان می‌دهند.
2. رنگ متن یا پس‌زمینه را در CSS قالب خود تغییر دهید تا نسبت کنتراست دست‌کم 4.5:1 شود (3:1 برای متن 24px و بزرگ‌تر، یا متن پررنگ 18.66px).
3. به نشان‌های حراج، متن placeholder، لینک‌های فوتر و دکمه‌های روی تصاویر توجه ویژه داشته باشید.

## نحوه بررسی اصلاح
- اسکن را دوباره اجرا کنید و مطمئن شوید ⁨color-contrast⁩ دیگر نمایش داده نمی‌شود.
- با یک ابزار بررسی کنتراست، رنگ‌های دقیق را به‌صورت نمونه‌ای بررسی کنید.

## منابع
- مستندات قاعده axe-core (Deque): https://dequeuniversity.com/rules/axe/4.13/color-contrast
- توضیح معیار WCAG 1.4.3 (W3C): https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum
