blog
이 페이지는 최신 글, 대표 글, 아카이브로 이어지는 허브 페이지입니다.
buttons 테스트 목적 버튼은 사용자의 행동을 유도하는 가장 중요한 상호작용 요소입니다. primary, secondary, external, utility가 같은 시스템 안에서 분리되어 보여야 합니다. 확인 항목 primary 버튼이 가장 먼저 읽히는가 secondary 버튼이 보조 행동으로 인식되는가 external 행동이 내부 이동과 헷갈리지 않는가 긴 라벨이 줄바꿈되어도 버튼 구조가 유지되는가 shortcode 예시 구조 확인 시작 ...
breadcrumbs 테스트 목적 breadcrumb는 사용자가 지금 어디에 있는지, 어디에서 왔는지 설명합니다. 깊은 구조일수록 중요합니다. 확인 항목 상위 계층이 올바르게 나열되는가 현재 페이지가 마지막에 분명히 표시되는가 모바일에서 길이가 과도하지 않은가 기대 결과 breadcrumb는 현재 문맥을 잃지 않게 해 주는 작은 나침반입니다. ...
color surface 테스트 목적 배경과 카드, 보조 표면의 위계가 분리되어야 합니다. 같은 색을 쓰더라도 역할이 다르면 시각적 레이어가 달라 보여야 합니다. 확인 항목 페이지 배경과 카드가 섞이지 않는가 강조 영역이 너무 많지 않은가 라이트와 다크에서 바탕 인상이 유지되는가 시각 샘플 표면 레이어static 이미지를 사용해 figure 렌더링과 비주얼 계층을 함께 점검합니다. ...
section list 테스트 목적 섹션 목록은 하위 페이지의 질서를 보여 줍니다. 제목, 요약, 카드, 메타가 과도하지 않으면서도 충분히 읽혀야 합니다. 확인 항목 목록 정렬이 예측 가능한가 빈 섹션 상태에서도 UI가 무너지지 않는가 하위 페이지의 요약이 과도하게 길지 않은가 기대 결과 목록 페이지는 많은 정보를 한 화면에 넣는 대신, 사용자가 다음 단계를 고를 수 있게 도와야 합니다. ...
section pages 테스트 목적 섹션 페이지는 하위 콘텐츠를 모으는 허브입니다. 요약, 목록, 읽는 순서가 분명해야 합니다. 확인 항목 섹션 소개와 하위 목록이 충돌하지 않는가 하위 페이지가 많아져도 읽기 쉽나 섹션 허브와 실제 본문이 혼동되지 않는가
alerts 테스트 목적 알림은 주의, 경고, 정보, 성공 상태를 전달합니다. 내용이 짧아도 눈에 띄어야 하지만, 페이지 전체를 지배하면 안 됩니다. 확인 항목 알림이 본문 문단과 혼동되지 않는가 경고와 정보의 계층이 분리되는가 긴 메시지가 들어가도 박스가 무너지지 않는가 raw HTML 예시 검증 알림: 상태 메시지는 본문보다 앞서 읽혀야 합니다. 실패 기준 알림이 본문처럼 보여 버리는 경우 색만 바뀌고 의미 구조가 없는 경우
language switcher 테스트 목적 언어 전환은 단순히 다른 언어 홈으로 보내는 링크가 아니라, 현재 문서의 대응 번역으로 이동해야 합니다. 확인 항목 현재 페이지가 가능한 경우 같은 문서의 다른 언어로 이동하는가 번역이 없을 때 안전한 대체 경로가 있는가 표기와 순서가 언어별로 일관적인가 운영 원칙 secondary 언어를 준비하지 않았다면 구조만 맞추고 본문은 비워 두는 편이 낫습니다. 잘못된 번역 연결보다 비어 있는 구조가 더 안전합니다. ...
upgrade summary 이번에 정리한 것 content/ko를 기준 트리로 재정리 docs/content-structure와 docs/design-system을 기준 문서로 정비 lab/hugo-content-lab을 페이지 타입, 컴포넌트, 마크업, 네비게이션, 구조, 운영으로 분리 blog를 실제 발행 글 형식으로 정리 front matter를 TOML 기준으로 통일 영향 범위 폴더 영향 content/ko/docs 기준 문서가 읽기 쉬워짐 content/ko/lab 검증 포인트가 더 세분화됨 content/ko/blog 운영 글과 검증 글이 분리됨 content/ko/categories, tags taxonomy 진입점이 명확해짐 결론 이번 작업의 핵심은 파일 수를 늘린 것이 아니라, 각 파일의 책임을 분명히 해서 앞으로의 확장이 예측 가능해진 것입니다. ...
update log 변경 기록 형식 항목 설명 날짜 2026-06-23 대상 content/ko 전반 요약 docs와 lab을 중심으로 콘텐츠 구조와 front matter를 정리 영향 탐색, taxonomy, page-hub, shortcode 검증 흐름 개선 메모 모든 콘텐츠는 KO 기준으로 먼저 완성 TOML front matter로 통일 검증용 콘텐츠는 lab에만 배치 운영 글은 blog에서만 유지
edge cases 테스트 목적 UI는 정상 입력에서만이 아니라 엣지 케이스에서 얼마나 버티는지로 품질이 드러납니다. 확인 항목 아주 긴 URL이 줄바꿈을 망치지 않는가 한 줄짜리 강한 강조가 과도하지 않은가 영문과 한글이 뒤섞인 긴 단어가 넘치지 않는가 예시 This page keeps long URLs and English phrases readable even when the surrounding content is in Korean. 이 짧은 예시는 오른쪽 방향 컨테이너도 레이아웃을 깨지 않는지 확인하기 위한 메모입니다.