Раскрываем, как шла работа над адаптивным дизайном сайта застройщика «Самолет ЛО».
Удобство просмотра на всех устройствах
На стадии дизайна сайта было решено делать адаптивную верстку для 5 разрешений экрана вместо стандартных трех:
- 1920×1600
- 1600×1400
- 1366×1200
- 768×700
- 360×320
Такая верстка предусматривает удобство просмотра сайта для любых устройств, а не только на большом экране, планшете и мобильном.
Анимация
Анимация интерфейса — неотъемлемая составляющая юзабилити — то, что влияет на удобство пользователя. Поэтому мы решили добавить эффекты для некоторых элементов:
- чек-боксы дополнительных параметров квартир
- иконки дополнительных параметров квартир
- иконка «добавить в избранное»
Для привлечения внимания к блоку преимуществ жилого комплекса добавили эффект при скролле:
Оптимизация сайта
Адаптивная верстка влияет на ранжирование сайта в поисковой выдаче, поэтому было важно, чтобы им было удобно пользоваться с любого устройства, в том числе мобильного, а также, чтобы сайт быстро загружался и не тормозил, чтобы пользователь не уходил с него, не дождавшись полной загрузки. Поэтому мы учли, чтобы контент был оптимизирован, сайт легко загружался на десктнопной и мобильной версии. И мы добились неплохих результатов, теперь даже при слабом интернете сайт будет загружаться быстро.
Результат
Мы сделали верстку, адаптированную для любых устройств, добавили эффектов для удобства и привлечения внимания посетителей. Десктопная и мобильная версии сайтов работают быстро.
Другие кейсы по созданию мобильных версий сайтов в нашем блоге.