При верстке страниц авторизации, приветствия, опросов и т.п. необходимо придерживаться следующих правил и ограничений:
- Внешний вид контента. Не стоит использовать множество мелких деталей и разноцветных тонов и шрифтов. Следует учитывать все возможные варианты устройств пользователя (телефон, ноутбук, планшет, домашний ПК), их размерность экрана и степень освещенности.
- Объем контента. Следует учитывать различную скорость сети Интернет и возможные помехи, поэтому рекомендуемый объем контента страницы не должен превышать 1 МБ (с учетом всех картинок и скриптов). Следует использовать функцию сжатия фоновой страницы до качества JPEG 30%, а также использовать уменьшение объема картинок.Текст занимает меньше места, чем изображения. Для видео-роликов пределом является 10 МБ с длительностью не более 30 секунд и форматом MP4.
- Расположение контента. Вся информация, расположенная на странице авторизации и приветствия, будет загружена из конструктора страниц с сервера авторизации до того, как у абонента появится полноценный выход в Интернет. Поэтому не следует размещать в теле страниц ссылки на внешний подгружаемый из Интернета и CDN-сетей контент (например, javascript, шрифты, картинки и т.п.).
- Встраиваемый контент. Такого рода информацию (картинки, шрифты и т.п.) следует размещать в отдельных файлах, которые всегда можно прикрепить к странице (не в виде конструкций вида <img src="data:image/gif;base64,..../>). Рекомендуется использовать преимущественно системные возможности, например, системные шрифты.
- Адаптивная верстка. Шаблоны страниц, идущие с системой, поддерживают адаптивное изменение размеров картинок, но тем не менее, не стоит загружать в конструктор логотипы больших размеров.Например, для основного логотипа, размещаемого над текстом на странице авторизации, рекомендуется использовать размеры порядка 400 на 150 пикселей. Также следует внимательно относиться к использованию прозрачного фона картинок. После верстки страницы следует воспользоваться режимом пред-просмотра страниц в отдельном окне, где можно включить режим "Инструменты разработчика" используемого браузера.
- Использование сложного кода. Страницы авторизации и приветствия, как правило, отображаются в урезанных версиях браузеров (мини-браузере). Следует помнить, что при таком отображении страницы могут не работать Javascript-функции, а также не работают Cookies и Flash. Рекомендуется использовать набор инструментов библиотеки JQuery, которая применима для мини-браузеров. Также следует учитывать, что не все устройства пользователя при использовании мини-браузера поддерживают автоматическое воспроизведение виде-ролика (в некоторых случаях пользователю необходимо будет воспроизвести видео самостоятельно). Возможны проблемы с качеством звука и его громкостью.
- Операционные системы мобильных устройств. Следует учитывать, что по завершении авторизации и получении доступа в Интернет большинство Android-смартфонов закроет окно со всем представленным контентом и ссылками, по которым направили абонента. Это штатное поведение мобильных устройств, зависящее от производителя смартфона, система авторизации на это никак не влияет.
- Избыток информации. Следует избегать обилия информации и деталей на странице СМС-авторизации (идентификации). Абоненту необходимо сосредоточиться на процессе авторизации. Не рекомендуется размещать навязчивую рекламу на страницах авторизации, где от пользователя требуется выполнение каких-либо действий (ввод номера телефона, или кода).
- Экспертный режим контента страницы. Контент в экспертном представлении (формат HTML) должен быть выполнен в соответствии с установленными в шаблоне правилами и порядком. В шаблоне представлены формы с кнопками, отправка которых приводит к тем или иным действиям (запрос СМС-кода, переход в Интернет, отправка кода ваучера). Необходимо сохранить или повторить все представленные формы вместе с их именами и полями. Следует учитывать, что страница авторизации имеет три разных представления, выполненных из скрытых блоков (запрос номера, ввод кода СМС, ввод кода ваучера), каждый из которых динамически включается в зависимости от выбранной ситуации (используется одна страница для разных вариантов - "ввести телефон", "ввести код" и т.п.).
- Лицензионное соглашение. На страницах авторизации пользователя отображается логотип системы WNAM. Если необходимо получить полное брендирование страниц и убрать или заменить логотип системы WNAM на собственный, необходимо приобрести соответствующую лицензию системы WNAM. Более подробную информацию о брендировании можно получить здесь.
Далее представлено более подробно описание структуры самих HTML-страниц разного типа (далее).