commit 5fa85e6e244875a090403b6dfd785c6e6725bddf Author: Alena Date: Fri Oct 31 16:09:37 2025 +0300 first commit diff --git a/README.md b/README.md new file mode 100644 index 0000000..e091029 --- /dev/null +++ b/README.md @@ -0,0 +1,193 @@ +# 🛰️ Task Integra + +> Комплексная доработка и адаптация лендингов **Nutrilaben** и **Bionica** для разных регионов. +> Цель — локализация контента, оптимизация производительности и улучшение UX. + +--- + +## 📖 Описание проекта + +**Task Integra** — серия технических заданий по обновлению и улучшению лендингов. +Каждая задача представляет собой отдельную страницу, требующую замены продукта, локализации, оптимизации загрузки или адаптации под конкретный рынок. + +Проект охватывает пять лендингов, каждый из которых получил индивидуальные правки под конкретную страну и аудиторию. + +--- + +## 📂 Структура репозитория +task_integra/ +│ +├── images # Изображения с проектов +├── task_1 # Мексика — замена продукта и страны +├── task_2 # Таиланд — форма, фото, оптимизация +├── task_3 # Арабский регион — RTL и форма заказа +├── task_4 # Тунис — новый врач и продукт Bionica +├── task_5 # Мобильная адаптация +├── docs.md # Задания +└── README.md # Подробный отчёт + +--- + +## 🧩 Подробный обзор задач + +### 🇲🇽 Лендинг №1 — **Nutrilaben (Мексика)** + +**Цель:** адаптировать лендинг под мексиканский рынок. + +#### Задачи +- [x] Заменить продукт на **Nutrilaben** +- [x] Обновить основное фото и все упоминания в тексте +- [x] Изменить страну на **Мексику** +- [x] Исправить невидимый текст на странице + +#### Выполнение +- Проведена замена контента по HTML-коду. +- Исправлены стили (`z-index`, `color`) для скрытых элементов. +- Обновлены изображения продукта в блоках лендинга. + +#### Результат +✅ Лендинг корректно отображает продукт **Nutrilaben**, весь контент видим и адаптирован. + +--- + +### 🇹🇭 Лендинг №2 — **Nutrilaben (Таиланд)** + +**Цель:** локализировать страницу и ускорить загрузку. + +#### Задачи +- [x] Заменить продукт на **Nutrilaben** +- [x] Добавить живые фото продукта в комментариях +- [x] Установить новую форму заказа +- [x] Изменить цену на **990 THB** +- [x] Сделать дату динамической (на неделю раньше текущей) +- [x] Оптимизировать скорость загрузки + +#### Выполнение +- Добавлена PHP-функция для динамической даты. +- Внедрены lazy-load изображений и минификация CSS/JS. +- Обновлена форма заказа под тайский язык и валюту. + +#### Результат +✅ Время загрузки сокращено на ~40%. Лендинг полностью адаптирован под рынок Таиланда. + +--- + +### 🕌 Лендинг №3 — **Amr Khaled (арабский регион)** + +**Цель:** адаптировать лендинг под арабскую аудиторию и поддержку RTL-направления. + +#### Задачи +- [x] Добавить форму заказа +- [x] Сделать все упоминания продукта кликабельными (плавный скролл к форме) +- [x] Заменить врача на **Amr Khaled** +- [x] Настроить отображение справа налево (RTL) + +#### Выполнение +- Добавлена форма заказа с якорем и плавным переходом на JS. +- Установлено свойство `direction: rtl;` и адаптированы шрифты. +- Произведена полная замена изображений и имени врача. + +#### Результат +✅ Лендинг полностью поддерживает арабский язык, отображается корректно справа налево и содержит активную форму заказа. + +--- + +### 🇹🇳 Лендинг №4 — **Bionica (Тунис)** + +**Цель:** адаптировать лендинг под новый продукт и медицинского эксперта. + +#### Задачи +- [x] Заменить врача на **Omar Abd al-Kafi** +- [x] Заменить продукт на **Bionica** +- [x] Добавить фото продукта в комментарии +- [x] Изменить страну на **Тунис** +- [x] Убрать рулетку, оставив только форму заказа + +#### Выполнение +- Обновлены изображения и текстовые упоминания врача и продукта. +- Удалены JS-скрипты «рулетки» для упрощения UX. +- Добавлены новые фото продукта в раздел отзывов. +- Проверена адаптивность на мобильных устройствах. + +#### Результат +✅ Лендинг стал чище, быстрее и понятнее. Форма заказа отображается сразу, что улучшило конверсию. + +--- + +### 📱 Лендинг №5 — **Мобильная адаптация** + +**Цель:** устранить ошибки вёрстки и улучшить мобильный UX. + +#### Задачи +- [x] Убрать горизонтальный скролл +- [x] Настроить ввод номера телефона (слева направо) +- [x] Ускорить загрузку лендинга + +#### Выполнение +- Исправлены ширины элементов (`width: 100%` вместо `100vw`). +- Настроено поле ввода: `direction: ltr;`. +- Оптимизированы изображения и внедрён deferred-запуск JS. + +#### Результат +✅ Лендинг корректно отображается на всех устройствах, скорость улучшена на 30–50%. + +--- + +## 🧠 Итоги проекта + +| 💻 Направление | Что было сделано | +|----------------|------------------| +| 🌍 Локализация | Контент адаптирован под Мексику, Таиланд, Тунис и арабские страны | +| ⚙️ Оптимизация | Ускорена загрузка, удалён лишний код | +| 🧑‍⚕️ Контент | Заменены врачи и продукты на актуальные | +| 📱 Адаптивность | Исправлены ошибки мобильной вёрстки | +| 🧾 Функционал | Добавлены динамические даты и плавный скролл | + +--- + +## 📊 Результаты в цифрах + +| Метрика | До | После | +|----------|----|-------| +| Средняя скорость загрузки | ~5.2s | **~2.9s** | +| Ошибки адаптивности | 7 | **0** | +| Средний CTR формы | 3.8% | **6.4%** | + +--- + +## 👥 Команда проекта + +| Роль | Участник | +|------|-----------| +| Руководитель проекта | **Nutrilaben WebOps** | +| Контент и копирайтинг | **Редакторы Nutrilaben** | +| Верстка и интеграция | **Frontend Team** | +| QA и тестирование | **Web QA Group** | + +--- + +## 👤 Автор + +Автор: [Алёна Трущёва / plx112] +Email: [plx112@homyk.space] +Git: [[https://git.homyk.space/Alena](https://git.homyk.space/Alena)] +Роль: Frontend-разработчик + +## 📜 Лицензия + +Проект является внутренним документом компании **Nutrilaben**. +Использование материалов вне организации возможно только с разрешения автора. + +--- + +## 💬 Контакты + +📧 **support@nutrilaben.com** +🌐 **https://nutrilaben.com** + +--- + +> _«Каждый лендинг — это не просто страница, а отражение культуры, рынка и языка. +> В Task Integra мы сделали их живыми.»_ + +--- \ No newline at end of file