دسترس‌پذیری و سازگاری
حداقل نسخهٔ مرورگرها و آنچه برای دسترس‌پذیری در نظر گرفته شده است.
مرورگرهای پشتیبانی‌شده#
| مرورگر | حداقل نسخه |
|---|---|
| Chrome و Edge | ۱۱۱ |
| Safari (macOS و iOS) | ۱۶٫۴ |
| Firefox | ۱۲۱ |
حداقل‌ها از ویژگی‌های CSS مدرنی می‌آیند که کیت استفاده می‌کند:
| ویژگی | کاربرد | از نسخهٔ |
|---|---|---|
color-mix() | رنگ‌های کم‌رنگ و سایه‌های هم‌رنگ برند | Chrome ۱۱۱ · Safari ۱۶٫۲ · Firefox ۱۱۳ |
:has() | نمایش تیک اعتبارسنجی کنار فیلد | Chrome ۱۰۵ · Safari ۱۵٫۴ · Firefox ۱۲۱ |
translate / rotate / scale | انیمیشن‌ها و جلوه‌ها | Chrome ۱۰۴ · Safari ۱۴٫۱ · Firefox ۷۲ |
واحد dvh | ارتفاع صفحه در موبایل | Chrome ۱۰۸ · Safari ۱۵٫۴ · Firefox ۱۰۱ |
در مرورگرهای قدیمی‌تر، صفحه‌ها قابل استفاده می‌مانند اما رنگ‌های کم‌رنگ و تیک اعتبارسنجی نمایش داده نمی‌شوند. انتقال نرم هنگام تغییر تم (View Transitions) یک افزودهٔ اختیاری است و در مرورگرهای ناسازگار تم بدون انیمیشن عوض می‌شود.
دسترس‌پذیری#
- صفحه‌کلید: همهٔ اجزا با Tab و Enter قابل استفاده‌اند و حلقهٔ فوکوس همه‌جا دیده می‌شود. پیوند «رفتن به محتوا» ابتدای هر صفحه است.
- فرم‌ها: هر فیلد برچسب دارد؛ پیام خطا با
aria-describedbyبه فیلد وصل می‌شود وaria-invalidبه‌روز می‌شود. خطاها باrole="alert"اعلام می‌شوند. - مودال: فوکوس را درون خود نگه می‌دارد و پس از بسته‌شدن به عنصر بازکننده برمی‌گرداند.
- کد یک‌بارمصرف: هر خانه
aria-labelدارد،inputmode="numeric"کیبورد عددی را باز می‌کند وautocomplete="one-time-code"تکمیل پیامک را فعال می‌کند. - تاست و قدرت رمز: در ناحیهٔ زندهٔ (
aria-live) اعلام می‌شوند. - زبان و جهت:
lang="fa"وdir="rtl"روی<html>؛ فیلدهای ایمیل و موبایلdir="ltr"دارند.
کاهش حرکت#
همهٔ انیمیشن‌ها با CSS هستند. وقتی کاربر prefers-reduced-motion: reduce را فعال کرده باشد، انیمیشن‌ها و انتقال‌ها تقریباً خاموش می‌شوند. حالت forced-colors (کنتراست بالا) برای حاشیه‌ها پشتیبانی پایه دارد.
مهمان‌نواز نسخهٔ ۲٫۰ · مهر ۱۴۰۵فهرست تغییرات