GitHub Pages — это встроенный в GitHub хостинг статических сайтов. Пушите код в репозиторий, через пару минут сайт уже онлайн по адресу username.github.io, с HTTPS и поддержкой собственного домена. Бесплатно, без захода на сервер по SSH, без ручной загрузки файлов.

Я в первый раз собрал так личную страницу за вечер — просто чтобы проверить, как работает связка «репозиторий → сайт». Оказалось, что для статики это один из самых быстрых маршрутов до публикации. Ниже разберём, что GitHub Pages умеет, чего не умеет, и как за пять минут развернуть свой первый сайт — от создания репозитория до привязки домена.

Ключевое правило: GitHub Pages — это только статика (HTML, CSS, JS). Серверная логика, база данных, авторизация — сюда не входят. Если нужен сервер — смотрите в сторону VPS, Vercel или Cloudflare Workers.

Что это

GitHub Pages — встроенный в GitHub сервис статического хостинга. Берёт HTML, CSS и JavaScript из репозитория, при необходимости прогоняет через сборку (Jekyll, Hugo, Astro, Next.js — что угодно) и публикует как готовый сайт. Адрес по умолчанию — https://username.github.io, но можно привязать собственный домен.

Сервис доступен бесплатно для публичных репозиториев на любом тарифе GitHub. Для приватных — нужен GitHub Pro, Team или Enterprise. Серверный код (PHP, Python, Node.js) не поддерживается принципиально — только то, что можно отдать браузеру как файл.

GitHub сам собирает Jekyll, остальные генераторы — через GitHub Actions. По сути Pages — это готовый CI/CD для статики: пушите код — сайт обновляется.

Зачем нужно

  • **Портфолио или личный сайт.** Один репозиторий username.github.io — и через 5 минут у вас есть работающий сайт с HTTPS.
  • Документация к проекту. Папка /docs в репозитории с включённым Pages — пользователи получают удобный сайт вместо README.
  • Блог на статическом генераторе. Jekyll, Hugo, Astro, 11ty — пишете посты в Markdown, пушите, блог обновляется.
  • Лендинг продукта или услуги. Одностраничник для приложения, бота или сервиса, бесплатно и с кастомным доменом.
  • Прототипы и демо. Запушили HTML/CSS/JS в репозиторий — отправили заказчику ссылку, и он видит результат.
  • **Онлайн-визитка.** Минимальная страница с именем, фото, ссылками на соцсети — создаётся за 10 минут.

Как устроено

ВозможностьЧто даёт
Автоматический деплойПушите код — сайт обновляется сам, без ручных действий
HTTPS из коробкиБесплатный SSL-сертификат на все сайты, включая кастомные домены
Свой доменПривязка любого домена вместо github.io через DNS
GitHub ActionsГибкая сборка: Astro, Hugo, Next.js, Jekyll и любые другие генераторы
Два типа сайтовПользовательский (username.github.io) и проектный (username.github.io/repo)
Jekyll из коробкиВстроенная поддержка Jekyll — пишете в Markdown, получаете сайт

Когда использовать

СитуацияПодходитПочему
Портфолио или личный сайтДаБесплатно, username.github.io, HTTPS автоматически
Документация к проектуДаПапка /docs в репозитории, поддержка Jekyll, Starlight, Docusaurus
Блог на статическом генератореДаHugo, Astro, Jekyll, 11ty деплоятся из GitHub Actions
Лендинг продуктаДаОдна страница с HTML/CSS — заливается за минуту
Прототип для заказчикаДаПушите код — отправляете ссылку, без хостинга
Сайт с серверной логикой (PHP, Node.js)НетPages поддерживает только статику
Интернет-магазин с личным кабинетомНетНужна база данных, сессии, платёжный шлюз
Real-time приложение (чат, коллаборативный редактор)НетWebSocket и серверная логика не поддерживаются

Два типа сайтов

