Лендинг: вёрстка сайта для инвестиций по PSD макету - портфолио по верстке и дизайну

Лендинг: вёрстка сайта для инвестиций по PSD макету

Верстка PSD макета с применением Bootstrap

Тематика бизнес сайтов \ Корпоративный стиль

Ссылка на работу:

Данный макет был предоставлен только в компьютерной версии.

Была сделана произвольная адаптация сайта под все устройства

Для верстки и адаптации сайта был использован фреймворк bootstrap 4

Мобильная версия сайта Планшетная версия сайта Компьютерная версия сайта

Дополнительный функционал

С помощью JavaScript был осуществлен слайдер на первом экране сайта

Для реализации слайдера так же был использован фреймворк bootstrap 4

Сборка проекта

Сайт собирался с помощью таск-менеджера Gulp

Стили были написаны на css-препроцессоре less

Приёмы оптимизация:

Весь css код проходил минификацию и оптимизацию с помощью gulp плагина csso

В ходе оптимизации были подключены и соединены в один файл необходимые css библиотеки от фреймворков

Так же, специальном gulp плагином autoprefixer, были расставлены префиксы css3 свойств для старых браузеров

Похожая процедура по минификации и конкатенации кода была сделана и с JavaScript файлами

Последним этапом оптимизации стало сжатие изображений при помощи gulp плагина imagemin

__

Макет был предоставлен сайтом ‘htmlAcademy’