Files
vizitka-site/README.md
T
aibrashandClaude Sonnet 5.5 152f1d60b5 Сайт-визитка: главная, архитектура, проекты
- Главная: фото, факты, соцсети, форма связи, анимации
- Архитектура: карточки проектов и отдельные страницы (Тихий двор, павильон, «Лофт»)
- Проекты: Aman's World (скриншоты, описание) и хоумлаб
- Меню из config.json, шаблон новых страниц, черновики training/work/fixed
- Чистый HTML/CSS/JS без сборки, шрифты и картинки локально

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
2026-11-04 16:35:52 +05:00

4.5 KiB
Raw Blame History

Сайт-визитка

Одна страница на чистом HTML + CSS + JS, без сборки и бэкенда.

web/index.html     главная страница
web/arch/          список проектов, у каждого своя страница: web/arch/<проект>/
web/projects/      список проектов, у каждого своя страница: web/projects/<проект>/ (сейчас Aman's World)
web/training|work|fixed/  заготовки будущих страниц (черновики)
templates/page.html шаблон новой страницы
web/config.json    всё содержимое: имя, статус, описание, теги, почта, соцсети, фото
web/css, js, fonts стили, скрипт, шрифты (локально)
web/og/home.png    превью для соцсетей 1200x630
web/404.html       страница 404

Что править

Только web/config.json. Всё, где username, example.com и TODO, заменить своим. Скриншоты игры лежат в web/img/proj/. Картинки архитектуры лежат в web/img/arch/ в трёх размерах: имя.webp, имя-md.webp, имя-sm.webp (телефонам отдаются лёгкие). Новый проект в архитектуре: скопируйте любую страницу web/arch/<проект>/index.html, замените текст и картинки, добавьте карточку в web/arch/index.html и адрес в sitemap.xml. Фото: положите файл в web/img/ и впишите путь в photo (например "/img/me.webp", квадрат от 192 px). Если photo пустое, показываются инициалы.

Страницы

Опубликованы web/arch/ и web/projects/ (в обеих карточки ведут на страницы проектов). Заготовки (черновики) лежат в web/training/ (Тренировки), web/work/ (Работа), web/fixed/ (Фикс). Сейчас это черновики: их нет в меню, а поисковикам они закрыты (noindex).

Опубликовать готовую страницу:

  1. Заполните текст в web/<имя>/index.html (абзацы, заголовки h2, ссылки оформятся сами).
  2. В web/config.json в pages у нужной записи уберите "draft": true: она появится в меню на всех страницах.
  3. В самой странице удалите строку <meta name="robots" content="noindex">.
  4. Добавьте адрес в web/sitemap.xml.

Новая страница с нуля: скопируйте templates/page.html в web/<имя>/index.html, правьте так же, а в pages добавьте { "label": "Название", "url": "/<имя>/" }. Пока в pages нет опубликованных страниц, на главной меню не показывается.

Запуск локально

python3 -m http.server 8787 --directory web    # открыть http://localhost:8787

Выкладка

Это просто статика: скопируйте папку web/ на сервер и раздайте любым веб-сервером. Пример для Caddy (HTTPS получится сам):

my.domain {
	root * /srv/visit-site/web
	encode zstd gzip
	file_server
	handle_errors {
		rewrite * /404.html
		file_server
	}
	header {
		Content-Security-Policy "default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; font-src 'self'; connect-src 'self'; object-src 'none'; frame-ancestors 'none'"
		X-Content-Type-Options "nosniff"
		Referrer-Policy "strict-origin-when-cross-origin"
		-Server
	}
}

Потом подставьте домен в превью и поисковые файлы:

sed -i 's|https://example.com|https://my.domain|g' web/index.html web/robots.txt web/sitemap.xml

Если сервер стоит дома, лучше публиковать через Cloudflare Tunnel или держать его в отдельной сети, а не рядом с остальными устройствами.

Проверено

Ширина 360 px без горизонтального скролла, вес страницы около 38 КБ вместе со шрифтами, Lighthouse (mobile и desktop) см. ниже в сообщении.