퍼블리싱 체크리스트
퍼블리싱 작업 완료 후, 코드리뷰 또는 QA 전에 아래 항목을 빠르게 확인합니다.
1. 접근성
- 제목 구조가 자연스러운가
- 버튼과 링크 역할이 올바른가
- 폼 라벨이 연결되어 있는가
- placeholder만으로 의미를 전달하지 않는가
- 포커스 표시가 보이는가
- 키보드만으로 주요 기능을 사용할 수 있는가
- 이미지
alt가 목적에 맞는가 - 색상만으로 상태를 구분하지 않는가
- 아이콘 버튼에 대체 텍스트 또는
aria-label이 있는가 - 모션 축소 환경(
prefers-reduced-motion)을 고려했는가
2. 웹표준 / 구조
- 시맨틱 태그를 적절히 사용했는가
- 불필요한
div중첩이 많은가 - 제목/본문/목록 구조가 문서 의미를 잘 드러내는가
- 인라인 스타일 사용이 최소화되어 있는가
-
!important남용이 없는가 - 상태 표현이 클래스 기준으로 일관되게 관리되는가
3. 스타일 시스템
- 컬러, 간격, radius, shadow, motion이 토큰화되어 있는가
- 반복 코드가 mixin/function으로 정리되어 있는가
- nesting이 과도하지 않은가
- 공통 컴포넌트 상태값(default/hover/focus/active/disabled)이 정의되어 있는가
- 하드코딩 값이 과도하지 않은 가
4. 반응형
- 모바일 기준에서 먼저 확인했는가
- 태블릿 구간에서 레이아웃이 어색하지 않은가
- 데스크톱 구간에서 과도하게 늘어지지 않는가
- 긴 텍스트/운영 데이터가 들어와도 깨지지 않는가
- 고정 높이/고정 폭 때문에 내용이 잘리지 않는가
5. 성능
- 큰 이미지가 최적화되었는가
- 이미지에
width,height가 명시되어 있는가 - lazy loading이 필요한 곳에 적용되었는가
- 웹폰트 종류와 굵기가 과도하지 않은가
- 무거운 애니메이션(
width,height,top,left)을 피했는가 - 첫 화면 렌더를 막는 불필요한 자원이 없는가
- 레이아웃 점프(CLS)가 발생하지 않는가
6. 기능 / 운영 확인
- 버튼 클릭 동작이 정상인가
- 폼 입력/제출이 정상인가
- 링크 이동이 정상인가
- 이미지/배너/공지/팝업이 운영 조건에 맞게 노출되는가
- 오탈자와 문구 오류가 없는가
7. Core Web Vitals 참고 기준
- LCP 2.5초 이하 목표
- INP 200ms 이하 목표
- CLS 0.1 이하 목표
8. 최종 확인
- 실제 기기 또는 브라우저에서 최종 확인했는가
- 변경 범위 외 화면에 영향이 없는가
- 배포 후 캐시 이슈 가능성을 확인했는가
- 요청 사항과 반영 결과가 일치하는가