Communitygithub.com

thedaviddias/Front-End-Checklist

CSS 및 JavaScript로 구현된 모달, 오버레이, 팝업, 쿠키 배너, 뉴스레터 가입 대화상자, 프로모션 오버레이를 분석하고, SEO와 접근성(WCAG 포커스 관리) 영향을 평가합니다.

Front-End-Checklist란 무엇인가요?

이 스킬은 프론트엔드 구현에서 흔히 사용되는 모달, 오버레이, 팝업, 쿠키 배너, 뉴스레터 가입 다이얼로그, 프로모션 오버레이 등을 검토하는 데 특화되어 있습니다. `position: fixed`, `position: absolute`와 높은 z-index 값, 배경 오버레이, 페이지 로드 시 또는 직후에 모달을 표시하는 JavaScript 코드를 식별합니다. 또한 Google 검색 엔진 최적화(SEO) 측면에서 콘텐츠가 색인에 미치는 영향과 WCAG 지침에 따른 포커스 관리 접근성 문제를 함께 고려합니다. 이 스킬은 프론트엔드 코드베이스(HTML, CSS, JavaScript)를 분석하는 모든 AI 에이전트(Claude Code, Cursor, Codex 등)와 통합되어, 개발자가 웹 접근성과 검색 엔진 친화성을 유지하면서 사용자 경험을 개선할 수 있도록 돕습니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add thedaviddias/Front-End-Checklist
원본 보기→모든 스킬 둘러보기

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

OpenAIChatGPTClaudeClaudeGeminiGeminiGrokGrokPerplexityPerplexityDeepSeekDeepSeek

문서

Front-End-Checklist은(는) 무엇을 하나요?

CSS 및 JavaScript로 구현된 모달, 오버레이, 팝업, 쿠키 배너, 뉴스레터 가입 대화상자, 프로모션 오버레이에 적용됩니다. position: fixed, position: absolute와 함께 높은 z-index 값, 배경 오버레이, 페이지 로드 시 또는 직후에 모달을 표시하는 JavaScript를 확인하세요. Google의 SEO 영향과 접근성(WCAG 포커스 관리)을 모두 고려하세요.

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

thedaviddias/interstitials

Use when applies to CSS and JavaScript implementations of modals, overlays, pop-ups, cookie banners, newsletter sign-up dialogs, and promotional overlays. Check for `position: fixed`, `position: absolute` with large z-index, backdrop overlays, and JavaScript that shows modals on page load or shortly after. Consider both SEO impact (Google) and accessibility (WCAG focus management).

관련 스킬

steipete/video-frames

Extract frames or short clips from videos using ffmpeg.

community

steipete/summarize

Summarize or transcribe URLs, YouTube/videos, podcasts, articles, transcripts, PDFs, and local files.

community

openclaw/openclaw

Use when testing, fixing, or extending the OpenClaw Control UI GUI with Vitest + Playwright end-to-end checks, mocked Gateway WebSocket flows, mocked dashboard runs, screenshots/videos, or agent-verifiable browser proof.

community

obra/superpowers

Obra superpowers agent skills.

community

affaan-m/ECC

See, Understand, Act on video and audio. See- ingest from local files, URLs, RTSP/live feeds, or live record desktop; return realtime context and playable stream links. Understand- extract frames, build visual/semantic/temporal indexes, and search moments with timestamps and auto-clips. Act- transcode and normalize (codec, fps, resolution, aspect ratio), perform timeline edits (subtitles, text/image overlays, branding, audio overlays, dubbing, translation), generate media assets (image, audio...

community

affaan-m/everything-claude-code

End-to-end marketing campaign planning and execution. Covers audience research, positioning, campaign angle definition, landing page copy, email sequences, social posts, ad copy, short-form video scripts, and content calendars. Use as the orchestration layer for multi-channel product launches. Use when planning or executing a multi-channel product launch, or producing landing page, email, social, or ad copy.

community