Дизайн — статьи о сайтах
Многие клиенты ателье открывают сайт с телефона: у вешалки в магазине или по дороге к вам. Им нужно быстро понять, берётесь ли вы за их задачу, от какой суммы это начинается, где вы находитесь и как договориться о визите. Если ради ответа приходится увеличивать текст и искать номер, страницу проще закрыть. Ниже перечислено, что стоит проверить и исправить.
Что должно быть видно на первом экране
Откройте главную и страницу услуги на телефоне и не прокручивайте. Должно быть понятно, что вы делаете (пошив, ремонт, подгонка по фигуре, замена молнии), в каком городе или районе находитесь и как связаться. Часто первый экран целиком занимает фото интерьера со слоганом, а полезное начинается ниже. Лучше уменьшить фото, поставить заголовок вроде «Ремонт и пошив одежды» и сразу под ним кнопки «Позвонить» и «Написать».
Как оформить прайс, чтобы он читался на узком экране
Прайс ателье обычно делают таблицей: услуга, изделие, цена, срок. На телефоне четыре колонки превращаются в мелкий шрифт или уезжают за край экрана, а горизонтальную прокрутку легко не заметить. Надёжнее сделать из каждой строки отдельный блок. Условный фрагмент страницы «Подгонка брюк»:
- крупно название: «Укоротить брюки»;
- следом цена: «от [цена] ₽»;
- ниже обычным шрифтом: «Срок: [N] дня. Цена зависит от ткани и подкладки, уточним при приёмке»;
- кнопка «Записаться на примерку» на всю ширину блока.
Значения в скобках замените своими. Цена стоит рядом с названием, а не в соседней колонке, и сразу сказано, от чего она зависит. Это снимает типовые вопросы, которые иначе придут в форму или по телефону.
Кнопки связи и форма записи: что происходит после касания
Номер телефона должен быть ссылкой формата tel:, тогда касание открывает набор номера, а цифры не нужно копировать. Проверьте, что кнопка мессенджера ведёт в ваш чат, а не на главную страницу сервиса. Кнопки делайте не меньше примерно 44 на 44 пикселя, с промежутком, чтобы не задеть соседнюю. Если внизу закреплена панель «Позвонить / Написать», убедитесь, что она не перекрывает текст и поля формы.
В форме хватит трёх полей: имя, телефон, что нужно сделать. Для телефона задайте тип поля tel, чтобы открывалась цифровая клавиатура. Загрузку фото вещи сделайте необязательной: показать дефект проще, чем описать. После отправки выведите сообщение, когда вы свяжетесь, с учётом реальных часов работы.
Фото работ без тяжёлой страницы
Снимки «до и после» убеждают лучше слов, но файлы с камеры весят по несколько мегабайт, и на мобильном интернете страница грузится долго. Загружайте изображения уменьшенными до нужного размера, в длинных галереях включайте отложенную загрузку, а для каждого фото задавайте ширину и высоту, чтобы текст не прыгал при подгрузке. Под фото кратко пишите, что сделано и из какой ткани: так работа понятна, даже если картинка не загрузилась.
Адрес и часы работы: детали, из-за которых не доходят
Адрес должен быть текстом, а не картинкой, чтобы его можно было скопировать или открыть в картах. Добавьте ориентиры: этаж, вход со двора, вывеска. Часы работы укажите с выходными и перерывом. Если примерка только по записи, напишите об этом рядом с адресом, а не только на странице услуг.
