Typography Rollout Plan (sooyaBlg)

Goal

게시글 전체에서 폰트 계층(제목/소제목/본문/메타/코드)을 일관되게 정리해, 읽기 흐름과 시각적 안정감을 개선한다.

Phase 1 — Global Baseline (완료)

  • 전역 타이포 토큰 추가 (--fs-*, --lh-*, --font-*)
  • 본문 기본 line-height/크기 정규화
  • 포스트 제목/메타 계층 재정의
  • 본문 h2/h3/h4 간격/크기 체계화
  • 리스트/문단 리듬 정리

Phase 2 — Component Tuning

  • 홈 카드/포스트 리스트 타이포 미세조정
  • Hero/CTA 텍스트 대비 및 시선 흐름 재정렬
  • 모바일(<=600px)에서 줄바꿈/행간 재조정

Phase 3 — Post-by-Post QA (순차 진행)

우선순위: 최근 게시글 → 트래픽 높은 게시글 → 나머지

각 게시글 점검 항목:

  1. H2/H3 깊이와 문단 길이 밸런스
  2. 코드블록 앞뒤 문맥 간격
  3. 리스트/인용문 가독성
  4. 모바일에서 2~3스크린 실제 읽기 테스트

Phase 4 — Regression Guard

  • typography 체크리스트 문서화
  • 신규 글 템플릿에 헤딩/문단/코드 규칙 반영

Done Criteria

  • 최근 10개 게시글에서 시각적 계층 일관성 확인
  • 모바일/데스크톱 모두 제목-본문-코드 흐름 안정
  • 신규 게시글 작성 시 추가 수정 없이 같은 톤 유지

Progress Log

  • 2026-03-12: 최근 게시글 1차 QA(5개) 적용
    • 대상: 2026-03-12, 2026-03-11(2), 2026-03-10, 2026-03-08 최신 글
    • 작업: H2 제목 톤 통일, 섹션 계층(H2/H3) 정리, 내부 링크 섹션 명칭 통일
  • 2026-03-12: 2차 리듬 보정(코드 블록 + 모바일)
    • 대상: 전 게시글 공통 스타일(assets/main.scss)
    • 작업: 코드 블록 전/후 문맥 간격 규칙 추가, 헤딩 직후 코드블록 간격 축소, 모바일 전용 간격 미세보정
  • 2026-03-12: 최근 10개 게시글 계층 QA 완료
    • 대상: 최신 10개 게시글(H2/H3 구조, 섹션 라벨)
    • 작업: 구형 포맷 글 3건의 H2 톤 정규화(문제/원칙/실전 예시/요약/내부 링크), 내부 링크 섹션명 통일
    • 다음: 신규 글 작성용 회귀 방지 체크리스트(템플릿) 확정