Статический сайт

Этот проект готов для развертывания на бесплатных платформах хостинга статических сайтов.

Варианты бесплатного хостинга

1. GitHub Pages (рекомендуется)

Плюсы:

• Интеграция с GitHub
• Простое развертывание
• Бесплатный SSL
• Кастомный домен
• Полная поддержка CSS, JavaScript и анимаций
  • CSS-анимации (@keyframes, transition)
  • JavaScript и любые библиотеки
  • Все статические файлы (изображения, шрифты и т.д.)

Как развернуть:

1. Создайте репозиторий на GitHub
2. Загрузите файлы в репозиторий
3. Перейдите в Settings → Pages
4. Выберите ветку (обычно main) и папку (обычно / или /root)
5. Сайт будет доступен по адресу: https://ваш-username.github.io/название-репозитория

Ограничения:

• Публичные репозитории бесплатно
• Приватные репозитории требуют GitHub Pro

Настройка кастомного домена (например, tort.vi):

⚠️ Распространенные ошибки:

Ошибка 1: "InvalidDomainError - Domain is not a valid domain"

Эта ошибка означает, что GitHub не может распознать домен как валидный. Возможные причины и решения:

1. Опечатка в названии домена

   • Проверьте правильность написания (например, vichka.chech может быть vichka.check)
   • Домены пишутся без пробелов и специальных символов (кроме дефиса)

2. Домен не существует или не зарегистрирован

   • Убедитесь, что домен действительно зарегистрирован
   • Проверьте домен на сайте WHOIS или просто попробуйте открыть его в браузере

3. Неправильный формат

   • ✅ Правильно: tort.vi, www.example.com, subdomain.domain.com
   • ❌ Неправильно: http://tort.vi, https://www.example.com, tort.vi/, tort.vi (с пробелами)

4. Поддомен без настройки DNS

   • Если используете поддомен (например, subdomain.example.com), сначала настройте DNS у регистратора
   • GitHub может не распознать поддомен, если DNS записи еще не созданы

5. Специальные домены (.tk, .ml, .ga, .cf)

   • Некоторые бесплатные домены могут не работать с GitHub Pages
   • Попробуйте использовать другой домен или подождите, пока домен полностью активируется

Как исправить:

• Убедитесь, что домен введен без http:// или https://
• Убедитесь, что домен введен без слеша в конце (/)
• Проверьте, что домен существует и зарегистрирован
• Если это поддомен, сначала настройте DNS записи (см. Шаг 2 ниже)

Ошибка 2: "DNS check unsuccessful"

Это значит, что DNS записи не настроены правильно.

Шаг 1: В GitHub

1. Перейдите в Settings → Pages вашего репозитория
2. В разделе "Custom domain" введите ваш домен:
   • ✅ Правильно: tort.vi, www.example.com
   • ❌ Неправильно: http://tort.vi, https://www.example.com, tort.vi/
3. Нажмите "Save"
4. GitHub автоматически создаст файл CNAME в корне репозитория

Если вы видите ошибку "InvalidDomainError":

• Проверьте правильность написания домена (возможна опечатка)
• Убедитесь, что домен зарегистрирован и существует
• Удалите все http://, https://, слеши / и пробелы
• Если это поддомен, сначала настройте DNS записи (см. Шаг 2)

Шаг 2: Настройка DNS записей

Вам нужно настроить DNS записи у вашего регистратора домена (где вы покупали tort.vi). Есть два варианта:

Вариант А: Использовать apex domain (tort.vi) Добавьте DNS запись типа A:

• Тип: A
• Имя: @ или tort.vi (или оставьте пустым)
• Значение: 185.199.108.153 (можно добавить все 4 IP адреса GitHub):
  • 185.199.108.153
  • 185.199.109.153
  • 185.199.110.153
  • 185.199.111.153
• TTL: 3600 или по умолчанию

Вариант Б: Использовать поддомен www (www.tort.vi) - РЕКОМЕНДУЕТСЯ Добавьте DNS запись типа CNAME:

• Тип: CNAME
• Имя: www
• Значение: ваш-username.github.io (например, romasenkevich.github.io)
• TTL: 3600 или по умолчанию

