기능(seo): fantazzk.com 도메인 기반 SEO 메타데이터 전면 적용 (#81)

[TransparentDeveloper]

Summary

• src/lib/seo/ 모듈 추가: buildMeta() 헬퍼, 사이트 상수, 단위 테스트
• app.html에 기본 og/twitter 메타 추가, +layout.svelte에 JSON-LD WebApplication 스키마 주입
• 7개 페이지(/, /templates/create, /sandbox/[id], /auction/[id], /draft/[id], /lobby/[id], /result/[id])에 buildMeta() + <svelte:head> 적용
• Logo.svelte Svelte 컴포넌트 신규 추가 — 5개 테마 CSS 변수에 반응
• static/og-image.png (1200×630) 신규 추가, static/logo.png (512×512) 신규 추가
• package.json description, homepage 갱신, GitHub 리포 홈페이지 fantazzk.com으로 업데이트
• layout.css 5개 테마에 --color-accent-deep, --color-accent-dark 토큰 추가

Test plan

• bun test — seo/meta 단위 테스트 5개 통과 확인
• 개발 서버에서 각 페이지 <title>, og:image 메타 확인 (DevTools > Elements)
• 사이드바 로고가 테마 전환(gold/pink/cyan/magenta/orange) 시 색상 정상 변경 확인
• OG 이미지(/og-image.png) 브라우저에서 직접 열어 확인

Closes #81

🤖 Generated with Claude Code

[TransparentDeveloper]

자동 리뷰 결과

아키텍처

#	심각도	파일	문제	제안
1	Major	src/lib/seo/constants.ts	아키텍처 규칙 2 위반 — src/lib/seo/는 목표 아키텍처에 정의되지 않은 신규 최상위 모듈. constants.ts와 meta.ts는 도메인 무관 순수 함수/상수로 utils/에 배치해야 함	src/lib/utils/seo.ts로 통합 후 import 경로 업데이트
2	Major	src/lib/seo/meta.ts	동일 — buildMeta는 도메인 무관 순수 헬퍼로 utils/에 속함	src/lib/utils/seo.ts로 이동

시맨틱/접근성

#	심각도	파일	문제	제안
1	Major	src/routes/auction/[id]/+page.svelte:490	<section>에 heading 없음 — <span>만으로는 section landmark 규칙 위반	<span> → <h2>로 교체 또는 sr-only heading + aria-labelledby 조합
2	Minor	src/routes/auction/[id]/+page.svelte:371	aria-live="polite" 중첩 — 외부 <div>와 내부 <span> 둘 다 aria-live 보유, 이중 공지 가능성	내부 <span>의 aria-live 제거
3	Major	src/routes/draft/[id]/+page.svelte:354	팀 로스터 펼치기/접기 버튼에 aria-expanded, aria-controls 없음	aria-expanded={isExpanded} + aria-controls="team-roster-{id}" 추가
4	Major	src/routes/sandbox/[templateId]/+page.svelte:95	<main role="alert"> — role="alert"가 main 랜드마크 role을 덮어써 랜드마크 탐색에서 main 사라짐	<main><p role="alert">...</p></main>으로 분리
5	Major	src/routes/result/[id]/+page.svelte:121	<main role="alert"> — 동일 문제	<main><p role="alert">...</p></main>으로 분리
6	Minor	src/routes/lobby/[id]/+page.svelte:148	<h2> 내부에 동적 메시지 수가 혼합 — heading 탐색 시 숫자 포함 전체 문구 낭독	<h2>로비 채팅</h2> 분리, 카운트는 aria-live="polite" span으로 외부 배치

Reviewed by: arch-reviewer + semantic-markup-reviewer agents

[TransparentDeveloper]

피드백 처리 완료

• 반영: 2건
• 반박: 6건

#	처리	내용
1	✅ 반영 (54c39c2)	src/lib/seo/ 디렉토리를 src/lib/utils/seo.ts로 통합. 테스트도 utils/__tests__/seo.test.ts로 이동. 9개 파일 import 경로 업데이트
2	✅ 반영 (54c39c2)	동일 커밋
3	↩️ 반박	auction/[id]/+page.svelte section heading — 이 PR 범위 밖 기존 코드
4	↩️ 반박	auction/[id]/+page.svelte aria-live 중첩 — 이 PR 범위 밖 기존 코드
5	↩️ 반박	draft/[id]/+page.svelte 버튼 aria-expanded — 이 PR 범위 밖 기존 코드
6	↩️ 반박	sandbox/+page.svelte main role=alert — 이 PR 범위 밖 기존 코드
7	↩️ 반박	result/+page.svelte main role=alert — 이 PR 범위 밖 기존 코드
8	↩️ 반박	lobby/+page.svelte h2 동적 카운트 — 이 PR 범위 밖 기존 코드

a11y 항목 3–8은 별도 이슈로 트래킹 권장