Страница хостинг-провайдера редко бывает короткой: тарифы, технические ограничения, условия оказания услуг, порядок переноса сайта, ответы на частые вопросы. Посетитель приходит с конкретной задачей и уходит, если не находит нужное за несколько прокруток. Ниже приёмы, которые помогают разгрузить длинную страницу, не вырезая из неё важное.
Почему страница хостинга читается тяжело
На такой странице смешиваются три вида содержимого. Маркетинговое: преимущества и описание дата-центра. Справочное: объём диска, число баз данных, версии PHP. Договорное: что считается превышением нагрузки, как устроен возврат средств. У каждого вида свой читатель и своя скорость чтения. Когда всё идёт одним потоком, тот, кто хочет сравнить тарифы, продирается через рассказ о площадке. А тот, кто ищет условия, не уверен, что нашёл их целиком.
С каких вопросов посетителя начать структуру
Выпишите 5–7 вопросов, с которыми к вам приходят. Например: что входит в тариф, можно ли перенести сайт с другого хостинга, как часто делаются резервные копии, как связаться с поддержкой в нерабочее время, что будет при превышении нагрузки. Каждому вопросу отдельный раздел. Заголовок «Дополнительная информация» ничего не сообщает, а «Что происходит при превышении нагрузки» позволяет понять, нужен ли раздел, ещё до чтения.
Оглавление и якоря в начале страницы
Короткий список ссылок на разделы внутри страницы (якоря вида #backup) даёт посетителю карту. Достаточно 5–7 пунктов, формулировки те же, что в заголовках. После крупных разделов добавьте ссылку «К началу страницы». Если шапка сайта закреплена, проверьте, что после перехода по якорю заголовок раздела не прячется под ней: нужен отступ сверху. Проверьте переходы в разных браузерах, включая старые версии Internet Explorer.
Условный пример: как перестроить страницу «Виртуальный хостинг»
Допустим, сейчас это одно полотно текста. Его можно собрать так:
- две-три строки в начале: для каких сайтов подходит услуга, что делать дальше;
- оглавление со ссылками на разделы;
- таблица сравнения тарифов: в строках параметры (дисковое пространство, число сайтов, базы данных, почтовые ящики, резервные копии), в столбцах тарифы;
- раздел «Что происходит при превышении нагрузки» из трёх коротких абзацев с понятными терминами;
- раскрывающиеся блоки для редких вопросов: смена версии PHP, доступ по SSH, настройка DNS;
- полный текст договора на отдельной странице, а на этой странице выжимка ключевых пунктов со ссылкой на оригинал. Формулировки выжимки согласуйте с тем, кто отвечает за договорную часть.
Таблицы, списки и раскрывающиеся блоки: где они уместны
Таблица нужна для сравнения, а не для оформления текста. Единицы измерения пишите прямо в ячейках, а названия параметров держите в первом столбце. Следите за единообразием: если в одном месте написано «без ограничений», а в другом приведены лимиты, посетитель решит, что его вводят в заблуждение. Оговорки ставьте рядом с параметром, а не в конце страницы.
Раскрывающиеся блоки подходят для второстепенного. Условия, влияющие на выбор тарифа, прятать нельзя. Содержимое блоков должно быть в HTML-коде изначально, а скрывать его должен скрипт. Тогда текст доступен при отключённом JavaScript и корректно выводится на печать.
Строки, шрифт и абзацы
Для длинного текста подходит ширина строки в 60–80 знаков, размер основного шрифта не меньше 14–16 пикселей и межстрочный интервал около 1,4–1,5. Абзацы держите в 3–5 строк, а одну мысль выносите в первое предложение. Технические значения (адреса DNS-серверов, пути к файлам, параметры настроек) выделяйте моноширинным шрифтом и отдельной строкой, чтобы их можно было скопировать без ошибок.
Проверочный список перед публикацией
- Можно ли за 10 секунд найти ответ на каждый из главных вопросов посетителя?
- Говорит ли каждый заголовок о содержании раздела?
- Есть ли оглавление и работают ли якоря при закреплённой шапке?
- Одинаково ли названы параметры тарифов в таблице и в тексте?
- Стоят ли оговорки рядом с теми цифрами, к которым относятся?
- Раскрыты ли по умолчанию условия, влияющие на выбор тарифа?
- Читается ли страница на узком экране смартфона, не разъезжается ли таблица?
- Выводится ли страница на печать без потери содержимого?
- Ведёт ли каждый раздел к понятному следующему шагу: заказу, вопросу в поддержку, переносу сайта?
