Оформление материала - руководство

Страница 1 из 1
1

Очарователь

Владелец сайта

Сообщений: 144

Offline

Kliff 27.04.2026, 23:15 | #1

📚 РУКОВОДСТВО ПО ОФОРМЛЕНИЮ МАТЕРИАЛОВ

Для сайта: Лагерь Серогривых (CRD)
Версия: 1.0 | Апрель 2026

📋 СОДЕРЖАНИЕ
1. Общие принципы
2. Формат выдачи статьи
3. Шаблон HTML-структуры
4. Правила вставки изображений
5. Цветовая схема
6. Запрещённые приёмы
7. CSS-стили (обязательный блок)
8. Пример готовой статьи

1. ОБЩИЕ ПРИНЦИПЫ

✅ Весь текст переписывается на 100% — никакого копипаста из источника.
✅ Стиль — сообщество «Лагерь Серогривых»: дружелюбный, экспертный, с лёгким юмором.
✅ Термины — только игровые: наёмники это наёмники, а не «подручные» или «воины».
❌ Пафосные архаизмы («воины», «свитки», «клинки») под запретом.
❌ Смайлы-эмодзи в цитатах и кавычки «» в блоке about-oath — под запретом.

2. ФОРМАТ ВЫДАЧИ СТАТЬИ

Каждая статья выдаётся в виде четырёх блоков строго в этом порядке:

[list=1]

Название статьи — яркое, с эмодзи, в духе CRD

Короткое описание (Meta Description) — 2-4 предложения, завлекающие

Тэги — 10-15 штук, через запятую, релевантные теме

Полный HTML-код статьи — готовый к вставке на сайт, плюс CSS-блок

3. ШАБЛОН HTML-СТРУКТУРЫ

Базовая структура статьи выглядит так:

Цитата

<div class="about-page-new">
<div class="about-content-wrapper">


<div class="about-section">
<p class="about-paragraph"><span class="about-dropcap">П</span>ервая буква с выноской...</p>
</div>


<div class="about-section">
<h2 class="about-section-title"><span class="title-icon">🎒</span> <span>ЗАГОЛОВОК</span></h2>
<p class="about-paragraph">Текст секции...</p>
</div>


<div class="about-row about-two-col">
<div class="about-col" style="flex: 0 0 400px; max-width: 400px;">$IMAGE1$
<div class="image-caption" style="margin-top: 6px;">Подпись к фото</div>
</div>
<div class="about-col"><p class="about-paragraph" style="margin-top: 0;">Текст справа от фото...</p></div>
</div>


<ul class="about-simple-list">
<li><span class="list-icon">💥</span> <strong>Заголовок пункта</strong> — описание.</li>
</ul>


<blockquote class="about-quote"><p>Текст цитаты.</p></blockquote>


<div class="about-oath">
<p>Итоговый текст без кавычек «».</p>
<p><strong class="about-accent">Призыв к комментариям.</strong></p>
</div>


<div class="about-divider">✧ ✧ ✧</div>


<div class="about-closing-section">
<p class="about-closing-title"><strong>Вопрос к читателям?</strong></p>
<p class="about-closing-text">Текст...</p>
<p class="about-closing-reminder">Напоминание...</p>
</div>


<div class="about-signature"><span>По материалам [Источник],</span> <span class="signature-name">Летописцы Лагеря CRD</span></div>


<div class="about-source-note"><p><em>Источник: <a href="ССЫЛКА" target="_blank">Название</a></em></p></div>

</div>
</div>

4. ПРАВИЛА ВСТАВКИ ИЗОБРАЖЕНИЙ

Главное правило: всегда вставляем только через системные теги uCoz — `$IMAGE1$`, `$IMAGE2$` и так далее. Никаких `<img src="">`.

Одна картинка:

Цитата

<div class="about-row about-two-col">
<div class="about-col" style="flex: 0 0 400px; max-width: 400px;">$IMAGE1$
<div class="image-caption" style="margin-top: 6px;">Подпись к фото</div>
</div>
<div class="about-col"><p class="about-paragraph" style="margin-top: 0;">Текст...</p></div>
</div>

Две и более картинок: каждая в своей колонке, в разных секциях. Не создаём галереи и не дублируем.

❌ Запрещено:

Класс `crd-photo-row` (галерея из 2-3 фото)
Обёртки `<img src="">` — только чистые `$IMAGEN$`
Дублировать одну картинку в нескольких местах
Растягивать одиночные фото на всю ширину

Порядок картинок: строго как в источнике. Если в материале 5 фото — в статье ровно 5 `$IMAGE1$`…`$IMAGE5$`.

5. ЦВЕТОВАЯ СХЕМА

Акцентный: `#ff6b00`
Тёмный фон: `#13151a`
Панель: `#1a1c23`
Текст: `#c5c5c5`
Приглушённый: `#9a9a9a`

6. ЗАПРЕЩЁННЫЕ ПРИЁМЫ

❌ Смайлы-эмодзи в цитатах (about-quote)
❌ Кавычки «» в блоке about-oath
❌ Копипаст текста из источника
❌ Растягивать одиночные фото на всю ширину
❌ Пафосные архаизмы («воины», «свитки», «клинки»)
❌ Менять игровые термины (наёмники — это наёмники)
❌ Класс `crd-photo-row` (удалён из арсенала)

7. CSS-СТИЛИ (ОБЯЗАТЕЛЬНЫЙ БЛОК)

В конце каждой статьи обязательно вставлять этот блок:

