Найти тему

5 советов по оформлению текста на сайте: как сделать так, чтобы ваши статьи дочитывали

Оглавление

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

Превратить хороший текст в нечитаемый - дело 5 минут
Превратить хороший текст в нечитаемый - дело 5 минут

Идеальный шрифт

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

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

Грамотная организация пространства сайта

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

Не перегрузить пространство страницы помогли маркированные списки, выводящиеся по требованию фрагменты и большие отступы между текстом и картинками
Не перегрузить пространство страницы помогли маркированные списки, выводящиеся по требованию фрагменты и большие отступы между текстом и картинками

Умеренное выделение текста

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

Работа с наглядными материалами

Времена, когда хорошая статья могла быть проиллюстрирована единственной картинкой, давно в прошлом. Сегодня актуальны эффектность, яркость и качество визуального оформления. Позаботьтесь о том, чтобы наглядность обогащала текст: делала его более интересным и понятным для читателя. Изображения должны быть высокого качества и соответствовать содержанию страницы. Если в статье несколько фотографий, приведите их к единому размеру. Уделите внимание расположению иллюстраций: желательно, чтобы страница выглядела лаконично.

Обязательно обрабатывайте видео и изображения перед размещением. Редактируйте картинки, подгоняйте размеры и формат. Предпочтение отдаётся формату jpg. Если изображение содержит только текст или вы хотите получить прозрачный фон, выбирайте png. Дизайнеры Студии ЯЛ советуют работать с картинками через Photoshop.

Статья о красивых домах города просто не могла обойтись без десятка качественных фотографий
Статья о красивых домах города просто не могла обойтись без десятка качественных фотографий

Гармоничность цветовой комбинации фона и шрифта

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

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

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

После нахождения на таком сайте срочно нужна помощь окулиста
После нахождения на таком сайте срочно нужна помощь окулиста

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