開発
#browser
carousel-accessibility
Use when reviewing templates, rendered HTML, or shared components related to Make carousels accessible. Validate the final browser-facing markup, not just the source framework abstraction.
DeepseekModel
キュレーション済みスキル
品質 優秀 · 90
v1.0.0
取得
https://deepseekmodel.com/api/download.php?id=thedaviddias-front-end-checklist-skills-carousel-accessibility-skill-md&format=skill
ダウンロード .skill
標準形式。system_prompt と model_config を収録し、任意の Agent で利用可能
.skill ファイルの system_prompt フィールドの実際の内容。
name carousel-accessibility description Use when reviewing templates, rendered HTML, or shared components related to Make carousels accessible. Validate the final browser-facing markup, not just the source framework abstraction. metadata {"category":"html","priority":"medium","difficulty":"advanced","estimatedTime":"30","source":"frontendchecklist.io","url":"https://frontendchecklist.io/en/rules/html/carousel-accessibility"} Make carousels accessible Auto-playing carousels without controls trap users, cause disorientation, and violate WCAG requirements—proper implementation ensures all users can interact with slideshow content. Quick Reference Always provide pause/stop controls for auto-rotating carousels Support keyboard navigation with arrow keys and tab Use aria-live regions to announce slide changes Respect prefers-reduced-motion preference Check Verify carousels have pause/play controls, keyboard navigation, proper ARIA roles, and respect prefers-reduced-motion. Fix Implement carousels with pause buttons, arrow key navigation, aria-live for announcements, and motion preference support. Explain Explain accessibility requirements for carousels including auto-play controls, keyboard access, and screen reader support. Code Review Review templates, server-rendered HTML, and shared components that output markup related to Make carousels accessible. Flag exact elements, attributes, and routes where the rendered HTML violates the rule. For full implementation details, code examples, and framework-specific guidance, see references/rule.md . Rule page: https://frontendchecklist.io/en/rules/html/carousel-accessibility
このスキルを起動するキーワード。クリックでコピーできます。
このスキルにはトリガーワードがありません。
ダウンロードした .skill に含まれるフィールド。
| フィールド | 説明 |
|---|---|
| format | フォーマット識別子（skill/v1） |
| skill_id | スキル固有 ID |
| name | スキル名 |
| version | バージョン |
| description | 説明 |
| category | カテゴリ（配列） |
| trigger_words | トリガーワード |
| tags | タグ |
| source | ソース |
| source_url | ソース URL（本ページ） |
| exported_at | エクスポート日時（ダウンロード毎） |
| system_prompt | システムプロンプト本文 |
| model_config | モデル設定：provider / model / temperature / max_tokens / top_p |
| examples | サンプル |
| install_guide | 各プラットフォームの導入説明（Coze / Dify / Claude / カスタム） |