От типа зависит, как назвать репозиторий и по какому адресу будет доступен сайт.

ПараметрПользовательский / организационныйПроектный
Репозиторийusername.github.ioЛюбое название
Адрес сайтаhttps://username.github.iohttps://username.github.io/repo-name
КоличествоОдин на аккаунтБез ограничений
Когда использоватьПортфолио, личный сайт, блогДокументация проекта, лендинг продукта

Пользовательский сайт — один на аккаунт, зато адрес короче. Проектных — сколько угодно, по одному на каждый репозиторий.

Пример

Шаг 1. Создайте репозиторий

  • Зайдите на github.com → New repository.
  • В Repository name введите username.github.io, где username — ваш логин на GitHub.
  • Оставьте репозиторий Public.
  • Поставьте галочку Add a README file.
  • Нажмите Create repository.

Название репозитория должно точно совпадать с вашим логином. Если логин ivanov, репозиторий — ivanov.github.io. Иначе GitHub не распознает его как пользовательский сайт.

Шаг 2. Добавьте index.html

В репозитории нажмите Add file → Create new file, назовите index.html и вставьте минимальную страницу:

<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Мой первый сайт</title>
  <style>
    body {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
      max-width: 800px;
      margin: 0 auto;
      padding: 2rem;
      background: #f8f9fa;
      color: #333;
    }
    h1 { color: #0969da; }
    .card {
      background: white;
      padding: 1.5rem;
      border-radius: 8px;
      box-shadow: 0 1px 3px rgba(0,0,0,0.1);
      margin-top: 1rem;
    }
  </style>
</head>
<body>
  <h1>Привет, мир!</h1>
  <div class="card">
    <p>Это мой первый сайт на GitHub Pages.</p>
    <p>Он работает бесплатно и доступен всему интернету.</p>
  </div>
</body>
</html>

Нажмите Commit changes.

Шаг 3. Включите GitHub Pages

  • Перейдите в Settings репозитория.
  • В боковом меню — Pages (раздел «Code and automation»).
  • Build and deployment → Source → выберите Deploy from a branch.
  • Branch → выберите main и папку / (root).
  • Нажмите Save.

Шаг 4. Проверьте результат

Через 1–2 минуты откройте https://username.github.io — сайт работает.

Первый деплой может занять до 10 минут. Последующие обновления — 1–2 минуты.

Три способа разместить проектный сайт

Допустим, у вас есть репозиторий my-project и вы хотите добавить к нему сайт.

  • **Из корня репозитория** — положите index.html в корень, Settings → Pages → Branch → main и / (root). Адрес: https://username.github.io/my-project.
  • Из папки /docs — создайте папку docs/ в репозитории, положите туда index.html, в Settings → Pages → Branch выберите main и /docs.
  • Отдельная ветка gh-pages — классический подход, сайт живёт в отдельной ветке:
git checkout --orphan gh-pages
git rm -rf .
echo "<h1>Документация проекта</h1>" > index.html
git add index.html
git commit -m "Initial GitHub Pages"
git push origin gh-pages

В Settings → Pages выберите ветку gh-pages.

Деплой через GitHub Actions

GitHub рекомендует деплоить Pages через Actions — больше контроля над сборкой. Критично, если вы используете генераторы сайтов (Astro, Hugo, Next.js).

Переключение: Settings → Pages → Source → GitHub Actions. GitHub предложит готовые шаблоны workflow или можно создать свой вручную.

Деплой статики через actions/configure-pages и actions/deploy-pages:

name: Deploy to GitHub Pages

on:
  push:
    branches: ["main"]

permissions:
  contents: read
  pages: write
  id-token: write

jobs:
  deploy:
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/configure-pages@v5
      - uses: actions/upload-pages-artifact@v3
        with:
          path: "."
      - id: deployment
        uses: actions/deploy-pages@v4

Пример с Astro-сайтом — отдельный шаг сборки и загрузка артефакта из ./dist:

name: Deploy Astro to GitHub Pages

on:
  push:
    branches: ["main"]

permissions:
  contents: read
  pages: write
  id-token: write

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: npm
      - run: npm ci
      - run: npm run build
      - uses: actions/upload-pages-artifact@v3
        with:
          path: ./dist

  deploy:
    needs: build
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    runs-on: ubuntu-latest
    steps:
      - id: deployment
        uses: actions/deploy-pages@v4

Привязка собственного домена

Вместо username.github.io можно использовать свой домен.

Шаг 1. Настройте DNS. У регистратора домена добавьте записи.

Для корневого домена (например, mysite.ru) — четыре A-записи на IP-адреса GitHub Pages:

185.199.108.153
185.199.109.153
185.199.110.153
185.199.111.153

Для субдомена (например, www.mysite.ru) — CNAME-запись:

CNAME www username.github.io.

**Шаг 2. Укажите домен в GitHub.**

  • Settings → Pages → Custom domain → введите ваш домен.
  • Нажмите Save.
  • Поставьте галочку Enforce HTTPS.

DNS-изменения могут занять до 24 часов. Если сайт не открывается сразу — подождите. GitHub автоматически создаст файл CNAME в корне репозитория. Не удаляйте его — без этого файла привязка домена слетит.

Тарифы и лимиты

ПараметрЛимит
Стоимость (публичные репозитории)Бесплатно на любом тарифе GitHub
Стоимость (приватные репозитории)GitHub Pro, Team или Enterprise
Размер репозитория1 ГБ (рекомендация)
Размер опубликованного сайта1 ГБ
Пропускная способность100 ГБ в месяц
Количество деплоев10 в час
Серверный кодНе поддерживается

GitHub Pages — только статика. Если нужна серверная логика, базы данных или авторизация — Vercel, Netlify, Cloudflare Pages или собственный VPS.

Практические сценарии

**Портфолио разработчика.** Репозиторий username.github.io с резюме, списком проектов и контактами. Работающий сайт, который можно отправить вместе с откликом на вакансию.

Документация к проекту. Папка /docs в репозитории с включённым Pages. Пользователи получат удобный сайт вместо чтения README. Для полноценной документации — Starlight или Docusaurus.

Блог. Генератор статических сайтов (Jekyll, Hugo, Astro, 11ty) + GitHub Pages. Пишете посты в Markdown, пушите — блог обновляется.

Лендинг продукта. Одностраничник для приложения, бота или сервиса. Бесплатно, с HTTPS и кастомным доменом.

Прототипы и демо. HTML/CSS/JS прототип можно мгновенно показать заказчику — запушили в репозиторий с Pages, отправили ссылку.

Онлайн-визитка. Минимальная страница с именем, фото, ссылками на соцсети. Создаётся за 10 минут, работает бесплатно.

Совместимые инструменты

  • Jekyll — встроенная поддержка в GitHub Pages, работает без настройки CI/CD. Пишете в Markdown, получаете сайт.
  • Hugo — быстрый генератор на Go. Тысячи страниц за секунды. Деплой через GitHub Actions.
  • Astro — современный фреймворк, минимум JavaScript на выходе. Подходит для контентных сайтов.
  • Cloudflare — бесплатный CDN и DNS поверх GitHub Pages. Ускоряет загрузку и добавляет защиту.
  • Starlight — тема Astro для сайтов документации с поиском, i18n и навигацией из коробки.

Частые проблемы

Сайт не появляется после деплоя. Подождите до 10 минут. Проверьте Settings → Pages: правильный branch и папка. Убедитесь, что в репозитории есть index.html.

404 при переходе на страницу. GitHub Pages чувствителен к регистру. Файл About.html и ссылка на about.html — разные вещи. Всегда используйте нижний регистр в именах файлов.

Кастомный домен не работает. Проверьте DNS-записи. Убедитесь, что файл CNAME существует в репозитории. DNS может обновляться до 24 часов.

**CSS и картинки не грузятся на проектном сайте.** Базовый путь проектного сайта — /repo-name/. Используйте относительные пути (./style.css) вместо абсолютных (/style.css). В генераторах — укажите base или baseURL в конфиге.

Ограничения

Ограничения

Что учитывать перед подключением.

Только статика

PHP, Python, Node.js-бэкенд и любая серверная логика принципиально не поддерживаются.

100 ГБ трафика в месяц

Жёсткий лимит пропускной способности; для крупного медиа-трафика нужно CDN или альтернатива.

10 деплоев в час

Частые коммиты могут упереться в лимит — реже пушить или батчить изменения.

1 ГБ на опубликованный сайт

Большие медиа-библиотеки не влезут; используйте внешний CDN для картинок и видео.

Приватные репозитории

только Pro/Team/Enterprise — На бесплатном GitHub Pages работает только для публичных репозиториев.

DNS-обновление до 24 часов

После смены DNS-записей привязка кастомного домена применяется не сразу.

Чувствительность к регистру

About.html и about.html — разные файлы; только нижний регистр в именах.

Нет preview-деплоев

В отличие от Vercel/Cloudflare Pages, на GitHub Pages нет отдельных URL для каждого PR.

Антипаттерны

Антипаттерны

Чего не делать при работе с GitHub Pages.

Не делать:

хранить сайт в приватном репозитории на Free — Pages для приватных репо требует Pro/Team/Enterprise; на бесплатном тарифе вы получите ошибку деплоя.

Не делать:

использовать абсолютные пути /style.css на проектном сайте — Базовый путь проектного сайта — /repo-name/, и /style.css уйдёт в корень github.io, а не в ваш репозиторий. Используйте ./style.css или настройте base в генераторе.

Не делать:

называть файлы в разном регистре — About.html и about.html — разные файлы для Pages. Ссылка в нижнем регистре на файл в верхнем даст 404.

Не делать:

удалять автоматически созданный CNAME — После привязки кастомного домена GitHub создаёт файл CNAME. Без него привязка слетит при следующем деплое.

Не делать:

ждать, что Pages заменит сервер — Нет ни WebSocket, ни API-эндпоинтов, ни базы данных. Для серверной логики — Workers, VPS или Railway.

Не делать:

пушить в репозиторий сразу несколько крупных изменений подряд — Лимит 10 деплоев в час; частые пуши упрутся в потолок, и часть коммитов не развернётся автоматически.

Не делать:

использовать Jekyll без понимания Gemfile — Jekyll из коробки работает, но как только добавляете плагины — нужен свой Gemfile и CI, иначе деплой упадёт.

Не делать:

деплоить медиа-каталог на тысячи файлов — Лимит 1 ГБ и 10 деплоев/час — для каталога с тысячами картинок GitHub Pages не подходит. Используйте R2/S3 + Cloudflare.

Чеклист

Чеклист

Проверка перед публикацией в открытый доступ.

Репозиторий создан

Для личного сайта — username.github.io, для проектного — любое имя с включённым Pages.

index.html добавлен

Или настроен генератор сайтов с командой сборки и output-папкой.

Pages включён в Settings

Pages — Выбран источник: ветка (branch) или GitHub Actions.

Сайт открывается по адресу

Проверьте https://username.github.io или https://username.github.io/repo-name через 1–10 минут после деплоя.

Кастомный домен привязан

A/CNAME-записи настроены у регистратора, файл CNAME создан в репозитории.

HTTPS включён

Enforce HTTPS поставлен после верификации домена.

Файл .nojekyll добавлен при необходимости

Если не используете Jekyll — добавьте пустой .nojekyll в корень, иначе Pages будет прогонять файлы через Jekyll.

Базовый путь настроен для проектного сайта

В генераторе указан base или baseURL = /repo-name/, ссылки относительные.

Ссылки

Ссылки

По теме

По теме