Требуется сверстать проект из Figma с использованием чистого HTML, CSS и JS, следуя методологии БЭМ. Верстка должна быть семантической и валидной. Обратите внимание на важность соблюдения стандартов веб-разработки.
Зверстати сторінку сайту -завдання для Початківця
Є потреба зверстати заново головну сторінку сайту (назвем її index-uatm.php). Зараз вона та взагалі сайт працюють на php (Бітрікс). Нова сторінка повинна бути по тому прикладу сторінки, що додається (index-tm.php) та реально працює на сайті.
Треба:
- З нуля створити сторінку.
- Кодування сторінки windows-1251. У коді будуть лише div та стилі, a table не буде взагалі. Тобто все зверстати на <div> та корегувати у CSS.
- Зберегти дизайн сторінкиу. Але зараз загальний вигляд та дизайн сторінки дещо глюкнули. Тому у дизайні взяти за шаблон потрібно сторінку з архіву. Ну, а контент сторінки та зображення потрібно брати тут.
- Повністю повторити структуру нового файлу index-uatm.php так, як у файлі прикладу index-tm.php, тобто зверстати нову сторінку index-uatm.php так, як зверстано прикладений зразок сторінки index-tm.php. Якщо є думки щодо покращення – обговорюємо, а тільки потім робимо.
- Підключення хідеру (треба створити файл newheader.php), меню (треба створити файл newmenu.php) та футеру (треба створити файл newfooter.php), НАШ БЛОГ та ПОСЛЕДНИЕ СТАТЬИ реалізувати через #include так, як це зроблене у прикладі. Приклади цих файлів, файлів стилів та main.js з сайту tm.ua можуть бути окремо надані. Уточнюю ще раз: треба відокремити файли newheader.php, newfooter.php, newmenu.php
- Змінити структуру папок для файлів як на сторінці. Треба використати мінімальну вкладеність папок. Зрозуміло, що посилання на зображення виду сайт.юа/upload/medialibrary/dac/patentnyy-poverennyy-advokat-Yana-tm-3.jpg тепер повинно бути сайт.юа/images/patentnyy-poverennyy-advokat-Yana-tm-3.jpg
- Зараз на сторінці є помилка щодо заголовків. Там все зроблене на одному h1. Тому на сторінці треба використати лише тільки один h1, а також створити заголовки та стилі h2 та h3. Тобто, наприклад, замість <h1 class="orange">Домен UA</h1> повинно бути <h2 class="orange">Домен UA</h2>. А нижче замість <strong>Домен UA и торговая марка</strong> повинно бути < h3>Домен UA и торговая марка</ h3> та так по всій сторінці. А те, що буде у цих заголовках ви повинні уточнити.
- Аналогічно створити папки та файли стилів. Попередньо це буде css/reset.css та css/style.css. Це обговоримо з обраним виконавцем.
- Повністю перенести контент сторінки. З розумінням того, що Бітрікс повставляв у код багато зайвого (span, li style, тощо) яке потрібно видалити. В низу сторінки є підключення скрипту Tawk, його треба так і залишити.
- Зберегти у коді всі посилання, крім посилань на компоненти bitrix.
- Передбачити підсвічування активного пункту меню.
- Блок Наш Блог у коді виконати так само як у index-tm.php. Під блоком Наш Блог так само розташувати ПОСЛЕДНИЕ СТАТЬИ.
- Зрозуміло, що хоча спочатку сторінка створюється та доробляється під десктоп, то далі виконавець повинен оптимізувати її під перегляд з мобільного.
Вимоги до виконавця:
- Знання та навички у htlm, css, php тощо, достатні для виконання завдання.
- Наявність у портфоліо виконаних завдань щодо верстки сайтів. Бажано отримати посилання або файл головної якогось сайту, зверстаний вами.
- Не знаєте про підключення через include - не беріться.
Критерії якості:
- Сторінка повинна проходити html та css (бажано) validator без червоних помилок (без Error).
- Сторінка повинна мати продуктивність по PageSpeed Insights для мобільних не менш 98 та мати інші показники по зеленому. Але якщо зробити сторінку по наданому прикладу, то все по зеленому і так буде.
- Кросброузерність
Розробник:
Тільки з України та з можливістю спілкування по моб зв’язку
Прошу обов’язково пропонувати:
- Підхід до реалізації завдання.
- Терміни реалізації
- Вартість.
Розрахунок:
Гривнами на карту тільки після реалізації завдання. Можливо частинами Але передплати не буде.
Дякую!
Заявки фрилансеров
Похожие заказы
- HTML-верстка12 заявокЗакрыт2 года назад
- $10
Требуется срочное создание дизайна и верстка 1 блока на HTML, CSS и JS. Необходимо адаптировать блок под указанный дизайн с импульсами между кружками. Срок выполнения до завтра, 15:00. За пробный проект оплата $10, в будущем возможны постоянные заказы с хорошей ценой.
HTML-верстка13 заявокЗакрыт2 года назад Требуется срочная доработка сайта на GSAP. Основная задача включает завершение HTML-верстки и интеграцию анимаций. Ожидается, что фрилансер имеет опыт работы с GSAP и способен быстро выполнить проект.
HTML-верстка3 заявкиЗакрыт2 года назадТребуются правки по верстке и доработки для блога на WordPress. Необходимо внести изменения в дизайн согласно приложенному ТЗ. Сроки выполнения гибкие, оплата по безопасной сделке или после завершения проекта.
HTML-верстка1 исполнительЗакрыт2 года назадТребуется выполнить HTML-верстку макета, доступного по предоставленной ссылке. Необходимо точно следовать дизайну и обеспечить корректное отображение на различных устройствах.
HTML-верстка1 исполнительЗавершен2 года назадТребуется выполнить HTML-верстку для интернет-магазина, включающую 5 страниц: главную, о производстве, корзину, товар и каталог. Обеспечить качественное и аккуратное оформление каждой страницы.
HTML-верстка19 заявокЗакрыт2 года назад- $200
Требуется перенести около 8 страниц из Figma в Elementor с доработкой существующей верстки. Страницы готовы, но нуждаются в исправлении. Идеал — соответствие макету в Figma. У нас есть исходная HTML-верстка всех страниц. Срок выполнения — до 31 числа.
HTML-верстка7 заявокЗакрыт2 года назад Требуется адаптивная верстка сайта по предоставленному макету. Укажите стоимость и сроки выполнения работы. Примеры выполненных работ приветствуются для оценки качества верстки.
HTML-верстка1 исполнительЗавершен2 года назад- $25
Требуется сверстать несколько страниц без адаптивной верстки по предоставленному макету из Figma. Основные задачи включают точное воспроизведение дизайна и соблюдение всех элементов из макета.
HTML-верстка69 заявокЗакрыт2 года назад