Лид — это первый абзац статьи, информативный отрывок позволяющий захватить внимание читателя на данном материале. Необязательный элемент.
Эта страница создана для демонстрации блоков и элементов, которые используются на сайте, и служит руководством для всех, кто работает над ним. Дизайнеры и технологи отрабатывают здесь стили, чтобы добиться приемлемых результатов в различных сочетаниях блоков и элементов. Контент-менеджеры и редакторы используют страницу в качестве справочника по верстке типовых страниц. Здесь же рассказывается о некоторых общих правилах оформления контента.
Заголовок <h1> на странице должен быть использован только один раз!
Имманентный подход подразумевает отношение к тексту как к автономной реальности, нацеленность на выявление его внутренней структуры. Репрезентативный — рассмотрение текста как особой формы представления знаний о внешней тексту действительности.
Текст состоит из некоторого количества предложений. Одно предложение, даже очень распространённое, сложное, текстом назвать нельзя, поскольку текст можно расчленить на самостоятельные предложения, а части предложения сочетаются по законам синтаксиса сложного предложения, но не текста.
Заголовок <h4> используется для большой вложенности в сложной структере документов, например, выставленные счета на оплату, отчёты или информация о полученных знаниях и сертификатах, дефферинциированных по подтипам.
Заголовок <h5> используется только для вспомогательной информации, где есть вероятность появления шестого уровня разбивки.
Самый «нижний» заголовок <h6> предваряет такие элементы, как «Комментарий» или «Таблица».
Если за заголовком более низкого уровня сразу следует заголовок более высокого, это нарушает композиционную связность элементов оформления и логику повествования. Поэтому после заголовка должен следовать текст (или иной контент), который этот заголовок и подчиненные ему подзаголовки, если они есть, озаглавливают.
Списки бывают нумерованные и ненумерованые. Принципы их оформления одинаковы.
Для использования такого списка необходимо на элемент <ul>
добавить класс .list-short
.
Наиболее простыми способами выделения информации являются полужирное и курсивное начертания. Подробнее: § 79. Делать фонт болдом или италиком?
На этом сайте есть дополнительный способ выделения при помощи подсвечивания, для чего используется элемент «Подсвеченный» (класс .highlighted
).
Элемент «Важно». (класс .important
), который используется для выделения особо важной информации. И еще немного специально написанного текста, чтобы получилось несколько строк для наглядности.
Важно следить за тем, чтобы элементы надстрочных и подстрочных индексов не увеличивали высоту строки, потому что это портит вид текстового блока. Пример: 23. Еще пример: H2SO4. В обоих случаях высота строки от индексов не должна меняться. Если отступ между первой и второй строками увеличился, значит, что-то сделано неправильно.
На сайте может встречаться несколько видов ссылок. Например, ссылка на Яндекс является внешней. Внутренние ссылки могут открываться по умолчанию в текущем окне (например, переход на главную страницу) или в новом окне (например, для показа изображений в оригинальном размере). Подробнее: § 171. Правила оформления ссылок.
Стиль псевдоссылки обеспечивается добавлением к нужному элементу класса .pseudo
.
Ссылку1 на сноску и название сноски нужно заключать в элемент «Сноска» (класс .footnote
). Таким образом сохраняется связь между ссылкой на сноску и самой сноской2.
Я увидел всю сущность нашей правящей системы. Там было много очень послушных дураков и неучей.
# | Заголовочная ячейка | Заголовочная ячейка | Заголовочная ячейка |
---|---|---|---|
1 | Ячейка с информацией | Ячейка с информацией | Ячейка с информацией |
2 | Ячейка с информацией | Ячейка с информацией | Ячейка с информацией |
3 | Ячейка с информацией | Ячейка с информацией | Ячейка с информацией |
Заголовочная ячейка | Ячейка с информацией | Ячейка с информацией | Ячейка с информацией | Ячейка с информацией | |
---|---|---|---|---|---|
Заголовочная ячейка | Ячейка с информацией | Ячейка с информацией | Ячейка с информацией | Ячейка с информацией | |
Заголовочная ячейка | Ячейка с информацией | Ячейка с информацией | Ячейка с информацией | Ячейка с информацией |
Элемент «Раскрывающийся» (класс .foldable
) используется для формирования раскрывающихся элементов. Например, для вопросов и ответов.
Элемент «Раскрывающийся» уместо использовать там, где скрываемая часть контента является больше вспомогательной по отношению к основному содержимому, чем смысловой.
Контент прячется скриптом при инициализации страницы и в дальнейшем показывается по клику на контрол. Управляется классами .foldable__content
и .foldable__link
.
1А это текст сноски, который помещается в элемент «Сноски» (класс .footnotes
).
2Это позволит при необходимости сделать всплывающую сноску.
Элемент «Комментарий» (класс
.comment
) применяется к пояснительному тексту. И еще немного специально написанного текста, чтобы получилось несколько строк для наглядности.