الواجهات والتصميم

فحص إمكانية الوصول (axe-core)

فحص تلقائي لمشاكل إمكانية الوصول وتقديم اقتراحات لتحسين تجربة جميع المستخدمين.

Claude Code Copilot Cursor Codex

نظرة عامة

فحص إمكانية الوصول باستخدام axe-core يمكّن وكيل البرمجة من اكتشاف مشاكل الوصول في تطبيقات الويب تلقائياً. يفحص العناصر مقابل معايير WCAG 2.1 ويقدم اقتراحات محددة للإصلاح.

يستطيع الوكيل تشغيل axe-core على صفحات التطبيق عبر Playwright، تحليل النتائج وتصنيف المشاكل حسب الخطورة، ثم تطبيق الإصلاحات مباشرة على الكود. المشاكل الشائعة تشمل نقص alt text والتباين اللوني وبنية العناوين.

أساسية لتطبيقات الويب التي تحتاج امتثال WCAG وتريد ضمان تجربة جيدة لجميع المستخدمين بما فيهم ذوي الاحتياجات الخاصة.

لمن هذه الأداة؟

مطوري الويب الذين يريدون مواقع متوافقة مع WCAG
فرق التطوير الملتزمة بمعايير إمكانية الوصول
مطورين حكوميين يحتاجون امتثال Section 508
مختبري QA الذين يفحصون إمكانية الوصول تلقائياً

التثبيت

إعداد Claude Code

npm install -D @axe-core/playwright axe-core

الإعدادات

// tests/a11y.spec.ts
import { test, expect } from "@playwright/test";
import AxeBuilder from "@axe-core/playwright";

test("homepage a11y", async ({ page }) => {
  await page.goto("/");
  const results = await new AxeBuilder({ page }).analyze();
  expect(results.violations).toEqual([]);
});

زيارة المصدر (GitHub)

مهارات مشابهة

الواجهات والتصميم

Figma MCP

تحويل تصاميم Figma إلى كود مباشرة مع الحفاظ على الأنماط والمكونات.

Claude Code Cursor Windsurf

الواجهات والتصميم

توثيق المكونات مع Storybook

إنشاء توثيق تفاعلي لمكونات الواجهة مع أمثلة حية وحالات استخدام.

Claude Code Copilot Cursor

الواجهات والتصميم

Tailwind CSS IntelliSense

إكمال تلقائي ذكي لأصناف Tailwind مع معاينة الألوان والقيم أثناء الكتابة.

Claude Code Copilot Cursor