Базовая HTML-разметка в копирайтинге

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

Что такое html-разметка

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

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

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

Основные элементы html-разметки

Копирайтеру достаточно выучить всего несколько элементов кода, используемых наиболее часто и широко. Это и есть базовая html-разметка.

Заголовки и подзаголовки

Основной момент — многоуровневые заголовки. Они обозначаются как h1, h2, h3. Чтобы оформить заголовок первого уровня, который обычно является названием статьи, необходимо вписать открывающий тег <h1> перед названием, и закрывающий </h1> после.

Например, заголовок статьи о кухонной технике выглядит так:

<h1>Заказ техники для кухни</h1>.

В самих статьях обычно используются и подзаголовки. К примеру, дополнительный заголовок «варочные поверхности» можно обозначить разметкой заголовка второго уровня. Выглядит это следующим образом:

<h2>Варочные поверхности</h2>.

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

Нумерация и маркировка списков

Отдельные теги помогут в правильном форматировании списков. Маркированные — ul, нумерованные — ol. В обоих случаях нужен тег li для оформления составляющих списка.

Для примера, таким образом оформляется маркированный вариант списка:

<ul>
<li>в нашем магазине только качественные и фирменные духовки;</li>
<li>на весь товар предоставляется гарантия;</li>
<li>доставка газовых плит оперативна и бесплатна.</li>
</ul>

После публикации на сайте список будет правильно форматирован, а каждая строчка отмечена маркером.

Достаточно заменить один основной тег, и список станет нумерованным:

<ol>
<li>авторизуйтесь на сайте;</li>
<li>добавьте понравившийся товар в корзину;</li>
<li>оплатите покупку с помощью карты</li>
</ol>

Если первый список обозначался маркерами, то элементы второго будут пронумерованы цифрами по порядку.

Обозначение абзацев

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

Пример:

<p>В магазине «Кухонный мир» представлен широчайший выбор духовок, варочных поверхностей, а также различной мелкой кухонной техники.</p>
<p>Оценить разнообразный ассортимент, характеристики отдельных товаров и цены на них можно в каталоге, представленном в соответствующем разделе интернет-магазина.</p>

Обозначенные таким образом абзацы будут разделены между собой.

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

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