스타일 가이드

섹션 제목 (제목1)

제목1은 페이지 내 주요 구역의 제목입니다. 페이지에는 보통 여러 개의 h2가 올 수 있습니다.

하위 주제 제목 (제목2)

제목2는 제목1의 하위 주제를 설명할 때 사용합니다. 문단은 명확하고 간결하게 작성합니다.

세부 항목 제목 (제목3)

제목3는 세부적인 내용을 그룹화할 때 유용합니다. 필요하다면 강조기울임을 적절히 사용합니다.

보조 설명 제목 (제목4)

제목4는 문서 구조상 깊이가 더 필요한 경우에만 사용합니다. 과도한 단계 구분은 피합니다.

추가 메모 제목 (제목5)

제목5는 가장 낮은 단계의 제목입니다. 꼭 필요한 경우에만 사용하세요.

표(Table) 예시

표는 thead/tbody를 포함하고, 헤더 셀에는 scope를 지정합니다. 제목 셀에는 th 를 사용합니다.

구분방문자수페이지뷰평균 체류시간
데스크톱12,34058,9023분 12초
모바일21,87574,3312분 45초
태블릿3,1029,8843분 05초
합계37,317143,117

순서 없는 목록 (ul/li) 예시

상위-하위 항목을 단계적으로 나열합니다.

  • 콘텐츠 가이드
    • 문장 길이는 짧고 명확하게
    • 불필요한 외래어 최소화
    • 접근성 고려(대체 텍스트, 의미 요소)
  • 디자인 가이드
    • 가독성 높은 폰트 크기
    • 충분한 대비와 여백
    • 반응형 레이아웃
  • 성능 가이드
    • 이미지 최적화
    • 불필요한 스크립트 지양
    • 캐싱 전략 수립

순서 있는 목록 (ol/li) 예시

절차나 우선순위가 있는 항목에 사용합니다.

  1. 요구사항 정리
  2. 정보 구조 설계
    1. 컨텐츠 모델 정의
    2. 내비게이션 구조 확정
  1. 디자인/퍼블리싱
  2. 개발/테스트
  3. 배포/모니터링

문단과 인라인 요소

링크는 의미가 분명한 텍스트로 제공합니다. 예: 접근성 가이드 보기.

강조가 필요할 때는 strong 또는 em을 사용합니다.

“좋은 마크업은 의미가 선명하고, 구조가 명확하며, 장식과 분리되어야 합니다.”