건강 영양 운동 생활형 홈페이지 150선 V1
제작일: 2026-10-18

열기: 압축을 모두 풀고 index.html을 브라우저로 여세요.
001.html~050.html: 건강 / 051.html~100.html: 영양 / 101.html~150.html: 운동
원본 분야별 번호는 manifest.json과 사이트목록.csv에서 확인합니다.
css/common.css: 공통 기반, 15개 디자인 계열, 150개 번호별 독립 스타일을 한 파일로 정리했습니다.
js/common.js: 체크리스트, 한 줄 기록, 응원 버튼, 상세 보기.
js/catalog.js: 전체 목록의 이름 검색과 분류 필터.
images/: 150개 개별 SVG 이미지. 외부 이미지 주소나 CDN 의존성이 없습니다.

디자인: 15개 기본 구조에 10개 변주를 결합했습니다. 번호마다 배색, 타이포그래피, 이미지, 섹션 순서를 달리했습니다. 150개를 각각 수작업으로 독립 설계한 것은 아닙니다.
기록: 해당 브라우저 localStorage에 저장합니다. 기기 간 동기화, 계정, 실제 게시판 공유, 서버 저장은 없습니다. file:// 환경의 저장 허용 여부는 브라우저마다 다릅니다.
예시: 커뮤니티 이야기와 상세 콘텐츠는 화면 체험용입니다. 실제 이용자나 건강 효과를 나타내지 않습니다.
이미지: 직접 제작한 SVG 일러스트입니다. 실제 활동 사진이 아닙니다.
검증: HTML 내부 참조, HTML 150개, 이미지 150개, CSS 문법, JS 문법을 확인합니다. 브라우저 화면 검증은 별도입니다.

수정: HTML의 본문과 css/common.css의 .site-001 같은 번호별 영역을 수정하면 됩니다. HTML에는 style 태그와 style 속성을 넣지 않았습니다.
참고 디자인 자료: https://webflow.com/blog/web-design-trends-2026 (2026-10-18 확인)
