DevTools (فقط برای توسعه)
پنلی کوچک که روی صفحه‌ی خودتان باز می‌شود: ممیزی دسترس‌پذیری با پرش به عنصر مشکل‌دار، گزارش زنده‌ی رویدادهای bana:*، تعویض تم/پالت/تراکم و بررسی پشتیبانی مرورگر. چیزی از HTML شما را تغییر نمی‌دهد. ماژول devtools لازم است.
سه راه روشن کردن: صفت data-devtools روی <html>، افزودن ?bana-devtools به نشانی صفحه، یا فراخوانی Bana.devtools.enable(). همین صفحه را با ?bana-devtools باز کنید و دکمه‌ی پایین صفحه را بزنید.
| تب | کار |
|---|---|
| ممیزی | قانون‌ها: lang، dir، alt تصویر، نام دسترس‌پذیر دکمه/لینک، برچسب فیلد، id تکراری، ترتیب heading، یک h1، tabindex مثبت، اندازه هدف لمسی (۲۴×۲۴) و کنتراست متن. روی هر مورد بزنید تا عنصر روشن شود. |
| رویدادها | همه‌ی رویدادهای bana:* با زمان و جزئیات. |
| تم | حالت روشن/تیره/سیستم، شش پالت و سه تراکم. |
| محیط | نسخه، ماژول‌های ثبت‌شده و پشتیبانی Popover API، :has()، oklch() و … |
<html lang="fa" dir="rtl" data-devtools>
// or from code
Bana.devtools.enable();
const issues = Bana.devtools.audit(); // [{ id, title, level, elements }]این ابزار برای توسعه است.ممیزی خودکار فقط بخشی از مشکلات را می‌بیند (کنتراست روی گرادیان/تصویر بررسی نمی‌شود) و جایگزین تست با Screen Reader و کاربر واقعی نیست. آن را برای کاربران نهایی روشن نگذارید.