Главное — на первом экране
Что вы делаете, для кого — и кнопку связи видно сразу, без прокрутки. Экран телефона маленький, поэтому туда идёт только самое сильное.
УслугиСоздание сайта под ключСайт для телефона
Адаптивный дизайн под ваш телефон
Адаптивный дизайн под ваш телефон
Адаптивный веб-дизайн — когда одна страница сама подстраивается под экран. Вас часто ищут с телефона, поэтому кнопки, форму и звонок делаю под палец.
- от $400
- Кнопки под палец
- Звонок в одно нажатие
Просто напишите — дальше я сам. Посчитаю задачу без оплаты.
детейлинг-студия · Киев
Авто как из салона — за один день
Полировка, керамика, химчистка. Забираем и привозим авто.
★★★★★4,9 · 312 отзывов в Google
Услуги
Полировка кузова6 ч
Керамическое покрытие8 ч
Химчистка салона4 ч
Работы
Отзывы
«Забрал вечером — машина как новая»Андрей · ★★★★★
«Оставила заявку с телефона за минуту»Ирина · ★★★★★
Telegram · Viber · WhatsApp
Заявка
Имя
Телефон
Услуга
Спасибо!Заявка уже в студии — ответим в ближайшее время.
Что это
Что такое адаптив в веб-дизайне
Адаптив в веб-дизайне — это когда один сайт сам подстраивается под экран: телефон, планшет или компьютер. Это не отдельная мобильная версия, а та же страница: на узком экране она выстраивается в одну колонку, кнопки становятся крупнее, а меню сворачивается в один значок.
Кому это важно: всем, к кому клиенты приходят с телефона — из Google, Instagram или рекламы. Человек стоит в очереди или едет в транспорте и открывает сайт одной рукой. Если в кнопку трудно попасть, а текст приходится растягивать пальцами, он закрывает вкладку и уходит к другому.
Гордей Фисун · обновлено
Детали
Дизайн мобильной версии сайта: из чего состоит
Мелочи, из-за которых с телефона пишут, а не закрывают страницу.
Текст без увеличения
Шрифт читается без растягивания пальцами, строки короткие. Таблицы и длинные списки перестраиваю, чтобы ничего не приходилось листать вбок.
Меню, которое не мешает
На телефоне меню прячется под одну кнопку и открывается на весь экран. Пункты крупные — легко попасть даже на ходу.
Ничего не съезжает
Текст и фото не выходят за край экрана, а всплывающее окно не закрывает кнопку заявки.
Фото под размер экрана
На телефон не грузится огромная картинка для монитора: фото подбираются под ширину, поэтому страница не тормозит.
Что вы получаете
Адаптивный веб-дизайн: что входит
Одна страница — любой экран
Текст, фото и кнопки сами перестраиваются под ширину: на телефоне — в одну колонку, на компьютере — шире. Отдельную мобильную версию держать не нужно.
Кнопки и форма под палец
Кнопки крупные и с отступами, чтобы не попасть в соседнюю. В форме — только нужные поля, а для номера сразу открывается цифровая клавиатура.
Звонок одним нажатием
Номер на сайте — это кнопка: коснулись, и телефон уже набирает ваш номер. Рядом можно поставить Telegram, Viber или WhatsApp — кому как удобнее.
Быстро открывается
Сайт делаю руками, не в конструкторе, поэтому на странице нет лишнего. Она быстро открывается с телефона, и её видно в Google.
Проверка
Как я проверяю адаптивную вёрстку сайта
Перед запуском страница проходит разные экраны — и ваш телефон тоже.
Сначала телефон
Страницу собираю с узкого экрана: что удобно там, то легко развернуть и на широком.
Разные ширины
Смотрю страницу на маленьком телефоне, планшете и большом мониторе — чтобы ничего не обрезалось и не наезжало одно на другое.
Ваш телефон
Присылаю ссылку на живую версию: вы открываете её на своём телефоне, а не смотрите картинки. Правки вносим тут же.
Путь клиента
Перед запуском прохожу путь клиента с телефона: открыть, позвонить, оставить заявку — и смотрю, чтобы она дошла вам в Telegram.
5,0 · 37 отзывов
- Вы решаете, двигаться ли дальшеПосле каждого этапа можете остановить проект. Оплачиваете только выполненные и принятые этапы. Предоплату за неначатые — возвращаю.
- Цена окончательная. Перерасход — мойЗадача не изменилась — сумма, названная на старте, не растёт. Изменилась — сначала обсуждаем, потом делаю.
Вопросы
Вопросы об адаптивном сайте
Что такое адаптивный веб-дизайн?
Адаптивный веб-дизайн — это когда одна и та же страница сама подстраивается под экран телефона, планшета или компьютера. Текст, фото и кнопки перестраиваются так, чтобы сайтом было удобно пользоваться без увеличения.
Адаптивная вёрстка или отдельная мобильная версия — в чём разница?
Отдельная мобильная версия — это второй сайт, который нужно обновлять отдельно. Адаптивная вёрстка — один сайт для всех экранов: изменили текст один раз, и он обновился везде.
Будет ли лендинг адаптивным?
Да, адаптивный лендинг — такая же норма, как и адаптивный сайт. Лендинг — одна страница под одну услугу, поэтому на телефоне кнопка заявки должна быть под рукой, а текст — читаться без увеличения.
Старый сайт плохо выглядит на телефоне. Что делать?
Если старый сайт плохо выглядит на телефоне, его можно переделать полностью — новый будет адаптивным с самого начала. Если достаточно доработать нынешний, для этого есть отдельная услуга «Обновление и поддержка сайта».
Как ещё до запуска посмотреть, каким сайт будет на телефоне?
Ещё до запуска вы открываете живую версию сайта на своём телефоне — я присылаю ссылку. Это рабочая страница, а не картинка, поэтому правки вносим сразу.
Сколько стоит сайт, удобный на телефоне?
Адаптивность отдельно не оплачивается — она входит в каждый сайт. Цена сайта — от $400; точную сумму назову после первого разговора, и дальше она не вырастет.
Что подготовить, чтобы заказать сайт для телефона?
Для старта хватит одного сообщения: что за бизнес и откуда приходят клиенты, можно голосовым. Если сайт уже есть, пришлите ссылку — я посмотрю, как он открывается на телефоне.