Создание “мобильного” сайта для бара-ресторана “Крокодил”

Весной 2017 года попросил о встрече наш давний и постоянный заказчик, с несколькими проектами которого мы работали. Как выяснилось, речь должна была пойти о работе над одним из сайтов, сделанных нами раньше - ресурсе http://bar-crocodile.ru/. Он был создан еще в конце 2012 - начале 2013 года и исправно работал как презентационный сайт-визитка бара-ресторана «Крокодил». На нем содержалась основная информация о заведении, полное меню и контакты.

Заказчик уже несколько раз порывался переделать сайт и заняться его продвижением, но откладывал, поскольку отвлекался на другие, более важные проекты. Да и само место и заведение были широко известны в Санкт-Петербурге, привлекали многих посетителей, что позволяло держаться на плаву и без активных рекламных кампаний.

Но пришло время, когда потребовалось существенно увеличить поток клиентов ресторана. Поэтому владелец решил плотно заняться раскруткой “Крокодила”, задействовав все возможные инструменты: буклеты, многочисленные соцсети и, в том числе, продвижение сайта. От нас ему нужен был профессиональный совет - как и с чего именно начинать.

Задачи проекта

Первым делом мы попросили несколько дней на подготовку коммерческого предложения для развития сайта. Для этого нужен был полноценный аудит и анализ прямых конкурентов. При изучении статистики ресурса мы отметили, что 70% посетителей заходит с мобильных устройств. Такое положение нас не удивило, учитывая тематику сайта. Однако это ясно показало, что одна из причин малого числа заказов - неудобство пользования сайтом с мобильных устройств и его ограниченные возможности. Следовательно, требовалась не только полная переделка ресурса, но и обязательное использование адаптивной верстки и дизайна.

Кроме того, выяснилось, что основной поток клиентов ресторана в весенне-летний период - это туристы (как россияне и выходцы из стран бывшего СНГ, так и иностранцы). А на действующем сайте информация на английском языке отсутствовала вовсе. Тем самым солидная часть иностранных клиентов просто отсекалась.

Поскольку владельцу ресторана требовалось резко увеличить поток клиентов в самые короткие сроки, было понятно, что времени на глобальную и полную переделку сайта нет. Занявшись полноценной оптимизацией и продвижением, можно было просто пропустить туристический сезон.

Поэтому на следующей встрече с заказчиком мы предложили ему такой план: делаем новый адаптивный сайт без CMS, наполняем его только самым привлекательным контентом, все предложения размещаем на двух языках – русском и английском. Этот ресурс работает на собственном поддомене, параллельно основному сайту, и благодаря специальному определению устройства в случае, если посетитель заходит на сайт с мобильного гаджета, он автоматически будет перенаправляться в мобильную версию. Рекламировать мобильный сайт мы будет на Google с помощью геотаргетинга.

Заказчик согласился с нашим предложением. Мы подготовили и подписали договор, выставили счёт на оплату. Также был составлен бриф с вопросами по новому ресурсу, на которые заказчик должен был оперативно ответить. Срок, отведенный нам для всех переделок, составлял всего одну неделя. Но мы были уверены, что справимся, и принялись за работу.

Реализация цели

Управляющий рестораном «Крокодил» обещал, что пришлет список с самыми ходовыми эксклюзивными фирменными блюдами, на которые лучше всего сделать упор при разработке нового мобильного сайта. Действительно, буквально через 2 дня нам на почту пришло письмо со списком из семи блюд, их описанием и фотографиями.

Получив всю необходимую информацию мы принялись за составление структуры сайта. По сути, он должен был состоять из одной посадочной страницы. Вверху этой страницы мы разместили блок с контактной информацией и режимом работы заведения. Ниже поместился красивый баннер о заказе столика и получении скидки. Это блок был особенно важным, поэтому мы постарались сделать его максимально привлекательным, запоминающимся и необычным.

Еще при обсуждении предстоящей работы заказчик задал нам резонный вопрос: как понять, что новый сайт работает, приносит заказы, что рекламная кампания настроена правильно? Ведь непонятно, кто из посетителей ресторана пришёл “с улицы”, кто является давним и постоянным клиентом и пришел “по старой памяти”, а кто появился в “Крокодиле”, воспользовавшись новой версией ресурса. То есть наш клиент хотел доказательств качества работы студии, и четкой статистики посетителей, которые узнали о ресторане через новый сайт и пришли благодаря ему.

Мы предложили ему несколько весьма простых, но остроумных ходов. Во первых, на сайте следовало разместить новый номер, который не знал никто из прежних клиентов ресторана. При поступлении звонка-заказа на новый номер сразу будет понятно, что эти люди узнали о “Крокодиле” из мобильной версии. Во вторых, в блоке «Заказать столик» нужно было сделать возможность запроса на получение 15-процентной скидки на всё меню. Но пришедший или позвонивший клиент мог получить скидку, только назвав определенный код, который появлялся в специальной области блока заказа (“закрашенный” код открывался нажатием на кнопку). Таким образом можно было отследить и учесть посетителей, пришедших в ресторан благодаря новому мобильному ресурсу.

Также главная страница включала блок о бизнес-ланчах, под которым разместились блоки с фирменными блюдами: красочные фотографии, описание ингредиентов, стоимость. Под фирменными блюдами сделали кнопку «Смотреть всё меню», при клике на которую посетитель перемещался на основной сайт, где мог ознакомиться не только с фирменными блюдами заведения, но и с основным меню, в том числе - с винной картой.

Ниже следовали блоки «О Нас» (кратко знакомящий с историей заведения), «Интерьер» (с фотографиями ресторана «Крокодил»), форма обратной связи для бронирования столика и интерактивная карта, с меткой расположения заведения. Структуру показали заказчику и она была утверждена без изменений.

Пока копирайтер создавал оригинальные тексты для всех блоков, дизайнер старался грамотно совместить прежний стиль, в котором выполнен основной сайт, с дизайном нового. По сути, старым остался только цвет бэкграунда и логотип. Всё остальное дизайнер придумал и оформил с нуля.

Заказчик очень порадовал нас качественными фотографиями блюд и интерьера заведения. Понимая важность первого впечатления, он заказал у профессионального фотографа специальную фотосессию. Фото смотрелись идеально: свежо, необычно и атмосферно. Когда дизайн был полностью готов, мы показали его владельцу, который остался очень доволен. Было сделано только одно изменение: два блюда из числа представленных в блоке “Фирменные” были заменены другими.

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

Ресурс проверили на кроссбраузерность и кроссплатформенность, создали поддомен и перенесли сайт на него. Настроили форму обратной связи и особый блок с получением кода на скидку.

По завершении финального тестирования, когда сайт был полностью готов мы показали его заказчику, чтобы тот мог составить окончательное мнение и самостоятельно все проверить. В это время мы занимались подготовкой объявлений для рекламной кампании, которые были запущены в тестовом режиме на несколько дней. После того рекламный бюджет и суточные лимиты были утверждены заказчиком, кампания стартовала в полную силу. Работа над сайтом заняла 4 дня, благополучно успев к началу туристического сезона. После запуска ресурс сразу же начал приносить звонки и заявки на бронирование.