Skip to content

Latest commit

 

History

History
46 lines (34 loc) · 2.22 KB

File metadata and controls

46 lines (34 loc) · 2.22 KB

0019. 콘텐츠 읽기 흐름에 16px 기준과 17px 본문을 사용한다

Date: 2026-07-13 Status: Accepted

배경

Ark는 글을 탐색하고 읽는 정보 제공 사이트다. 기존 타입 스케일은 일반 기준을 15px, MDX 본문을 16px으로 두었다. 긴 설명과 본문을 읽을 때 한 단계 작은 크기는 모바일과 데스크톱 모두에서 정보 위계를 약하게 만들었다.

llm-wikidrafts/source-notes/toss-web-design-observation-2026-07-13.md는 공개 Toss 웹 관찰에서 읽기 본문 17px, 캡션 13px, 제목과 리드의 뚜렷한 크기·굵기 차이를 기록한다. 이 관찰값을 브랜드 복제로 사용하지 않고, Ark의 Pretendard 기반 콘텐츠 읽기 규칙을 정하는 참고 근거로 사용한다.

결정

  • 일반 인터페이스 기준은 16px, 콘텐츠 요약과 MDX 본문은 17px으로 둔다.
  • 날짜와 예상 읽기 시간은 --text-meta 13px으로, 태그는 접근성을 위해 기존 12px보다 작게 만들지 않는다.
  • 콘텐츠 카드 제목과 리드는 20px, 굵기 700, 1.4 안팎의 줄 높이를 사용한다.
  • 제목 단계는 24px, 28px, 36px, 44px으로 재정렬해 제목과 본문의 차이를 유지한다.
  • 반복되는 역할은 --text-meta, --text-reading 의미 토큰을 사용한다. 전역 UI를 일괄적으로 17px으로 키우지 않는다.

결과

  • 홈, 카테고리, 검색 결과가 공유하는 목록 카드에서 제목·요약·보조 정보의 우선순위가 분명해진다.
  • 글 상세의 MDX 본문은 17px과 기존 1.72 줄 높이로 읽기 폭을 유지한다.
  • 정보 밀도가 중요한 태그와 조작 컨트롤은 불필요하게 커지지 않는다.

검토한 대안

  • 토스의 11px 태그와 단일 폰트를 그대로 복제하기: Ark의 접근성 기준과 기존 Pretendard 정체성을 훼손하므로 채택하지 않는다.
  • 모든 UI 텍스트를 17px으로 통일하기: 탐색 제어와 메타데이터의 밀도가 낮아지므로 채택하지 않는다.
  • 홈 카드에만 개별 픽셀 값을 추가하기: 다른 목록과 본문의 타입 규칙이 다시 분산되므로 채택하지 않는다.

Related History

  • 4772a19 feat(home): 콘텐츠 탐색 표면 정리