Сверстать сайт по дизайну Figma
19 000 UAHСайт состоит из 12 страниц (темная + светлая тема);
Дизайн выполнен в figma;
Дизайн модульный потому на сайте много повторяющихся элементов;
Требования к верстке:
BEM (использовать эту методологию)
html5 (использовать семантику/автозаполнения полей форм для ввода email и т.п.)
sass
vanilla js (без jQuery), ES6+
DRY, KISS
Оптимизизация:
90+ по Google Page Speed на десктопе и на мобильном
асинхронная подгрузка скриптов/стилей/изображений (srcset для больших изображений)
Поддержка браузеров:
Google Chrome
Apple Safari
Microsoft Edge
Mozilla Firefox
Opera
Android Browser
Браузеры которые используются более чем 1% пользователей;
Требования к организации кода:
Сборку выполнить c помощью webpack или gulp.
- структура папок:
- js - (папка для js файлов)
- sass - (папка для sass файлов, с необходимой для BEM структурой, под каждый компонент отдельный файлик)
- img - (папка изображений)
- fonts - (папка для шрифтов)
- build - (папка для сборок)
- зависимости добавить через package.json (npm)
- стараться не добавлять на страницу лишние скрипты/стили, если они там не нужны;
- использовать автопрефиксер, плагин для сортировки @медиа правил по разрешениям и т.п., что облегчает жизнь;
Верстка должна быть респонсивной, сайт должен выглядеть хорошо, во всех промежуточных экранах между брейкпойнтами в дизайне.
Под хорошо имеется ввиду - отсутствие ненужных скроллов, сползаний соответственных элементов и т.п.
(ссылку на дизайн дам в ЛС, напишите слово “сыыырр”, чтобы я знал что вы прочитали это ТЗ)
Смена тем:
В дизайне есть светлая и темная тема, нужно реализовать переключение между темами,
данные о выбранной теме хранить в LocalStorage:
1)если пользователь выбрал тему - ставим ее;
2)если пользователь еще не выбирал тему, если можем узнать тему устройства, например через window.matchMedia('(prefers-color-scheme: dark)') - ставим эту тему;
3)если тему устройства определить невозможно, то ставим темную тему.
Результат:
В качестве результата должен быть репозиторий с указанной структурой папок и инструкциями по сборке.
Ссылку на дизайн и более подробное ТЗ отправлю в ЛС.
Отзыв заказчика о сотрудничестве с Yuliia Stepanyshyna
Сверстать сайт по дизайну FigmaЮлия очень ответственна и внимательна. Сотрудничеством доволен, если будут еще задачи по верстике мы знаем, к кому будем обращаться.
Отзыв фрилансера о сотрудничестве с Антоном Клименко
Сверстать сайт по дизайну FigmaОтветственный и правильный заказчик. Было четко поставленное задание и предоставлена необходимая информация, всегда был на связи, быстрая проверка и оплата. Спасибо за сотрудничество.
-
Приветствую. Опыт верстки более 9 лет. Верстаю кристально чистым кодом. Для оценочки мне нудно видеть макет
-
550 1 0 Сийррр )
Добрый день, готов выполнить ваш заказ.
Если вам нужен адаптивный, надежный, кросбраузерный и удобный веб-сайт – тогда свяжитесь!
Работаю с таким набором технологий, как: HTML, CSS, JavaScript, SASS, GIT, GULP, WEBPACK, npm и Figma.
Мои навыки позволяют мне создавать визуально привлекательные и интерактивные дизайны, доступные пользователям.
Все детали можно обсудить в аудио-видео-формате.
Буду рад с Вами сотрудничать!
… Смотрите мои проекты:
HTTPS://gorobez.github.io/crips/
HTTPS://gorobez.github.io/NFT/
https://gorobez.github.io/createx/
https://gorobez.github.io/cex_io/
HTTPS://gorobez.github.io/NFTmarketplace/
HTTPS://gorobez.github.io/delote/
https://gorobez.github.io/greenery/
https://gorobez.github.io/element_home/
HTTPS://gorobez.github.io/--current-weather/
-
213 Добрый день ! “сыыырр” ознакомился с Вашим ТЗ готов приступить к работе, буду рад сотрудничать.
-
2060 25 0 сыыырр
Добрый день, Антон. Готов приступить к работе после ознакомления с макетом и тз. Верстаю pixelperfect, адаптивно, кроссбраузерно, валидно, надёжно, в зеленой зоне goolepagespeed. Использую HTML5, CSS3/SASS, JS/ES6+. Классы именную по БЭМ нотации. Jquery не использую, если нужна реактивность, работаю с svelte, alpinejs, react для spa. Сборка gulp+webpack. Настрою сборку под ваш проект. Смены тем сделаю через css переменные, если нужна поддержка opera mini(1.03%), подкручу postcss. Картинки сделаю через picture тег и lazyload с помощью библиотеки. По желанию, буду делать отчёт на каждом этапе. Пишите в лс, обсудим проект.
-
1704 11 0 Добрый день! Сийр
Готов приступить прямо сейчас.
Опыт и отзывы на бирже есть.
Интересно посмотреть на макет.
Я работаю, я работаю, я работаю, я работаю, я работаю, я работаю, я работаю, я работаю.
По структуре, технологиям все понятно.
Светлую, темную тему реализую.
У меня есть возможность тестировать верстку на сафаре с телефона и макбука, а также на других браузерах с ПК и телефона
Обратитесь вверх!
…
Примеры работ:
HTTPS://trueville.com.ua/
HTTPS://ppasta.com.ua
https://up7mountains.com.ua/
HTTPS://checkm8.info/ук
-
721 5 0 Добро пожаловать, готов приступить с момента утверждения.
Верстаю через Pixel Perfect в работе использую Gulp, препроцессор SCSS, весь код минификую, использую современные форматы изображений. Используемая методология названия классов BEM.
Для оценки сроков и стоимости - нужно ознакомиться с макетом
Работаю до полного Вашего утверждения, работа будет выполнена качественно и четко в срок. Постоянно в связи.
Примеры работ
https://routegenie.com https://claimgenix.com
-
4790 113 0 Добрый день . Готовы реализовать свой проект.
IIIIIIIIIIIIIIIIIIIIIIIIIIII
-
333 1 0 Добрый день!
Я могу выполнить Вашу задачу.
Мой основный стек: js, typescript, css, react, next.js, redux. Опыт разработки – 2 года.
Готов обсудить все детали в личных сообщениях или по телефону. После более подробного ознакомления с дизайном смогу предоставить точный срок и стоимость. Будем рады сотрудничеству!
Ссылка на имеет портфолио: https://bihanskiy.github.io/#/
-
372 Сир
Добро пожаловать!Я могу сделать.На каком-либо конструкторе или написать на чистом коде.Если мои навыки вам подходят (они описаны ниже) жду вас в личных сообщениях.Выполняем ваш проект в часах - 35
Я - опытный фронтенд-разработчик с более чем 5 лет опыта в создании современных и эффективных корпоративных веб-сайтов.Работаю через сейф или по договору.В случае свободный и могу взяться за работу сразу после звонка.Мои навыки и знания включают:
HTML, CSS и JavaScript для создания современного и привлекательного дизайна сайта.- Использование фреймворков, таких как Bootstrap, для респондентного дизайна и оптимизации под различными устройствами.- Интеграция и настройка контент-менеджеров, таких как WordPress, для удобного управления контентом сайта.- Оптимизация скорости и загрузки страниц для лучшего пользовательского опыта.Я всегда слежу за новыми тенденциями в веб-разработке и стараюсь интегрировать их в мои проекты.Моя цель - создать веб-сайты, которые не только визуально привлекательны, но и эффективны в достижении ваших бизнес-целей.Вот мои последние каски -
HTTPS://energo-mash.com/
https://dezik.com.ua/
… https://shine-shop.com.ua/
https://sculptortela.com.ua/
HTTPS://www.ads-wind.com
HTTPS://adsquiz.io/
https://www.becandbridge.com/
WEB WEB WEB WEB WEB WEB
HTTPS://birdandkite.com/
HTTPS://purrsense.store/
Давайте поговорим о вашем проекте больше.Я жду вашего ответа!С лучшими пожеланиями,
Денис
-
276 Сир
Здравствуйте Антон, Моя команда свободна и готова принять ваш проект.
У нас большой опыт в создании сайтов.
С нашего опыта ваш проект займет столько часов рабочего времени 25
… Вот наши последние работы -
HTTPS://gotovorem.com
https://sakartvelo.if.ua/
HTTPS://fotopastka.com
https://kov-house.com.ua/
HTTPS://atava.if.ua/
http://kurtel.com.ua
HTTP://kalynovi-grona.if.ua
HTTPS://wordpress.uak.com.ua/
https://noblepet.com.ua/
Если вы не согласны с ценой, пожалуйста, напишите мне в личном виде на сколько вы оцениваете свой проект ))
Я жду в ЛС, поговорим и сегодня начнем к выполнению.
-
196 Сийррр
Добро пожаловать!
Срок выполнения и стоит сказать после оценки дизайна макета.
В работе использую gulp+webpack, html 5, JS, SCSS
Примеры моих работ:
HTTPS://crystalplanet.ae
https://lp.naves.com.ua/
HTTPS://proplus.kiev.ua
… https://sofyabeletskaya.com/
Пример работы на Elementor:
HTTPS://investpai.com.ua/
https://expresschina.com.ua/
Пример работ на Elementor + Envato Elements (шаблоны)
HTTPS://flame.zp.ua
HTTPS://tobisho.space/
https://sirko.creation.pp.ua/
-
250 Доброго дня! «Сиыррр»
С удовольствием выполню вашу работу!
Какой у вас бюджет?
Я знаю - html, css, javascript, typescript, vite, scss, less, git,
bem, w3c, google speed, adaptive, wordpress, ACF, CBF, polylang, php, sql.
-
708 6 0 Добрый день. сыыыр
Опыт работы верстальщиком 2года.
Хотел бы ознакомится с макетом для точной оценки сроков и цены.
Без проблем выполню темную и светлую темы.
В верстке использую компонентный подход, а так же структура проектов такая как у вас в требованиях. Мои примеры смотрите на гит.хабе или тут в портфолио.
Буду рад поработать.
Мой гитхаб: https://github.com/RomanTvrdhlb
…
В верстке использую динамические значения,
благодаря которым осуществляется отличный ресайз всех элементов и величин(шрифты,отступы т.д):
px to vw,а так же матемматические функциии css(min,max,clamp).
Использую технологии html/css/js, scss+gulp+webpackStream.
Использую компонентный подход, используются семмантические теги, верстка проходит валидацию и yoksel(БEM).
Google Page Speed проходит в зеленой зоне!
Векторные иконки в виде sprite.svg., картинки минифицированы, png,jpg+ .webp.
Из анимаций могу предложить библитеку AOS или нативную css анимацию.
По окончанию оговореных сроков вы получите готовый продукт.
Возможна поддержка вашего сайта с моей стороны в будущем.
Обращайтесь.
Мои работы:----------
https://hansgrohe.vercel.app/
https://need-for-service.vercel.app/
https://enthogenica.vercel.app/
https://game-dev-gilt.vercel.app/
https://kellers-holz.vercel.app/
https://deus-eight.vercel.app/
https://dg-finance-sooty.vercel.app/
https://puma-shop.vercel.app/
https://pricing-page-nine.vercel.app/
https://moxa-wine.vercel.app/
Так же смотрите мое портфолио.
Буду рад поработать.
Спасибо!
-
1705 18 0 Добро пожаловать
Я создаю сайты с адаптивом, которые прекрасно отображаются на всех устройствах.💻Если Вы заинтересованы, вы можете посмотреть в мой портфолио на dimafomaa.online
Буду рад сотрудничать с вами.
Реальные сроки и стоимость я могу указать после рассмотрения и обсуждения задачи 👍🏻🎨📲😉
-
277 2 0 Антон, здравствуйте!
Готов выполнить Ваш проект. Имею опыт работы достаточный, для соответствия всем Вашим требованиям к готовому результату.
Сайт будет сделан кросс-браузерный, полностью адаптивный, с использованием WebPack и с максимальной чистотой кода. Верстка, будет максимально понятна для дальнейшей возможной работы с ней.
К общему знаменателю касательно окончательной цены придем после ознакомления с макетом. Цена и сроки обсуждаемы.
Буду рад сотрудничеству!
Сыыыр
-
10515 179 3 3 Добрый вечер. Сверстаю адаптивную и кроссбраузерную верстку. Все сделаю качественно и в срок выполню поставленную задачу. Скиньте макет для оценки сроков и цены. Буду рад помочь в данном вопросе!
Мои недавние проекты
https://polunina.in.ua/
https://stelaj.com.ua/
https://korifei.info/
https://service.coffeeok.com.ua/uk/
https://envymeclub.com/
https://zoolux.vet/
… https://vetseminar.org/ff/
https://go2go.rent/
Мое портфолио:Freelancehunt
-
322 1 0 Добрый день, готов к вашему заказу.
Сборку могу сделать на веб-паке, рядка html/css(с использованием SASS), JS без jQuery(по необходимости могу использовать сторонние библиотеки для слайдерів, анимаций и тп, но если хотите то можно и без сторонних библиотек обойтись и сделать все на чистом JS(заем немного больше времени просто))
Что касается организации кода вы не можете пережить, напишу все чисто и точно, также напишу инструкцию по сборке и описание всех скриптов, для тех, кто будет сопортировать сайт в будущем. Поскольку дизайн в вас модульный, то по возможности буду по максимуму переиспользовать код.
Чтобы ускорить загрузку точно же оптимизую все и сделаю сеть изображений, чтобы не загружало 2к изображения в карту размером 300 на 400 пикселей каким-либо образом (хотя это и элементарно и должно быть сделано на каждом сайте, на практике замечу, что многие разработчики этим не желают, поэтому и упомянул за это).
Окончательную сумму и срок исполнения можно назвать как вид макет)
-
1988 22 0 Добро пожаловать!
Буду рад сотрудничеству. Всегда на связи. Обращайтесь .
Примеры работ https://web.khorol.com.ua
-
392 4 0 Сиир
Доброго вечера!
Я ознакомился с вашим заданием и готов выполнить в соответствии со всеми указанными вами пунктами. Никаких лишних кодов и тяжелых библиотек. Верстика кросбраузерная, валидным кодом, адаптив под планшеты и мобильные.
С моими работами вы можете ознакомиться по следующему ссылке:
Freelancehunt
Всегда находимся на связи, учитываю все ваши желания, гарантирую надежную и качественную работу.
…
Будем рады сотрудничеству!А вот!
-
576 16 0 Добрый день! Любители выполняют работу адаптивно, кросбраузерно, симантично.
Обычно используется: HTML, CSS (SCSS), JavaScript, BEM, flex, grid, Swiper, Gulp.
Всегда на связи!
Примеры моих работ -Freelancehunt
-
4721 76 0 сыыырр
Добрый вечер, заинтересовал ваш проект, готов выполнить качественную, адаптивную верстку. Хотел бы осмотреть дизайн сайта, давайте подробнее обсудим проект.
-
3262 33 0 1 -
450 Сийррр
Добро пожаловать! Спасибо за структурированный ТЗ!
Зверстаю «как для себя» и с радостью по необходимости займусь дальнейшей поддержкой!
Портфолио: nalad.com.ua
Хороший день и настроение!
-
192 34 1 1 Добрый вечер.
Имею 15 лет опыта веб-разработки.
Стек технологий вкратце: HTML, CSS, js, php, mysql, opencart.
Хотелось бы увидеть макеты.
Предлагаю обсудить подробности.
-
1070 33 1 4 Доброго времени суток, реализую верстку на высшем уровне, обращайтесь, буду рад сотрудничеству! 6+ лет во фронте
-
Пришлите ссылку, без макета трудно сделать адекватную ставку.
-
Можна посилання , або скрін дизайну
-
Забыли еще о IE7
-
Актуальные фриланс-проекты в категории HTML и CSS верстка
Вебфлоу разработчик для заполнения страниц портфолио на сайтеСайт разработан кастомно на Webflow для строительной компании, нужно быстро заполнить страницы проектов по одному шаблону (заменить картинки и тексты) Для 2 языков Количество - 6 штук Готовы начинать как можно скорее, спасибо! HTML и CSS верстка, Веб-программирование ∙ 8 часов 14 минут назад ∙ 25 ставок |
Верстка та посадка на WordPress сайту будівельної компанії (Premium-сегмент) з акцентом на SEOОписание проекта: Ищем опытного WordPress-разработчика для верстки и посадки готового дизайн-макета из Figma на CMS WordPress. Важный контекст проекта: Это не разработка сайта с нуля. Компания имеет действующий сайт, мы обновляем структуру и дизайн. Нам необходимо реализовать… HTML и CSS верстка, Веб-программирование ∙ 12 часов 55 минут назад ∙ 48 ставок |
Перенос сайта с OpenCart на платформу ХорошопДобрый день. Есть сайт на OpenCart, интернет-магазин. Нужно перенести структуру сайта на платформу Хорошоп, подобрать дизайн для нового сайта и сделать его полноценно работающим. HTML и CSS верстка, Веб-программирование ∙ 1 день 9 часов назад ∙ 29 ставок |
Нужен сильный специалист по WordPress / WooCommerce для доработки сайта MARSPROИщем ответственного фрилансера или небольшую команду для качественного завершения и технической доработки сайта компании MARSPRO. Сайт уже работает, но после предыдущего разработчика осталось много мелких и важных технических проблем. Нам нужен человек, который сможет не просто… CMS, HTML и CSS верстка ∙ 2 дня 10 часов назад ∙ 44 ставки |
Sandra Ice Cream - Kaleidoscop
4122 UAH
У нас есть небольшой проект, и мы хотели бы узнать, сможете ли Вы подготовить для нас видеоролик для LED-экрана. Видео будет использоваться на нашем мероприятии. Мы предоставим все необходимые материалы: дизайн, брендбук, размеры и технические требования. Пожалуйста, сообщите,… HTML и CSS верстка ∙ 2 дня 11 часов назад ∙ 7 ставок |