|
|
@@ -0,0 +1,95 @@
|
|
|
+{
|
|
|
+# 🌸 Отчет о создании и работе сайта «NOWозыбков»
|
|
|
+
|
|
|
+## 1. 📋 Общая информация о проекте
|
|
|
+
|
|
|
+| Параметр | Описание |
|
|
|
+| :--- | :--- |
|
|
|
+| **Название проекта** | Сайт-портал города Новозыбкова **«NOWозыбков»** |
|
|
|
+| **Владелец проекта** | Сушенок Анастасия Витальевна |
|
|
|
+| **Дата сдачи проекта** | 22.06.2026 |
|
|
|
+| **Адрес сайта** | [http://nastasxo.beget.tech](http://nastasxo.beget.tech) |
|
|
|
+| **Цель проекта** | Создание современного, информативного и эстетически приятного сайта для жителей и гостей города Новозыбкова, объединяющего новости, афишу, справочную информацию и исторические факты. |
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 2. ⚙️ Технические характеристики
|
|
|
+
|
|
|
+* **Тип сайта:** Статичный, одностраничный (лендинг/портал).
|
|
|
+* **Технологии:**
|
|
|
+ * 🏗️ **HTML5 & CSS3:** Чистый код без тяжелых фреймворков.
|
|
|
+ * ⚡ **JavaScript:** Использован для интерактивности (анимация, счетчики, поиск, форма отзывов).
|
|
|
+* **Адаптивность:** ✅ Корректное отображение на всех устройствах (Desktop, Tablet, Mobile).
|
|
|
+* **CMS:** Не используется (ручная верстка для максимальной скорости загрузки).
|
|
|
+* **Хостинг:** Beget.
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 3. 📋 Структура и содержание сайта
|
|
|
+
|
|
|
+Сайт разработан как единая страница (`Single Page Application` стиль) с плавной навигацией по якорям.
|
|
|
+
|
|
|
+### 📋 Основные блоки:
|
|
|
+
|
|
|
+1. **🔝 Шапка сайта:**
|
|
|
+ * Логотип «NOWозыбков».
|
|
|
+ * Навигационное меню.
|
|
|
+ * 🔍 **Строка поиска** для фильтрации контента.
|
|
|
+2. **🖼️ Главный экран (Hero Section):**
|
|
|
+ * Название и краткое описание.
|
|
|
+ * 👥 Счетчик посетителей и пользователей онлайн.
|
|
|
+ * ✨ Декоративные плавающие элементы.
|
|
|
+3. **🏛️ О городе:** Краткая история и описание ключевых достопримечательностей.
|
|
|
+4. **📍 Главные места:** 4 карточки достопримечательностей со ссылками на Wikipedia.
|
|
|
+5. **🎟️ Афиша:** Карточки мероприятий с кнопками покупки билетов.
|
|
|
+6. **📰 Новости города:** 6 актуальных новостей с ссылками на источники.
|
|
|
+7. **📜 История города:** Хронологический список ключевых дат.
|
|
|
+8. **👤 Люди города:** Биографии известных земляков со ссылками на статьи.
|
|
|
+9. **📞 Справочная служба:** Контакты больниц, школ, администрации, МЧС, МФЦ.
|
|
|
+10. **🌤️ Погода:** Виджет текущей температуры (Open-Meteo) + ссылка на Gismeteo.
|
|
|
+11. **💬 Отзывы:** Форма отправки и блок опубликованных комментариев.
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 4. 🚀 Ключевые особенности и функционал
|
|
|
+
|
|
|
+В ходе разработки были реализованы следующие интерактивные функции:
|
|
|
+
|
|
|
+* ✨ **Preloader Animation:** Анимация загрузки с плавающими цветами при старте страницы.
|
|
|
+* 📊 **Счетчик статистики:** Отображение количества посетителей за день (LocalStorage) и пользователей онлайн.
|
|
|
+* 🔎 **Живой поиск:** Фильтрация карточек новостей, афиши и мест в реальном времени.
|
|
|
+* ⬆️ **Кнопка «Наверх:** Появляется при скролле для быстрого возврата к началу.
|
|
|
+* 🎈 **Плавающие украшения:** Анимированные иконки (цветы, сердца, звезды) на главном экране.
|
|
|
+* 🔗 **Интерактивные карточки:** Все элементы кликабельны и ведут на внешние ресурсы.
|
|
|
+* 🌦️ **API Погоды:** Интеграция с сервисом Open-Meteo для отображения актуальной погоды.
|
|
|
+* 📝 **Форма обратной связи:** Возможность оставить отзыв о городе.
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 5. 🎨 Дизайн и визуальное оформление
|
|
|
+
|
|
|
+* **🎨 Цветовая гамма:** Нежные розовые тона (`Soft Pink`), создающие современный и уютный образ.
|
|
|
+* **📐 Стиль:** Минимализм. Акцент на чистоте линий, округлых углах (`border-radius`) и легких тенях (`box-shadow`).
|
|
|
+* **😀 Иконографика:** Использование стандартных эмодзи для быстрой загрузки и универсальности.
|
|
|
+* **🌌 Фон:** Градиентный фон главного экрана с динамическими декоративными элементами.
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 6. 📅 Этапы работы над проектом
|
|
|
+
|
|
|
+1. 💡 **Брифование:** Определение ЦА, структуры и функционала.
|
|
|
+2. 💻 **Кодинг:** Написание HTML-разметки, CSS-стилей и JS-логики.
|
|
|
+3. 📝 **Контент:** Сбор, проверка и верстка информации о Новозыбкове.
|
|
|
+4. 🧪 **Тестирование:** Проверка адаптивности, кроссбраузерности и рабочих ссылок.
|
|
|
+5. 🛠️ **Отладка:** Исправление ошибок, замена фейковых новостей на реальные.
|
|
|
+6. ✨ **Финализация:** Полировка UI, добавление анимаций, настройка виджетов.
|
|
|
+7. 🚀 **Публикация:** Деплой на хостинг Beget.
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
+## 7. ✅ Заключение
|
|
|
+
|
|
|
+> В результате проделанной работы создан полноценный, информативный и визуально привлекательный сайт-портал **«NOWозыбков»**.
|
|
|
+
|
|
|
+Проект успешно реализован в срок (**22.06.2026**) и полностью соответствует поставленным задачам. Сайт готов к использованию и представляет собой удобную площадку для информирования жителей и гостей города Новозыбкова.}
|
|
|
+
|
