Меню
Оставить заявку

Premium Relax

Сайт для салона массажа

premium-relax.ru

Срок реализации

  • 14 дней

Этапы работы

    • Верстка
    • Программирование

Задача

Разработать сайт по готовому дизайн-макету.

Оптимизация

При работе над проектом использовал новые методики оптимизации скорости, это позволило добиться высшей оценки от Google Page Speed как для мобильных, так и для компьютерной версии.

Скорость загрузки первой страницы: 1.5 секунды

Premium Relax 1
Версия для компьютеров
Premium Relax 2
Версия для мобильных

Сетка на странице «Девушки»

Premium Relax 3
Сетка на странице «Девушки»

Высота фотографий может быть разная, если бы просто вставить фото девушек и ничего не дорабатывать, это выглядело бы вот так:

Premium Relax 4
Поведение по умолчанию

Высота строки выставляется по самому высокому элементу. Я подумал, а что если разместить их по колонкам? Тогда строк не будет совсем и они будут вставать как полагается.

Да, этот вариант сработает, но структура списка сломается, программисты потратили бы гораздо больше времени на форматировании этого списка с данными из админ панели.

А я уважаю своих коллег и не делаю работу для них еще сложнее.

В итоге я нашел решение в виде библиотеки Masonry, теперь плитка выглядит как на макете и структура кода удобна для интеграции:

Premium Relax 5
Код списка девушек
Поделиться
Отправить

Комментарии