Обсудить проект
Расскажите о вашей задаче, чтобы мы могли обсудить все детали.
Вставьте в этот блок заголовок H1. Он может быть достаточно большим и занимать 3-4 строчки!
Важно: на обложке не дублируем текстовую часть. Только сама картинка
Обычно после заголовка идёт вводная часть. Она набирается вот таким обычным текстом. Все стили всех вариантов контента уже настроены заранее в этом шаблоне. Менять кегль, жирность, цвет и другие параметры не нужно.
Исключения: ссылки (выделение цветом #520f95 и подчеркивание 1px задаются отдельно, нулевая строка/столбец в таблице (выделяется фирменным аспидным цветом и белым текстом + для основного текста таблицы нужно во всех строках назначить цвет #646 464 (не в настройках блока, а именно в каждой строчке таблицы, настройки не трогаем). Не забываем всегда использовать встроенный в тильду типограф, чтобы избавится от висюлек.
Содержание
Это пример H2 заголовка с якорной ссылкой прямо над ним
На что обратить внимание? (H3)
Якорные ссылки (H4)
Якорные ссылки делаем из заголовков H2 с помощью любого сервиса транслита, например вот этого. При этом важно не делать их слишком длинными и сокращать ненужные слова. Например в заголовке выше я также убрал немного букв и вместо #eto-primer-h2-zagolovka-s-yakornoy-ssylkoy-pryamo-nad-nim вышло #primer-h2-zagolovka-s-yakornoy-ssilkoy
Изображения
Если на момент верстки статьи изображения еще не готовы, то можно использовать заглушку. Она лежит тут (кстати, на внешние ссылки обязательно ставим открытие в новой вкладке + вторую галочку чтобы не передавать вес страницы).
Таблицы – всегда отдельным блоком
Важно чтобы табличный контент был оформлен именно таблицей внутри функционала тильды (не картинкой или как-либо еще), это влияет на сео. Помимо ручного выделения нулевой строчки/столбца фирменным цветом (#735CDD) и установки цвета текста для каждой строчки (#646 464) есть еще один момент:
После окончания оформления таблицы мы её дублируем. Одну версию оставляем для десктопа и растягиваем по ширине статьи, устанавливаем ограничение видимости, чтобы блок показывался только на экранах от 960px. На втором блоке максимально сжимаем контент (добавляем ручной перенос длинных слов по слогам, если это нужно). Это важно, потому что таблица по ширине должна влезать в рамки мобильной версии (иначе она будет скроллится вбок и половина читателей её или не заметят, или воспримут как нашу ошибку в вёрстке. Ниже — пример:
Иногда для старых статей можно использовать в конце вот такой вот текст, так как там вместо финальной отдельной секции часто исползовался один "продажный" абзац о нас.
Ниже будут примеры типовых блоков, которые мы используем во всех (или почти во всех) статьях
Сдавая статью не забывайте отключать Шапку на этой странице, иначе и меню и форма заявки будут дублироваться!
Типовые блоки
Alias
Некоторые блоки не меняются от статьи к статье, их мы просто подгружаем через alias-виджет тильды. Кстати, якорная ссылка до формы с подпиской на рассылки всегда «#subscribe».
Понравился материал? Подпишись на рассылку
Выберите, на какую рассылку подписаться. Только то, что реально работает в корпорациях
Получить консультацию
Расскажите о вашей задаче, чтобы мы могли обсудить все детали.
Адаптивные блоки
Эти блоки тоже повторяются от статьи к статье, но контент в них обычно адаптируется под тематику. Все исходники этих и alias-блоков лежат
в тильде тут.
P.S. Обложки на блок с рекомендациями всегда делаем без мелкого текста и без нашего логотипа. Только сама картинка + вариативно H1 (если визуального контента на обложке мало)
в тильде тут.
P.S. Обложки на блок с рекомендациями всегда делаем без мелкого текста и без нашего логотипа. Только сама картинка + вариативно H1 (если визуального контента на обложке мало)
Рекомендуем