Задача: верстка веб-приложения HTML/CSS(SASS)/JS.
Верстка веб-приложения выполнена на основе частично взятого Bootstrap 4, из JS jquery и другие библиотеки. Заказчиком был выбран довольно странный постраничный способ реализации, вместо написания css/js фреймворка и разработка интерфейса на его основе. Часть веб-приложения была выполнена полностью с разработкой скриптов JS(ES6).
Демонстрация сайта:
Задача: создание каталога подержанных японских автомобилей по дизайн-макету.
Каталог выполнен в адаптивном дизайне на HTML5/CSS3, использовался Bootstrap 4.1, Slick, Jquery-3.3.1, AOS, Animate.css прекрасно работает на всех платформах. За основу взята современная CMS October. Создан плагин админ панели для управления каталогом (формы добавления категорий и товаров, формы заказа, управление email адресами для уведомлений менеджеров о заявках).
Демонстрация сайта:
Задача: создание целевой страницы вебинара для Instagram сервиса по дизайн-макету.
Целевая страница вебинара выполнена в адаптивном дизайне, на Bootstrap 4, jquery-3.3.1, прекрасно работает на всех платформах, реализован таймер обратного отсчета на JS и анимация.
Демонстрация сайта:
Задача: создание целевой страницы для службы доставки шампанского.
Целевая страница выполнена в адаптивном дизайне с использованием HTML5/CSS3, с использованием фреймворка Bootstrap 4 и прекрасно работает на всех платформах. За основу взята современная CMS October. Реализован функционал корзины и онлайн заказа.
Демонстрация сайта:
Задача: создание целевой страницы для Instagram сервиса по дизайн-макету.
Целевая страница выполнена в адаптивном дизайне, на Bootstrap 4.1, слайдере Slick, jquery-3.3.1 и прекрасно работает на всех платформах. Слайды меняются путем замены контента, во время смены проигрывается анимация.
Демонстрация сайта:
Задача: создание целевой страницы для компании диетического питания.
Целевая страница выполнена в адаптивном дизайне, HTML5/CSS3 на новом Bootstrap 4.0 и прекрасно работает на всех платформах. За основу взята современная CMS October.
Демонстрация сайта:
Задача: создание целевой страницы вебинара для Instagram сервиса по дизайн-макету.
Целевая страница вебинара выполнена в адаптивном дизайне, на Bootstrap 4, jquery-3.3.1, прекрасно работает на всех платформах, реализован таймер обратного отсчета на JS.
Демонстрация сайта:
Задача: создание целевой страницы для проектно-строительной компании.
Целевая страница выполнена в адаптивном дизайне, на новом Bootstrap 4 и прекрасно работает на всех платформах. За основу взята современная CMS October.
Демонстрация сайта:
Задача: перенести сайт (целевая страница), с uCoz конструктора сайтов на чистый HTML5/CSS3/JS, попутно оптимизировать, для перехода на нормальный хостинг.
Сайт пришлось переверстать с ноля. В качестве базы CSS взят Bootstrap 4.0, при помощи SASS, из него было вырезано все лишнее и оставлен только Flex, Modal и несколько других компонентов. Конечный CSS в несжатом виде имеет размер 22,4кб (после gzip 3,6кб). Основа JavaScript jQuery v3.3.1 и bootstrap.js с удалением лишних компонентов, минимизированный файл имеет размер 108,1кб (после gzip 35,6кб). Изображения были оптимизированы, основной background и favicon также были нарезаны под разные устройства, общий размер изображений удалось сократить с 1.3мб до 55,4кб. Также это коснулось шрифтов и иконок. Убраны неиспользуемые шрифты GoogleFont, а несколько векторных картинок используемых из FontAwesome, были заменены на библиотеку svg, общий размер шрифтов и иконок удалось сократить с 156кб до 26,6кб, а запросы с 8 до 3.
Итог удалось сократить время загрузки целевой страницы на более чем 90%. Для тестов использовался хостинг beget.com.
Демонстрация сайта:
Задача: создание целевой страницы для SMM компании по продвижению в Telergam.
Целевая страница выполнена в адаптивном дизайне, на новом Bootstrap 4.0 и прекрасно работает на всех платформах. За основу взята современная CMS October. Подключен платежный модуль от Free-Kassa.ru, с более чем 30 способами оплаты.
Демонстрация сайта:
