نکات DevTools: متن با کنتراست کم را کشف و رفع کنید

سوفیا املیانوا
Sofia Emelianova

متن کم کنتراست مهمترین مشکل دسترسی در وب است. در فوریه 2022، 83.9٪ از میلیون ها صفحه اصلی برتر این مشکل را داشتند. برای کسب اطلاعات بیشتر ، گزارش WebAIM Million 2022 را بررسی کنید.

Chrome DevTools به شما امکان می‌دهد تمام مشکلات کنتراست را در یک نگاه کشف کنید و با یک کلیک آن‌ها را برطرف کنید.

ویدیو را تماشا کنید تا یاد بگیرید چگونه:

  • نسبت کنتراست را در راهنمای ابزار بازرس و مقادیر نسبت توصیه شده را در Color Picker مشاهده کنید.

    نسبت‌های کنتراست در یک راهنمای ابزار، با انتخابگر رنگ برای اندازه‌گیری نسبت رنگ‌های جایگزین در دسترس هستند. درجه بندی AA و AAA جیره در دسترس است.

  • در انتخابگر رنگ ، رنگ های پیشنهادی را انتخاب کنید یا رنگی را زیر خطوط نسبت کنتراست انتخاب کنید تا با دستورالعمل های WebAIM مطابقت داشته باشد.

    خطوط نسبت کنتراست توصیه شده در پیش نمایش سایه ها در انتخابگر رنگ موجود است.

  • تمام مشکلات کنتراست را در پانل های CSS Overview و (پیش نمایش) مسائل کشف کنید.

    مشکلات کنتراست فهرست شده در پانل CSS Overview و برگه Issues.

  • کمبودهای بینایی را تقلید کنید تا بفهمید صفحه شما برای همه کاربران چگونه به نظر می رسد.

    بینایی تار در برگه Rendering انتخاب شده و در viewport شبیه سازی شده است.

برای تجربه یادگیری عملی تر، به آموزش خوانایی وب سایت خود را نگاه کنید.

برای کسب اطلاعات بیشتر، نگاه کنید به: