К слову об оформлении статей. Как грамотно оформляют заголовки с ссылкой на текст внутри статьи? Вопрос

Часто встречаю, когда длинные статьи разделяют не только на заголовки как в книге — оглавление, но они еще также являются ссылками, кликая по которым попадаешь на нужный отрезок текста статьи.

Как это делают?

Ранее я работала с html шаблонами лендинг типажа, там был скролл по тегу #text.

Но то дело html страница была. А тут как это юзать? Учитывая что я пользуюсь wordpress.

У меня есть конечно догадки, включить html разметку записи и там добавить id="text», но может еще есть о чем я не знаю.

4 Комментария

  1. Дополнение к вопросу. Вот тут указано ссылками на разделы статьи, нажав по ссылке страница скроллится до нужного заголовка.

    ссылками на разделы статьи
    https://ru.wikihow.com/написать-письмо-кумиру#.D0.9E.D1.82.D0.BF.D1.80.D0.B0.D0.B2.D1.8C.D1.82.D0.B5-.D0.BF.D0.B8.D1.81.D1.8C.D0.BC.D0.BE

  1. Все также используй якорь для перехода, пример на скрине! Просто выделяй текст, нажимай на вставить ссылку и вписывай #1, #2 и т.д.




    У меня вообще в шаблоне содержание само создается, главное H2 H3 заголовки выставить, а для дополнительной навигации уже по статье если вам это так необходимо, то только якоря #1, #2 и т.д.

    Вот как у меня автоматически создается содержание.

  1. Я бы разделил на: вебмастер (манипуляции с сайтом) и простой участник.

    С позиции простого участника, например, можно посмотреть: Как вы форматируете ответы Quora?


    Выбрать только надо ответы…

    А так на Quore сотни вопросов по форматированию.

    Написал ранее некоторые принципы:

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

    • Разделяйте текст фото и видео с отступами. Это не только помогает поднять значимость данного текста, но и визуально разделяет текст.

    P.S. Что касается вебмастера, то это UX… Подбор шрифтов для сайта и т.д. Ещё пример ответа ниже. Там свалено всё вместе. И обычные участники и вебмастера.

    См. ещё

    • Используйте понятные и читаемые шрифты. Выбирайте шрифты, которые ясны, разборчивы и легко читаются на разных устройствах и платформах. Для удобства чтения обычно используются шрифты Arial, Helvetica, Times New Roman и Calibri.

    • Оптимизируйте размеры шрифтов. Убедитесь, что ваш текст имеет подходящий размер для удобства чтения. Используйте более крупный размер шрифта для заголовков и заголовков и меньший размер для основного текста. Поддерживайте единообразие размеров шрифтов во всем документе или дизайне.

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

    • Используйте пробелы: разбивайте блоки текста пробелами, чтобы улучшить читаемость. Оставляйте достаточные поля, межстрочный интервал и интервал между абзацами, чтобы создать визуально сбалансированный макет. Рассмотрите возможность использования маркеров, нумерованных списков и подзаголовков для структурирования информации и улучшения удобства чтения.

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

    • Используйте иерархию с заголовками. При создании структурированных документов или веб-страниц используйте теги заголовков (например, H1, H2, H3), чтобы установить четкую иерархию. Это помогает читателям легко ориентироваться и понимать организацию контента.

    • Используйте цвета экономно и целенаправленно. Применяйте цвета к тексту экономно и целенаправленно. Цвета должны улучшать читаемость и обеспечивать визуальные подсказки, а не отвлекать внимание. Убедитесь, что между цветом текста и фоном имеется достаточный контраст для удобства чтения.

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

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

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

    ~

  1. К сожалению, речь не о том вообще. Может неправильно выразилась. https://libarea.ru/post/1520/k-slovu-ob-oformlenii-statey-kak-gramotno-oformlyayut-zagolovki-s-ssylkoy-na-tekst-vnutri-#answer_2966 я вот об этом оформлении