Услуги разнорабочего и ремонт на дому Мокап веб-сайта

Крупные изображения услуг и плотная сетка карточек требуют проверки в разных размерах окна

Разделенный главный экран — это первая область, требующая проверки при оценке адаптивности этой визуальной композиции. Крупная фотография мастера расположена рядом с выровненным по вертикали текстом об услугах, метками категорий и темной кнопкой «Свяжитесь с нами» на ярко-желтом фоне. На небольших экранах соотношение масштаба изображения, ширины текста, положения кнопки и порядка следования этих элементов будет напрямую определять, насколько быстро считывается информация об услугах.

Второй приоритет для проверки — две группы карточек услуг. Четыре компактные карточки выстроены в горизонтальный ряд, а галерея «Услуги по ремонту жилья» состоит из девяти иллюстрированных карточек, расположенных в три колонки и три ряда. Их изображения, заголовки, описания и ссылки «Подробнее» должны сохранять достаточно пространства и оставаться различимыми при сужении макета. Особенно важно проверить плотность галереи и переход от вступительного блока из четырех карточек к более крупной сетке.

Шапка сайта и заключительный блок контактов также требуют пристального сравнения на экранах разной ширины. На мобильных устройствах навигация сворачивается, поэтому ее ссылки и логотип должны оставаться четкими, не споря с главным экраном. Внизу страницы пункты «Напишите нам», «Поддержка в WhatsApp» и «Онлайн-чат» выстроены в три колонки на широком экране; их перестроение в вертикальную стопку, отступы и визуальное разделение необходимо тщательно протестировать на компактных дисплеях. Режимы адаптивного просмотра помогут в этой визуальной проверке, но ключевая задача именно для этого шаблона — оценить, как заданные пропорции элементов ведут себя при изменении ширины экрана.