Цитата

8. ПРИМЕР ГОТОВОЙ СТАТЬИ

Вот эталонная статья, выполненная по всем правилам:

[spoiler="Пример: Шлем Воспламенения"]
<div class="about-page-new">
<div class="about-content-wrapper">

<div class="about-section">
<p class="about-paragraph"><span class="about-dropcap">Ш</span>лем Воспламенения — одна из тех находок, ради которых стоит отклониться от сюжета в первые же часы игры. Никаких квестов, никаких боссов, никаких проверок на силу. Просто зайдите в нужную палатку и заберите стимпанк-шлем с защитными очками. А он в ответ подарит вам иммунитет к оглушению и способность поджигать всё вокруг одним нажатием кнопки. Разбираемся, где искать и как пользоваться.</p>
</div>

<div class="about-section">
<h2 class="about-section-title"><span class="title-icon">📋</span> <span>ЧТО НУЖНО ЗНАТЬ</span></h2>

<ul class="about-simple-list">
<li><span class="list-icon">📍</span> <strong>Расположение</strong> — лагерь «Маяк с факелами» (Torchlight Beacon) в регионе Хернанд, к северо-западу от города</li>
<li><span class="list-icon">🎒</span> <strong>Как получить</strong> — зайти в большой белый шатёр и подобрать со стола/ящика слева от входа</li>
<li><span class="list-icon">🛡️</span> <strong>Защита</strong> — базовая броня около 2 единиц, главное — особые свойства</li>
<li><span class="list-icon">🔥</span> <strong>Способность</strong> — «Воспламенение» (Ignite): зажигает костры и объекты в радиусе ~20 метров, откат около 30 секунд</li>
<li><span class="list-icon">💪</span> <strong>Пассивный бонус</strong> — полный иммунитет к оглушению (Daze Immunity)</li>
<li><span class="list-icon">🎨</span> <strong>Стиль</strong> — бронзовый стимпанк-шлем с очками-гоглами</li>
</ul>

<blockquote class="about-quote"><p>Шлем можно забрать в любой момент после выхода в открытый мир. Никаких квестов и допусков — он просто ждёт вас в палатке.</p></blockquote>
</div>

<div class="about-section">
<h2 class="about-section-title"><span class="title-icon">🧭</span> <span>ШАГ 1: КАК ДОБРАТЬСЯ ДО МАЯКА</span></h2>

<p class="about-paragraph">Стартуйте из Хернанда — вашего первого крупного города. Выходите через северо-западные ворота и держитесь главной дороги, ведущей в гору. Она извилистая, но заблудиться сложно — маяк видно с большого расстояния. Спешившись у подножия, осмотритесь: небольшой лагерь с белыми палатками расположен слева от башни, в стороне от основной тропы.</p>

<div class="about-row about-two-col">
<div class="about-col" style="flex: 0 0 400px; max-width: 400px;">$IMAGE1$
<div class="image-caption" style="margin-top: 6px;">Следуйте по извилистой дороге на северо-запад от Хернанда к холму с маяком.</div>
</div>
<div class="about-col"><p class="about-paragraph" style="margin-top: 0;">Маяк видно издалека — ориентируйтесь на высокую башню на скале. Как только дорога выведет вас к подножию — спешивайтесь. Лагерь будет слева от основания.</p></div>
</div>

<div class="about-oath">
<p>Шлем Воспламенения — одна из лучших находок для тех, кто предпочитает исследовать мир, а не бежать по сюжету. Никаких квестов, никаких условий — просто зайдите и заберите.</p>
<p><strong class="about-accent">Уже нашли этот шлем? Делитесь в комментариях — обсудим билды всем Лагерем.</strong></p>
</div>

<div class="about-divider">✧ ✧ ✧</div>

<div class="about-signature"><span>По материалам Nerd's Chalk,</span> <span class="signature-name">Летописцы Лагеря CRD</span></div>

<div class="about-source-note"><p><em>Источник: <a href="https://nerdschalk.com/crimson-desert-how-to-find-helm-of-ignition-torchlight-beacon-location-stats-and-activation-guide/" target="_blank">Nerd's Chalk — How to Find Helm of Ignition</a></em></p></div>

</div>
</div>
<style type="text/css">
.about-simple-list { list-style: none; padding: 0; margin: 15px 0; }
.about-simple-list li { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 10px; font-size: 15px; line-height: 1.4; }
.about-simple-list .list-icon { min-width: 24px; font-size: 16px; text-align: center; color: #ff6b00; font-weight: bold; }
.about-row { display: flex; gap: 25px; margin-bottom: 10px; }
.about-col { flex: 1; }
@media (max-width: 768px) { .about-row { flex-direction: column; } .about-col[style*="flex: 0 0 400px"] { flex: 1 !important; max-width: 100% !important; } }
</style>[/spoiler]

✅ ЧЕКЛИСТ ПЕРЕД ПУБЛИКАЦИЕЙ

[list=1]

Все картинки — через `$IMAGEN$`, без `<img>` обёрток

Картинок ровно столько, сколько в источнике

Каждая картинка в своей колонке 400px + текст

Нет класса `crd-photo-row`

Нет смайлов в цитатах

Нет кавычек «» в блоке about-oath

CSS-блок в конце статьи

Подпись «Летописцы Лагеря CRD»

Ссылка на источник

Руководство составлено 27 апреля 2026 года. Все вопросы и предложения — в комментариях.

Оформление материала - руководство

Страница 1 из 1
1