메뉴
WCAG 2.1 AA accessibility guidelines for Astro components. Use when creating or modifying .astro files, working on accessibility, ARIA attributes, keyboard navigation, screen readers, semantic HTML, or accessible images.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Astro component conventions and best practices. Use when creating or modifying .astro files in web/, working with Astro props, Tailwind CSS styling, or using custom components like Img, RichText, and Link.
Commit changes following conventional commit conventions.
Internationalization rules for multi-language websites. Use when working on localized text fields in the CMS, Intl formatting (dates, numbers, currencies, lists) in Astro components, or any locale-aware code.
Payload CMS v3 conventions and best practices. Use when working on cms/, creating collections, fields, blocks, access control, or Payload local API queries.
Test the web application using the agent-browser CLI to ensure a feature is working as expected before making a commit.
| name | astro-accessibility |
| description | WCAG 2.1 AA accessibility guidelines for Astro components. Use when creating or modifying .astro files, working on accessibility, ARIA attributes, keyboard navigation, screen readers, semantic HTML, or accessible images. |
This project must meet WCAG 2.1 AA guidelines.
<header>, <nav>, <section>, <article>, <footer>, <ul>, <li><div role="list">)<Img> component and pass the media prop, it includes the correct alt textalt or aria-label to describe the action/purposearia-hidden="true" and alt=""aria-current="page" or aria-current="location" for the current page (e.g. navigation, breadcrumbs)aria-current:font-semibold<ul>, <ol>, <li>role="list" on the containerrole="listitem" on each itemaria-label or visually hidden (sr-only) textlabels.global['skipToMainContent']label tag or aria-label)