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

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

Итак, для посещения сайта вобьём в поисковик аббревиатуру. Нас встречает вот такой креатив:

Спасибо, что включили в метаданные телефон и адрес. Описание больше, чем нужно для поисковой выдачи. Написанное название сайта с маленьких букв выглядит однородно, но вот зачем выделять "об институте" нижним подчёркиванием? Я б ещё поняла, если бы вуз обучал программистов и тестировщиков, но это гуманитарный вуз. Не попадает в специфику.

Далее видим вот это безобразие:

Вроде бы использовано два цвета, но исполнение сбивает с толку. Для чего эти синие линии, образующие ромбы? Я пытаюсь отследить их направление взглядом и не понимаю закономерности. Буквы слишком тонкие и сливаются с фоном, из-за этого читать текст трудно. Не хватает контрастности? Я перевела скриншот в чёрно-белый, и тут ситуация с текстом намного лучше:

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

Обратите внимание, что шрифт у названия вуза, у дополнительной информации и у названия других блоков разительно отличаются. И шрифт с засечками читается намного хуже. Это программа «Сдохни или умри», только с чтением текста шрифтом с засечками на странном красном фоне.

Допустим, я интересуюсь поступлением. По навигации в верхнем крае сайта нахожу раздел «Информация о поступлении», а потом сразу телефон приёмной комиссии и физический адрес вуза. Ниже в обилии текста нахожу информацию о лицензии, а также программы переподготовки и повышения квалификации. Я хотела написать, что поиск нужной информации занимает больше времени, но, кажется, беру свои слова обратно.

Кстати, стрелки, которые вы видите, не ведут на новые страницы или в низ страницы. Они скрывают дополнительные пункты:

Оставшаяся справа от блока о дипломе стрелка ведёт уже на другую страницу:

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

Плюс — стоимость учёбы в вузе и профили видны сразу, не спрятаны в приложениях и нормативных документах. Но из-за отсутствия акцентов и направляющих их сразу не видишь.

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

Кратко перечислю главные проблемы сайта:

• сбивающий с толка фон;

• неудачно подобранный оттенок красного цвета на фоне;

• неудачная комбинация шрифтов;

• отсутствие структуры и направляющих, в том числе из-за сбивающего с толку фона.

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

На ней же доступен режим чтения, в котором настраивается контрастность и размер шрифта. Здесь мы наблюдаем типичные и знакомые разделы сайта: «О сайте», «Абитуриентам», «Студентам» и так далее. И неприятное окошко с чатом в придачу. В этой версии выдержан фирменный синий цвет вуза, а если пролистать к блоку с новостями, то увидим ещё креативы:

Как будто в начало десятых вернулась, спасибо. <sarcasm>

Я посмотрела требования к оформлению сайтов образовательных учреждений. Они ориентированы на размещение нормативных документов. Нормальная практика других организаций — размещение только ссылок на документы о стоимости обучения и вступительных испытаниях. В таких случаях даже поиск по сайту бессилен. Требования к оформлению сайтов не говорят размещать только документы — говорят выкладывать информацию «с приложением её копии». Не считаю правильным оставлять пользователя разбираться с официальными бумагами вуза, пусть главная информация будет выведена в раздел с программами подготовки.

Вот, например, сайт моего колледжа. Он сделан на ucoz, но спасибо админу, что решил не прикладывать одни только документы:

А это сайт МГУ им. Ломоносова. Здесь прекрасно всё: обилие блоков с новостями, статьи о патриотических акциях, которые недавно проводили:

На странице с направлениями подготовки слетела вёрстка фильтров:

А это главный экран сайта Вятского государственного университета. Тут ничего и говорить не надо:

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

Вернёмся к ИЖЛТ. Он поступил правильно и оставил название и перечень вступительных испытаний и стоимость платных мест:

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

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

Четвёртая иконка ведёт на страницу лаборатории ИЖЛТ, на которой размещаются материалы из открытых лекций, анонс предстоящих событий и собственное издание. Эта страница сделана в Тильде, и веб-дизайнер даже не заморочился с фавиконом. Но зато оплатили домен!

Что с этим делать

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

Нельзя просто так взять и приложить одни документы. Опишите в одном-двух абзацах то, к чему они созданы.

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

Подберите нормальные шрифты. Для основного текста подойдёт моноширинный без засечек. Не используйте Times New Roman и простигосподи Comic Sans. При подборе гарнитуры для заголовков тоже не пускайтесь во все тяжкие.

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

Если нет ресурсов перенести сайт на другой движок, подберите или измените нынешний шаблон сайта на ucoz, чтобы интерфейс не отталкивал посетителей.

Лаконичный дизайн испортит патриотическая картинка, поэтому по возможности откажитесь от них. Вместо них подойдут фотографии с мероприятий.

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

UPD: В телеграм пришёл фидбек от одного человека, который скинул сайт Ижевского госунивера. Не на конструкторе, очень приятный: ненавязчивое новогоднее оформление, баннеры смотрятся уместно. Шрифт для меня мелковат, но фиксится тачпадом, а при приближении в браузере блоки перестраиваются!