Разработка сайта для Ленинградской областной клинической больницы

Ленинградская областная клиническая больница (ЛОКБ) — главное медицинское учреждение Ленинградской области, современная многопрофильная клиника. В ее структуру входит стационар круглосуточного пребывания 1053 койки, 38 специализированных лечебных отделений, а также аптека, вспомогательные, параклинические, хозяйственные и прочие службы.

Несмотря на такие масштабы, клиника имела низкую узнаваемость и осведомленность пациентов о своих услугах: даже те, кто живет через дорогу, не знали о том, что они могут обратиться в ЛОКБ. Одной из причин такой ситуации было то, старый сайт не отвечал новым требованиям веба (по дизайну, юзабилити, функциональности). Конкуренты же наоборот становятся активнее: используют больше способов работы с аудиторией за счет развития своих сервисов, например, запись на прием к врачу на конкретное время.

Таким образом, назрела необходимость в новом современном сайте, и мы принялись за работу.

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

• Разработать дизайн страниц, показывающий, что государственное медицинское учреждение тоже может быть приятным местом. Требовалось убедить пользователя сайта доверить свое здоровье именно этой больнице.

• Настроить и запрограммировать административную часть для удобного и быстрого управления сайтом сотрудниками ЛОКБ.

• Учесть требования законодательства для сайтов медицинских организаций.

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

Мы использовали белый фон, крупную темную типографику и добавили зеленые линии, подложки и ссылки (цвет логотипа). 

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

Аналитика на старте и следование концепции UX-дизайна позволили нам тщательно отследить путь пользователя на сайте и до мелочей продумать навигацию:

• мы закрепили самые кликабельные разделы в хедере, а по кнопке меню-бургер открыли подробный список с выпадающими списками подразделов,

• для увеличения конверсии удобно расположили формы и добавили якорные ссылки на страницах отделений, врачей, услуг,

• при скроллинге вверх настроили выпадающий из хедера блок с телефонами,

• добавили меню с нижним таббаром для смартфонов.

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

• Верстальщики выполнили кроссбраузерное, адаптивное HTML-кодирование страниц без параллаксов и с минимумом анимации, чтобы убрать риски долгой загрузки и недопонимания некоторыми группами пользователей.

• Программисты внедрили и настроили плагин "Версия для слабовидящих", необходимый для сайта медицинского учреждения согласно Приказу Минздрава РФ от 30.12.2014 № 956н.

• Все модули мы тщательно протестировали на предмет бесперебойной работы на устройствах с разными размерами и программным обеспечением.

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

Для увеличения конверсии сайта на Главной странице мы отказались от классического решения для первого экрана — красочного слайдера с фото или видео. Вместо этого сделали увеличенный хедер с названием, контактами и кнопкой "Записаться на прием". Ниже разместили крупный блок с телефонами.

Далее по странице мы разместили блоки со ссылками на информацию из важных разделов сайта: услуги, врачи, направления, памятки.

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

Еще одну кнопку для записи на прием мы разместили ближе к низу контентной области главной страницы.

Расписание врачей мы реализовали в виде адаптивной таблицы. В ней наглядно представили информацию о времени, месте и типе приема.

Над таблицей добавили форму поиска и блок с фильтрами.

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

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

Получившийся сайт можно модернизировать и визуально, и функционально.

В ближайшее время мы начнем оказывать услуги по сопровождению проекта: техническая поддержка и SEO-продвижение. Будем работать над наполнением сайта контентом и развитию структуры за счет создания теговых страниц по услугам. 

Также мы подготовили медиаплан по рекламе, но к его реализации перейдем уже в следующем году.