Сайт для учебного центра «Меритократ»: каталог программ и документы

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

Главная сложность в объёме. «Меритократ» учит охране труда, рабочим профессиям, трактористов-машинистов, повышает квалификацию по промышленной, пожарной, экологической и электробезопасности, гражданской обороне, антитеррору и безопасности дорожного движения, проводит профессиональную переподготовку, тренинги и онлайн-обучение. Заказчики центра в основном предприятия края: специалисту по охране труда нужно быстро найти программу, посмотреть часы и оставить заявку.

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

Мы вынесли все программы в боковое меню. Оно стоит слева на каждой странице и делит обучение на группы с иконками: «Охрана труда», «Обучение профессии», «Повышение квалификации», «Профессиональная переподготовка». Группы раскрываются, внутри направления: например, в повышении квалификации их восемь, от промышленной безопасности до безопасности дорожного движения. Ниже отдельными пунктами тренинги, онлайн-обучение, пакетные предложения и производственная безопасность.

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

Страница направления: таблица курсов

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

Поиск и главная

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

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

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

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

Сайт собран из той же графики, что айдентика «Меритократа»: глубокий зелёный, рамки-щиты и знак со звездой. На первом экране объёмный щит в 3D, плашки с преимуществами центра повторяют форму щита. Иконки сайта нарисованы той же линией, что знак.

На телефоне боковое меню прячется под кнопку, а плашки и таблицы перестраиваются в одну колонку.