создание сайта

Как правильно подставлять в шаблон переменные и теги. Как управлять пробелами. Какой текст и куда можно подставлять. Как использовать различные языки программирования в шаблонах Pug.

Про миксины уже всё знаем. Здесь разбирали как определять, вызывать и прочее. Но что такое миксин? По сути это функция, а где функции там циклы, условия, итерации.

Более простой в редактировании и понятный синтаксис упрощает создание и чтение и разметки, но кроме этого Pug, избавляет нас от дублирования. В Pug можно содержимое одного файла добавлять в другой, создавать шаблоны и использовать миксины. Благодаря этому мы можем выносить в отдельные файлы часто используемые блоки (футер, меню, хедер и т. д.). Генерировать схожие по разметки но разные по содержанию блоки, без повторения всей разметки блока.

Pug, как заявлено, делает разметку более простой и читаемой. Достигается это за счёт упрощённого синтаксиса. В Pug нет закрывающих тегов, а сами теги пишутся без угловых скобок. Вложенность определяется отступами. По умолчанию текст в начале строки (или после пробела) представляет собой HTML-тег. Теги с отступом вкладываются, создавая древовидную структуру HTML.

Это НЕ полный список всех тегов и атрибутов форм. Это, скорее, небольшая шпаргалка, в которой собран необходимый минимум который требуется в 99% случаев.

Бывают ситуации когда элементы не несут никакой смысловой нагрузки и для скринридеров абсолютно не нужны. Как убрать элемент из дерева доступности? Если не брать в расчёт display:hide и атрибут hiden, которые выпиливают элементы из DOM, есть два варианта. Оба связаны с ARIA.

Началось всё с того, что валидатор разметки, не то чтобы сильно был против, но всё же настойчиво намекал, что у каждого раздела должен быть заголовок. Ему же не объяснишь что дизайн такой. Поискав возможные варианты решения пришёл к выводу — валидатор был прав. Заголовки нужны независимо от дизайна. Даже если их никто не увидит. Вернее не увидит кому не надо. Обо всём по порядку.