o2o-infinith-demo/index.html
Haewon Kam 7dff2b7244 fix: Pretendard self-host + 한글 시스템 폰트 fallback 체인 강화
데모 환경에서 CDN(jsdelivr)·Google Fonts 차단된 망에서 Pretendard 가
로드되지 않아 명조체로 렌더링되는 문제 해결.

- public/fonts/PretendardVariable.woff2 self-hosting (~2MB, weight 45-920)
- @font-face 직접 정의 + <link rel="preload"> 로 첫 페인트 가속
- fallback 체인에 Apple SD Gothic Neo / Malgun Gothic / Noto Sans KR 추가
  → 어떤 OS에서도 한글이 명조체로 떨어지지 않음
- 기존 jsdelivr CDN 은 백업 경로로 유지 (3중 안전망)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-15 11:03:04 +09:00

22 lines
1.1 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>INFINITH - Infinite Marketing</title>
<!-- Self-hosted Pretendard Variable preload (CDN 차단 망 대비) -->
<link rel="preload" href="/fonts/PretendardVariable.woff2" as="font" type="font/woff2" crossorigin />
<!-- Google Fonts: Inter + Playfair Display (영문 — fallback 안전) -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,900;1,400&display=swap" rel="stylesheet">
<!-- 백업 CDN (self-host 실패 대비) -->
<link rel="stylesheet" as="style" crossorigin href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css" />
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>