Web Coder
技能 已验证 活跃Expert 10x engineer with comprehensive knowledge of web development, internet protocols, and web standards. Use when working with HTML, CSS, JavaScript, web APIs, HTTP/HTTPS, web security, performance optimization, accessibility, or any web/internet concepts. Specializes in translating web terminology accurately and implementing modern web standards across frontend and backend development.
To serve as a definitive guide and reference for all aspects of modern web development, enabling users to accurately translate terminology and implement best practices.
功能
- Expert knowledge across 15 web development domains
- Accurate translation of web terminology
- Context-aware responses for frontend, backend, DevOps
- Step-by-step workflows for common tasks
- Comprehensive reference materials for all competencies
使用场景
- Working with HTML, CSS, JavaScript, or any web markup/styling/scripting
- Implementing web APIs or discussing HTTP/HTTPS protocols
- Building accessible applications or optimizing web performance
- Understanding web security measures or development tools
非目标
- Implementing specific backend server logic
- Writing or debugging application-specific code
- Deploying or managing infrastructure
工作流
- Identify the domain of the web-related requirement.
- Consult the relevant reference file for terminology and best practices.
- Translate colloquial terms to technical equivalents.
- Apply web standards (W3C/WHATWG specifications) as guidance.
- Implement solutions following modern patterns and conventions.
- Validate against standards for accessibility, performance, and security.
实践
- Semantic HTML usage
- Responsive design principles
- Accessibility best practices
- Performance optimization techniques
- Web security implementation
先决条件
- Basic understanding of at least one area of web development
- Access to web development tools (browser, editor, terminal)
- Understanding that web development spans multiple disciplines
安装
npx skills add github/awesome-copilot通过 npx 运行 Vercel skills CLI(skills.sh)— 需要本地安装 Node.js,以及至少一个兼容 skills 的智能体(Claude Code、Cursor、Codex 等)。前提是仓库遵循 agentskills.io 格式。
质量评分
已验证类似扩展
Fixing Accessibility
100审计和修复 HTML 可访问性问题，包括 ARIA 标签、键盘导航、焦点管理、颜色对比度和表单错误。在添加交互式控件、表单、对话框或审查 WCAG 合规性时使用。
Color Audit
100Color-only audit to extract, evaluate, and recommend improvements for the project's color system
Type Audit
100Typography-only audit covering font selection, type scale, readability, hierarchy, performance
Layout Audit
100Layout and spacing audit covering grid, spacing consistency, density, responsive behavior
Develop Web Game
100Use when Codex is building or iterating on a web game (HTML/JS) and needs a reliable development + testing loop: implement small changes, run a Playwright-based test script with short input bursts and intentional pauses, inspect screenshots/text, and review console errors with render_game_to_text.
Epic Design
99Build immersive, cinematic 2.5D interactive websites using scroll storytelling, parallax depth, text animations, and premium scroll effects — no WebGL required. Use this skill for any web design task: landing pages, product sites, hero sections, scroll animations, parallax, sticky sections, section overlaps, floating products between sections, clip-path reveals, text that flies in from sides, words that light up on scroll, curtain drops, iris opens, card stacks, bleed typography, and any site that should feel cinematic or premium. Trigger on phrases like "make it feel alive", "Apple-style animation", "sections that overlap", "product rises between sections", "immersive", "scrollytelling", or any scroll-driven visual effect. Covers 45+ techniques across 8 categories. Always inspects, judges, and plans assets before coding. Use aggressively for ANY web design task.