Профессиональный гид: шаблон сайта, верстка сайта и тема сайта

В контексте использования Cotonti Siena v0.9.26

1. Введение: проблема терминологии

В профессиональной среде веб-разработки термины «шаблон», «верстка» и «тема» регулярно используются как взаимозаменяемые. В контексте CMF/CMS это методологически неверно.

В рамках Cotonti (ветка Siena, версия 0.9.26) эти понятия:

• имеют разный уровень абстракции,
• относятся к разным слоям архитектуры,
• участвуют в разных этапах разработки,
• хранятся в разных типах файлов,
• и изменяются разными специалистами.

Ниже — строгое, технически корректное руководство без предположений и без обобщений.

2. Архитектурный контекст Cotonti Siena

Cotonti Siena — это CMF/CMS с:

• ядром на PHP,
• системой модулей,
• плагинной архитектурой,
• собственной системой шаблонов (CoTemplate),
• файловой системой тем.

В архитектуре системы присутствует четкое разделение:

3. Что такое верстка сайта

3.1 Определение

Верстка сайта — это процесс преобразования дизайн-макета (Figma, PSD, Sketch и т.п.) в HTML-разметку с использованием CSS и при необходимости JavaScript.

Верстка — это frontend-реализация интерфейса.

Она существует независимо от CMS.

3.2 Что входит в верстку

Фактически:

• HTML-структура
• CSS-стили
• Адаптивность (media queries)
• Семантическая структура
• Flexbox / Grid
• DOM-структура
• JS-поведение интерфейса

Верстка не знает ничего о:

• базе данных,
• PHP,
• логике CMS,
• шаблонных тегах Cotonti.

3.3 Пример

Чистый HTML-файл:

<div class="news-item">
  <h2>Заголовок</h2>
  <p>Описание новости</p>
</div>

Это верстка.

Она статична.

3.4 Важный факт

Верстка — это не шаблон и не тема.
Это слой интерфейса до интеграции с CMS.

4. Что такое шаблон сайта в Cotonti Siena

4.1 Формальное определение

В Cotonti шаблон — это файл с расширением .tpl, содержащий:

• HTML,
• теги CoTemplate,
• блоки BEGIN/END,
• переменные, передаваемые ядром или модулем.

Шаблон — это механизм динамического вывода данных.

4.2 Структура шаблона

Пример шаблона страницы:

<h1>{PAGE_TITLE}</h1>

<!-- BEGIN: PAGE_ROW -->
<div class="news-item">
  <h2>{PAGE_ROW_TITLE}</h2>
  <p>{PAGE_ROW_TEXT}</p>
</div>
<!-- END: PAGE_ROW -->

Здесь:

• {PAGE_TITLE} — тег,
• {PAGE_ROW_TITLE} — переменная,
• блок PAGE_ROW — цикл.

4.3 Ключевой факт

Шаблон:

• не получает данные напрямую,
• не делает SQL-запросы,
• не содержит бизнес-логики,
• только отображает переданные данные.

4.4 Роль CoTemplate

В Cotonti Siena используется встроенный шаблонизатор CoTemplate.

Он:

• парсит .tpl,
• заменяет теги значениями,
• обрабатывает блоки,
• собирает финальный HTML.

4.5 Где находятся шаблоны

Внутри папки темы:

/themes/название_темы/

Каждый .tpl — отдельный шаблон.

5. Что такое тема сайта в Cotonti

5.1 Определение

Тема — это комплекс файлов, обеспечивающий внешний вид сайта.

Тема включает:

• набор .tpl файлов,
• CSS,
• JS,
• изображения,
• файл конфигурации темы.

5.2 Структура темы

Пример:

themes/mytheme/
  header.tpl
  footer.tpl
  index.tpl
  page.tpl
  users.tpl
  style.css
  scripts.js
  img/

5.3 Важный факт

Тема = набор шаблонов + ресурсы.

Шаблон ≠ тема.

6. Архитектурное различие

7. Последовательность интеграции

Шаг 1 — Верстка

Создается HTML-макет.

Шаг 2 — Адаптация под Cotonti

HTML преобразуется в .tpl:

• статический текст → теги,
• списки → блоки,
• формы → переменные CMS.

Шаг 3 — Формирование темы

Все шаблоны собираются в папке темы.

8. Как правильно говорить

Неправильно:

• «Сделал шаблон сайта» — если речь о верстке.
• «Поставил шаблон» — если установлена тема.
• «Изменил тему» — если изменен один .tpl.

Правильно:

9. Аналогия: архитектура здания

10. Взаимодействие с модулями

Модуль (например, Pages) передает данные.

Шаблон их отображает.

Тема содержит шаблон модуля.

11. Где возникают ошибки

Ошибка 1

Верстальщик называет HTML «шаблоном».

Это неверно, потому что:

HTML без тегов Cotonti не взаимодействует с системой.

Ошибка 2

Заказчик говорит «купить шаблон».

Фактически приобретается тема.

12. Почему терминология критична

В разработке это влияет на:

• оценку задач,
• разделение ответственности,
• структуру Git-репозитория,
• документацию,
• CI/CD.

13. Глубокий вывод

В контексте Cotonti Siena:

• Верстка — это frontend-реализация.
• Шаблон — это механизм динамического вывода.
• Тема — это UI-слой сайта.

Это три разных уровня абстракции.

14. Итоговая формула

Верстка → превращается в → Шаблоны (.tpl)
Шаблоны → объединяются в → Тему
Тема → подключается к → CMS
CMS → формирует → динамический сайт

15. Заключение

В рамках Cotonti Siena v0.9.26 корректная терминология обязательна:

• «Верстка» — процесс frontend-реализации.
• «Шаблон» — файл представления .tpl.
• «Тема» — комплект шаблонов и ресурсов.

Это не стилистическая разница.
Это архитектурное различие.