10 заповедей по оформлению веб-текстов


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

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

1. Размер шрифта — это очень важный момент, от которого напрямую зависит читабельность текста. Наиболее удобный для чтения кегль — 12-14 пунктов.

3JCTGa6

Источник: pikabu.ru

Когда на сайте очень мелкий шрифт текста

2. Больше воздуха! Полотна текста — зло, никто не хочет читать «многа букафф». Междустрочные интервалы и абзацные отступы вам в помощь. Тексту нужно «дышать», тогда его читать намного удобнее. Для этого можно использовать универсальное свойство CSS margin, оно определяет отступы со всех сторон абзаца или margin-top для отступа сверху и margin-bottom для отступа снизу. Нумерация и маркированные списки также разбивают текст и делают его более приятным для чтения.

3. Выделяйте важный текст правильно, чтобы он привлекал внимание, а не утомлял глаза. Не злоупотребляйте подчеркиванием и курсивом, не используйте много разных цветов, не играйте шрифтами. Чтобы выделить важную часть текста лучше увеличить кегль на пару пунктов и сделать полужирное начертание.

27-05-16-texterra-29

Источник: texterra.ru

4. Грамотно используйте иллюстрации. Изображения должны соответствовать тексту на сайте, дополнять его, раскрывать смысл, а не мешать восприятию. Поэтому правильная подборка иллюстраций не менее важна, чем хорошо написанный текст.

5. Стоковые изображения — это плохо. Не потому, что они плохого качества, ведь можно найти красивые и профессиональные снимки, а потому, что они используются в каждой второй статье. Лучше потратить немного больше времени и сделать с помощью несложных инструментов свои иллюстрации к тексту, чем взять первую попавшуюся в фотобанке. Но если у вас действительно нет времени заморачиваться с картинками, то ставьте хотя бы ссылку на первоисточник. Закон об авторском праве еще никто не отменял.

23

Источник: pikabu.ru

Стоковые изображения выглядят наигранно и нелепо

6. Заголовок — лицо вашего материала. Даже если вы написали крутой текст для email-рассылки, оригинальное описание товара или уникальную статью в блог, никто этого не оценит, пока вы не привлечете внимание ярким, цепляющим заголовком. Не обязательно писать его другим шрифтом, достаточно увеличить кегль на пару пунктов и выделить полужирным. Еще лучше заголовки и подзаголовки отделять отступами от основного текста.

7. Знаки препинания — это интонация текста. Правильные акценты и логические ударения очень важны для восприятия информации. Кроме основных правил пунктуации нужно запомнить еще одно: в конце заголовков не ставится точка, только восклицательный и вопросительный знак, а также многоточие. В маркированных и нумерованных списках в конце каждого пункта ставится точка с запятой, и только в конце последнего предложения — точка. Кроме того, все знаки препинания в тексте должны быть единообразны — кавычки, длинные тире, дефисы и т.д. Чтобы облегчить себе работу, воспользуйтесь Типографом от студии Артемия Лебедева.

8. Размеры строк имеют значение. Широкие полотна текста очень неудобно читать, а узкие колонки хорошо смотрятся разве что на мобильных устройствах. Поэтому лучше всего придерживаться золотой середины, оптимальная длина строки — 55-75 символов.

9. Цветовое оформление шрифтов должно гармонично сочетаться с фоном, текст должен хорошо читаться на контрасте с подложкой. Но лучше не использовать так называемую вывортку (белые буквы на черном фоне). От такого сочетания быстро устают глаза и читать практически невозможно.

struktura-teksta-dlya-sajta

Источник: seo-akademiya.com

Цвета вроде и контрастные, но текст совершенно не читабельный

10. Неразрывный пробел (ctrl + shift + пробел в редакторе или &nbsp; в HTML) — очень полезная штука, которую обязательно нужно использовать между инициалами и фамилией, датами, номерами телефонов и другой контактной информацией, чтобы избежать неправильных переносов с одной строки на другую. Удивительно, что многие копирайтеры и верстальщики не знают о такой простой вещи. Также в номерах телефонов дефисы лучше заменять пробелами — так легче воспринимать информацию. Не забывайте использовать семантические тэги <h1>, <h2>, <figure>, <cite>, <blockquote>, <aside> и т. д., с помощью которых вы можете сделать страницы сайтов более понятными для поисковых систем и браузеров.

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


+ Нет комментариев

Добавить комментарий