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

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

Картинки

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

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

Вы можете выбрать один из трех способов размещения картинки: по ширине текста, шире текста и слева от текста.

Совет. Используйте картинки с разрешением равным или больше 1000 пикселей по горизонтали. Так вы будете уверены, что ваша картинка корректно отобразиться в виде большой карточки на главной странице.

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

Что касается поиска картинок, здесь есть несколько вариантов: купить лицензированные фотографии на фотостоках, либо найти бесплатные, используя гугл, соцсети и бесплатные фотостоки (такие как Unsplash, Pexels, Pixabay и др). Но если вы используете бесплатную картинку, не забудьте указать источник.

Чтобы указать источник картинки, достаточно написать адрес сайта где вы ее нашли. Не обязательно копировать весь URL из адресной строки.

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

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

Пример плохого оформления постов

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

Пример хорошего оформления постов

Вступительный абзац (лид)

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

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

Врезки и цитаты

Монотонные блоки текста утомляют зрителя. Чтобы дать читателю отдохнуть, разместите врезки с цитатами или краткими пояснениями. Это неплохой способ разнообразить текст, добавить акцентные точки, чтобы глаза не заскучали.

Пример врезки:

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

Чтобы добавить врезку, выделите текст и нажмите на иконку .

Заголовки и подзаголовки внутри поста

Используйте заголовки и подзаголовки, чтобы создать визуальную иерархию внутри поста. Так читателю будет проще ориентироваться в вашем тексте. Никто не любит читать бесконечные полотна текста, более того, это демотивирует читателей ознакомиться с вашей историей. 

Чтобы создать заголовок или подзаголовок, выделите текст и выберите Т или т.

Не пишите длинные заголовки прописными буквами. Это касается и основного текста. Текст, набранный прописными буквами, читается труднее, чем текст, набранный строчными. Такой “салат из прописных” считается плохим тоном в типографике.

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

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

Списки

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

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

Вы можете оформлять списки двумя спопобами:

  1. нумерованные списки (нажмите 1. потом пробел);
  2. маркированные списки (нажмите * или дефис потом пробел).

Для каждого типа нажмите ввод в конце строки и перейдите к следующему пункту списка. 

Нумерованные списки не могут быть продолжены после разрыва раздела или между картинками.

Встроенный контент

Часто я замечаю, что авторы в своих постах используют скриншоты публикаций из разных медиа (Twitter, Instagram, Facebook и т.д.). Есть более простой способ поделиться контентом. Scorum использует сервис iframely который позволяет встраивать контент из многих популярных сайтов. Например, вы хотите встроить публикацию из Facebook. Просто перейдите на страницу публикации и скопируйте ссылку из адресной строки браузера. Далее, в редакторе нажмите + и выберите иконку <>, вставьте ссылку и нажмите ввод. Готово!

Горячие клавиши

Ниже я привел список горячих клавиш, которые помогут ускорить вашу работу по написанию поста в нашем редакторе:

  • жирный шрифт: ⌘ + B (macOS), Ctrl + B (Windows);
  • курсивный шрифт: ⌘ + I (macOS), Ctrl + I (Windows);
  • гиперссылка: ⌘ + K (macOS), Ctrl + K (Windows);

В дальнейшем мы постараемся расширить этот список.


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