Вариант В: Использовать оба (tort.vi И www.tort.vi)

1. Настройте A записи для apex domain (как в варианте А)
2. Настройте CNAME для www (как в варианте Б)
3. В GitHub введите tort.vi (без www)

Шаг 3: Ожидание

• После настройки DNS подождите 10-60 минут (время распространения DNS)
• Нажмите "Check again" в GitHub Pages settings
• DNS должен провериться успешно

Шаг 4: HTTPS

• GitHub автоматически выдаст SSL сертификат через несколько минут
• Убедитесь, что галочка "Enforce HTTPS" включена

Проверка DNS: Можете проверить, правильно ли настроены записи, используя команду:

# Для apex domain
dig tort.vi +short

# Для www поддомена
dig www.tort.vi +short

Должны вернуться IP адреса GitHub (185.199.108.153 и т.д.) или CNAME запись.

Важно:

• Не используйте www в поле Custom domain в GitHub, если хотите использовать tort.vi без www
• Если используете apex domain (tort.vi), GitHub также автоматически настроит www.tort.vi
• Убедитесь, что файл CNAME в репозитории содержит только домен (без http/https)

---

2. Netlify

Плюсы:

• Автоматическое развертывание при push в Git
• Отличная поддержка форм
• CDN по всему миру
• Бесплатный SSL и кастомные домены

Как развернуть:

1. Зарегистрируйтесь на netlify.com
2. Перетащите папку с файлами на страницу "Sites"
3. Или подключите репозиторий GitHub для автоматического деплоя

Ограничения:

• 100 GB трафика/месяц
• 1000 форм отправок/месяц

---

3. Vercel

Плюсы:

• Очень быстрый CDN
• Автоматическое развертывание
• Отличная производительность
• Бесплатный SSL

Как развернуть:

1. Зарегистрируйтесь на vercel.com
2. Установите Vercel CLI: npm i -g vercel
3. В папке проекта выполните: vercel
4. Или подключите репозиторий GitHub через веб-интерфейс

Ограничения:

• 100 GB трафика/месяц
• Бесплатно для персональных проектов

---

4. Cloudflare Pages

Плюсы:

• Неограниченные запросы и пропускная способность
• Автоматическое развертывание
• Отличная скорость благодаря сети Cloudflare
• Бесплатный SSL

Как развернуть:

1. Зарегистрируйтесь на pages.cloudflare.com
2. Подключите репозиторий GitHub/GitLab
3. Настройте сборку (для статики обычно не требуется)

Ограничения:

• Практически нет ограничений на бесплатном плане
• Один из лучших вариантов для высокого трафика

---

5. GitLab Pages

Плюсы:

• Аналогично GitHub Pages
• Бесплатно для публичных и приватных репозиториев
• CI/CD встроен

Как развернуть:

1. Создайте репозиторий на GitLab
2. Загрузите файлы
3. Настройте CI/CD через файл .gitlab-ci.yml

Ограничения:

• Меньше известен, чем GitHub Pages

---

Структура проекта

.
├── index.html      # Главная страница
├── styles.css      # Стили
├── README.md       # Этот файл
└── example-animated.html  # Пример с анимациями (опционально)

Поддержка технологий

Все платформы поддерживают:

• ✅ HTML5
• ✅ CSS3 (включая анимации, transitions, flexbox, grid)
• ✅ JavaScript (ES6+, можно использовать библиотеки)
• ✅ CSS-анимации (@keyframes, animation, transition)
• ✅ Внешние библиотеки (React, Vue, jQuery и т.д. - если собраны статически)
• ✅ Изображения, шрифты, видео

GitHub Pages работает как обычный веб-сервер - если файлы загружаются в браузер, они будут работать!

Локальный запуск

Просто откройте index.html в браузере или используйте простой HTTP сервер:

# Python 3
python3 -m http.server 8000

# Node.js (npx)
npx serve

# PHP
php -S localhost:8000

Затем откройте в браузере: http://localhost:8000

Рекомендация

Для простых статических сайтов рекомендую:

1. GitHub Pages - если у вас уже есть GitHub аккаунт
2. Netlify - если нужен автоматический деплой и формы
3. Cloudflare Pages - если нужен максимальный бесплатный лимит трафика