연재의 마지막 회차입니다. 지금까지 규칙을 넘기고, 이름을 맞추고, 상태를 그리고, 실제 콘텐츠로 검증하고, 편집 영역을 정하고, 척도를 세우고, 규칙 단위로 리뷰했습니다. 이제 배포 직전의 마지막 통과 기준입니다.
아래 목록은 순서가 중요합니다. 앞 단계가 어긋나 있으면 뒤 단계의 확인이 의미를 잃도록 배치했습니다.
1단계 — 규칙이 지켜졌는가
이 단계는 화면을 눈으로 보는 것이 아니라 값의 목록을 보는 단계입니다. 스타일 파일에 팔레트 밖의 색이나 척도 밖의 숫자가 있는지 훑어보면 되고, 여기서 잡히는 문제 하나가 대체로 여러 화면을 동시에 고칩니다.
2단계 — 상태와 예외가 구현됐는가
확인 방법은 간단합니다. 목록 화면에서 아무 필터나 걸어 0건을 만들고, 제목이 가장 긴 항목을 찾아 열고, 존재하지 않는 주소를 직접 입력합니다. 3분이면 세 화면을 다 볼 수 있습니다.
3단계 — 실기기와 접근성
실기기에서는 가로 스크롤이 생기지 않는지, 터치 대상이 충분히 큰지, 고정 요소가 콘텐츠를 가리지 않는지를 봅니다. 브라우저 창을 줄여서는 알 수 없는 것들입니다.
접근성은 별도 작업이 아니라 디자인 품질의 일부입니다. 본문과 배경의 대비, 키보드로 이동할 때 초점이 보이는지, 이미지에 대체 텍스트가 있는지 — 세 가지만 확인해도 대부분의 문제가 걸립니다.
편집자 시나리오는 마지막이자 가장 자주 빠지는 확인입니다. 편집 화면에서 실제로 글을 하나 써 보고, 이미지를 넣어 보고, 제목을 아주 길게 만들어 봅니다. 편집자가 만들 수 있는 최악의 화면이 견딜 만하면 그 설계는 배포해도 됩니다.
연재를 마치며
여덟 회차를 관통한 주장은 하나였습니다 — 넘기는 것은 화면이 아니라 규칙이라는 것. 화면은 유한하고 콘텐츠는 무한하므로, 규칙이 없으면 핸드오프는 끝나지 않습니다.
이어서 볼 만한 연재도 함께 둡니다. 규칙을 실제 테마에 심는 방법은 워드프레스에 디자인 시스템 심기가 단계별로 다루고, 3단계의 접근성 확인을 더 깊이 하려면 접근성은 품질이다가 화면 위에서 점검하는 방법을 정리합니다. 모바일에서 무너지는 구조를 다시 세우는 이야기는 모바일에서 무너지지 않는 레이아웃에 있습니다.
구현 · 성능 · 보안까지 한 번에 정리하고 싶다면 최적화 지원 사업이 한 건으로 처리하고, 우리가 어떤 순서로 작업하는지는 작업 과정에 절차 그대로 공개돼 있습니다.