왜 Astro + GitHub Pages인가?

기술 선정

by AI개발자
ChatGPT, Claude, Gemini에게 인용되는 사이트 설계법.png

AI 크롤러는 JavaScript를 실행하지 않습니다. 그래서 정적인 HTML이 가장 강력합니다.

LLMO 관점에서 웹사이트를 설계할 때 가장 중요한 원칙은 AI가 콘텐츠를 확실하게 읽을 수 있도록 만드는 것입니다.

많은 AI 크롤러는 브라우저처럼 JavaScript를 실행하지 않고, HTTP로 HTML을 가져와 그대로 분석합니다.


따라서 정적 HTML 기반 사이트가 LLMO에 가장 유리합니다.


1. LLMO 최적화에 적합한 기술 스택

LLMO에 최적화된 사이트를 구축하기 위해 다음 네 가지 기준으로 기술 스택을 선택했습니다.

llmo-004.png


2. 왜 Astro인가?

정적 사이트 생성기 중에서 LLMO 구현에 가장 적합한 도구가 Astro입니다.

LLMO 시대의 웹사이트는 “JavaScript 앱”이 아니라 “AI가 읽을 수 있는 문서”여야 합니다.


AI 크롤러는 브라우저처럼 JavaScript를 실행하지 않는 경우가 많습니다.

대신 HTTP로 HTML을 가져와 그대로 분석합니다.

따라서 LLMO 관점에서는 다음과 같은 특성이 중요합니다.


정적 HTML 출력

Markdown 기반 콘텐츠

구조화 데이터 제공

단순한 URL 구조


이 기준에서 비교해 보면 다음과 같습니다.


정적 사이트 생성기 비교

llmo-005.png

Astro를 선택한 이유는 다음 4가지입니다.


① Zero JS by default

Astro는 빌드 시 순수 HTML을 생성합니다.

기본적으로 클라이언트 JavaScript를 전송하지 않습니다.

GPTBot, ClaudeBot 같은 AI 크롤러는 브라우저가 아니라 단순 HTTP 클라이언트로 동작하기 때문에 JavaScript 없이도 콘텐츠를 완전히 읽을 수 있어야 합니다.


[Tip] LLMO 관점에서 중요한 점
Astro는 빌드 시 JavaScript 없이 정적 HTML을 생성합니다.
즉 AI 크롤러가 JavaScript 실행 없이도 모든 콘텐츠를 읽을 수 있습니다.


② API 라우트 지원

Astro에서는 .md.ts 파일 하나로 Markdown 엔드포인트를 생성할 수 있습니다.

이 기능이 바로 URL.md 패턴 구현의 핵심입니다.

Next.js나 Gatsby에서도 구현은 가능하지만 설정이 훨씬 복잡해 집니다.


③ Tailwind CSS 통합

@tailwindcss/vite 플러그인으로 별도 설정 없이 Tailwind를 바로 사용할 수 있습니다.


④ sitemap 자동 생성

@astrojs/sitemap을 사용하면 빌드 시 sitemap.xml이 자동 생성됩니다.


따라서

구글 Search Console

네이버 Search Advisor

에 제출할 사이트맵을 별도로 관리할 필요가 없습니다.


React가 LLMO에 불리한 이유

React 단독으로 구축한 사이트는 보통 SPA(Client Side Rendering) 방식입니다.

즉 초기 HTML이 다음처럼 비어 있는 경우가 많습니다.


<div id="root"></div>

<script src="/app.js"></script>


브라우저는 JavaScript를 실행해 콘텐츠를 렌더링하지만

AI 크롤러는 JavaScript를 실행하지 않는 경우가 많습니다.


그 결과:

콘텐츠 파싱 실패

마크다운(Markdown) 접근 불가

구조화 데이터 인식 저하

그래서 React를 사용할 경우에도 보통

Next.js (SSG)

Astro

Gatsby


같은 정적 빌드 프레임워크를 함께 사용합니다.


왜 Wordpress(워드프레스)는 적합하지 않는가?

국내에서 가장 많이 사용되는 CMS인 WordPress는 LLMO 관점에서는 몇 가지 한계가 있습니다.

llmo-006.png

다만 이미 WordPress를 사용 중이라면 다음 요소들은 그대로 적용할 수 있습니다.


llms.txt

JSON-LD

메타 태그


단 URL.md 패턴 구현만큼은 Astro 전환을 권장합니다.



3. 왜 GitHub Pages인가?

호스팅 서비스 비교

llmo-007.png

GitHub Pages를 선택한 이유는 다음 네 가지입니다.


① 완전 무료

커스텀 도메인 + HTTPS 포함 입니다.

호스팅 비용 0원이지만 단, 도메인 구입 비용(연 1~3만 원)만 필요합니다.


② 저장소 공개 = 개발자 신뢰성

public 저장소로 사이트를 운영하면 방문한 개발자가 소스코드를 직접 확인할 수 있습니다.

기술 블로그나 포트폴리오 사이트에서는 강력한 신뢰 신호가 됩니다.


③ GitHub Actions 자동 배포

git push만 하면 약 30초 내 자동 빌드 및 배포가 됩니다.


④ HTTPS 자동 관리

GitHub Pages는 Let's Encrypt 인증서를 자동 발급 및 갱신합니다.


LLMO 관점에서의 추가적인 장점 – 저장소 공개

GitHub Pages에서 저장소를 public으로 설정하면 AI가 소스코드 자체도 참고 자료로 활용할 수 있습니다.

GPT 계열 모델의 학습 데이터에는 GitHub 공개 저장소 코드가 대량으로 포함되어 있습니다.


즉,

사이트 소스코드를 공개하는 것 자체가 LLMO 효과를 높일 수 있습니다.

지금 바로 작가의 멤버십 구독자가 되어
멤버십 특별 연재 콘텐츠를 모두 만나 보세요.

brunch membership
AI개발자작가님의 멤버십을 시작해 보세요!

AI Workflow Automation Architect, AI LLM Performance Engineer, Vibe Engineering, Cursor/Claude Code,

82 구독자

오직 멤버십 구독자만 볼 수 있는,
이 작가의 특별 연재 콘텐츠

  • 최근 30일간 9개의 멤버십 콘텐츠 발행
  • 총 29개의 혜택 콘텐츠
최신 발행글 더보기
이전 02화SEO 다음은 LLMO다!