디자인 #디자인#Astro

✨ Astro-Theme-Aither를 선택한 이유

2026-01-03 · 443자 · 2분

텍스트 자체가 아름답다고 믿는 AI 네이티브 Astro 테마.

텍스트 자체가 아름답다고 믿는 AI 네이티브 Astro 테마. Astro-Theme-Aither는 장식이 아닌 글을 위해 찾아오는 독자를 위해 만들어졌습니다.

디자인 철학

대부분의 블로그 테마는 히어로 이미지, 애니메이션, 사이드바, 팝업으로 시선을 끌려 합니다. 이런 것들은 읽기에 도움이 되지 않습니다 — 보기에 도움이 될 뿐이고, 그것은 완전히 다른 활동입니다.

Astro-Theme-Aither는 정반대의 접근을 취합니다: 미니멀한 디자인이지, 미니멀한 엔지니어링이 아닙니다. 문제를 가려줄 화려한 비주얼이 없으면 모든 타이포그래피 결함, 모든 로딩 지연, 모든 인터랙션 끊김이 증폭됩니다. 미니멀한 디자인은 더 낮은 것이 아닌 더 높은 엔지니어링 품질을 요구합니다.

타이포그래피

서체가 곧 시각적 아이덴티티입니다. 모든 페이지는 통합된 산세리프 시스템 폰트 스택을 사용합니다 — 깔끔하고, 빠르고, 플랫폼 간 일관적입니다. 타이포그래피 파라미터는 Apple Human Interface Guidelines를 따릅니다:

  • 폰트 크기 — 17px 기본, 편안한 화면 읽기를 위한 최적점
  • 행 높이 — 1.47, 읽기 흐름을 깨지 않으면서 각 줄에 여유를 줌
  • 자간 — -0.022em, 본문 텍스트를 세련되게 만드는 미묘한 조임
  • 제목 스케일 — 31px → 22px → 19px → 17px, 크기 극단 없이 명확한 계층
  • 읽기 너비 — 줄당 65~75자로 제한, 눈이 가장 편안하게 추적하는 범위

이것들은 수십 년간의 화면 가독성 연구와 Apple 타이포그래피 표준에서 도출된 근거 기반 실천입니다.

Astro 기반

Astro는 오늘날 콘텐츠 중심 사이트에 가장 적합한 프레임워크입니다. 기본적으로 정적 HTML을 출력합니다 — 명시적으로 선택하지 않는 한 클라이언트 사이드 JavaScript가 없습니다. 아일랜드 아키텍처는 인터랙티브 컴포넌트가 독립적으로 하이드레이트되고 나머지 페이지는 정적으로 유지됩니다.

Astro-Theme-Aither에서 인터랙티브 아일랜드는 최소화되어 있습니다:

  • 테마 전환기 — View Transitions API 원형 공개 애니메이션을 사용한 라이트 / 다크 / 시스템 토글
  • 언어 전환기 — localStorage 지속성을 가진 매끄러운 로케일 전환
  • 로케일 감지 — 브라우저 언어를 자동 감지하고 전환을 제안
  • 모바일 네비게이션 — 반응형 햄버거 메뉴

나머지는 모두 순수 HTML과 CSS로, 즉시 로드됩니다.

기능

  • Tailwind CSS v4 — 전체 라이트/다크 팔레트 커스터마이징이 가능한 @theme 디자인 토큰
  • Apple HIG 타이포그래피 — 17px / 1.47 / -0.022em 본문 텍스트 파라미터
  • View Transitions API — 테마 전환을 위한 원형 공개 애니메이션
  • i18n — 자동 브라우저 언어 감지를 포함한 다국어 지원
  • 글 고정 — 중요한 글을 목록 상단에 고정
  • Content Collections — 빌드 타임 프런트매터 유효성 검사를 포함한 타입 안전 Markdown
  • 다크 모드 — localStorage 지속성을 가진 라이트 / 다크 / 시스템
  • SEO — Open Graph, 정규 URL, 글별 메타 설명
  • RSS + 사이트맵 — 자동 생성, 설정 불필요
  • Google Analytics — 선택 사항, Partytown Web Worker에서 실행
  • 테스트 — Vitest 유닛 테스트 + Playwright E2E, CI에 통합
  • Cloudflare Pages — PR 미리보기 URL이 포함된 배포 워크플로우

누구를 위한 것인가

좋은 글이 스스로 말하고 그 믿음을 존중하는 테마를 원한다면:

  • 개인 블로거 — 글이 전면에 나오길 원하는 분
  • 기술 작가 — 훌륭한 코드 블록 렌더링과 명확한 산문 서식이 필요한 분
  • 다국어 저자 — 자동 브라우저 언어 감지가 포함된 내장 i18n이 필요한 분
  • 개발자 — 자신 있게 확장할 수 있는 잘 엔지니어링된 코드베이스를 좋아하는 분

무엇이든 쓰세요 — 타이포그래피가 멋지게 만들어줄 것입니다.

끝 · 읽어주셔서 감사합니다

댓글

Giscus를 설정하면 댓글을 사용할 수 있습니다.