Адаптивный сайт «MegaLabs»

http://www.megalabs.ru/
Задача:

Рассказать о деятельности дочерней компании ОАО «МегаФон», отвечающей за перспективные продуктовые направления: цифровой контент, медиа, финансовые услуги, мобильную рекламу, облачные решения, М2М и геосервисы. В качестве основного канала коммуникации компании MegaLabs с клиентами был выбран адаптивный сайт.

  • Решение:

    Техническое задание на шестидесяти страницах описывало всё: брейкпоинты адаптивной вёрстки, поведение каждой страницы при перестроении, требования к просмотру на экранах с высокой плотностью пикселей и ряд других особенностей вёрстки. Особое внимание мы уделяли читабельности и перестраиванию текста на разных устройствах.

    Спустя 260 часов вёрстки и разработки сайт был адаптирован под четыре базовых разрешения — он учитывает особенности интерфейсов самых распространенных моделей десктопов, планшетов и смартфонов.

1024
768
480
320
  • Главная страница, анимированная при скроллинге на десктопах, на смартфонах перестраивается, становится статичной и полностью скрывает список направлений деятельности компании, что значительно упрощает работу с сайтом на мобильных устройствах.

  • Плитка реализованных проектов в портфолио компании динамически перестраивается на десктопах при изменении размера окна браузера. Контент подстраивается под предпочтения пользователя даже без перезагрузки страницы.

  • Раздел с публикациями о MegaLabs в СМИ предлагает различные способы навигации на смартфонах (подгрузка новостей в конец ленты) и более крупных экранах (постраничное перелистывание). Таким образом, адаптивный сайт учитывает разный пользовательский опыт на разных устройствах.

  • Раздел вакансий полностью функционален на всех устройствах. Будущий сотрудник MegaLabs может откликнуться на вакансию даже из метро или с беговой дорожки фитнес-клуба.

Подобные проекты без сложной функциональной нагрузки могут казаться простыми, поэтому их особенно хочется сделать идеально: отточить все отступы, шрифты, перестроения на всех разрешениях. И порой такое желание выливается в следование принципу Парето: 20 % времени мы делаем весь сайт и 80 % времени «вылизываем» результат. Приятно потом, оглянувшись назад, увидеть действительно качественный результат работы. Андрей Рыжкин Технический директор AGIMA
Результат:

В результате проведенных нагрузочных тестирований была оптимизирована вёрстка и настроена серверная часть сайта. Теперь сайт MegaLabs.ru под стать самой компании — быстрый, технологичный и современный.