Любой дурак может написать код, понятный компьютеру. Хорошие программисты пишут код, понятный людям. — Мартин Фаулер

Что такое чистый код?

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

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

ПРАКТИКИ ЧИСТОГО КОДА

1. HEADER TAG:
элемент ‹header› представляет собой контейнер для вводного контента или набора навигационных ссылок, они используются для идентификации контента, который предшествует основному контенту веб-страницы и часто содержит брендинг веб-сайта, логотип, элементы навигации и т. д. Правильное использование этого тега позволяет любому, кто сталкивается с кодом, с меньшими трудностями интерпретировать намерения как кодировщика, так и веб-сайта.

2. ТЕГ РАЗДЕЛА:
Тег раздела можно использовать для разделения предполагаемого содержимого веб-страницы на разделы и подразделы. Тег раздела используется, когда требуются два верхних или нижних колонтитула или любой другой раздел документов. Тег раздела группирует общий блок связанного содержимого. Основное преимущество тега section: это семантический элемент, который описывает свое значение как для браузера, так и для разработчика.
Например, вы не будете использовать элемент section для группировки навигационных ссылок  — вместо этого вы будете использовать элемент nav. Но вы бы использовали элемент section, чтобы разделить одностраничный веб-сайт или длинное соглашение об условиях.

3. ТЕГ NAV:
Элемент ‹nav› представляет раздел страницы, целью которого является предоставление навигационных ссылок либо в текущем документе, либо в других документах. Типичными примерами навигационных разделов являются меню (главное, о, контакты...), оглавления и индексы.
Тег ‹nav› определяет набор навигационных ссылок. Обратите внимание, что НЕ все ссылки документа должны находиться внутри элемента ‹nav›.

4. ТЕГ FOOTER:
Тег ‹footer› определяет раздел нижнего колонтитула для страницы или другого элемента.
Обычно он представляет сводную информацию или итоговое содержание веб-страницы.
HTML ‹footer › Тег используется для определения нижнего колонтитула документа или раздела. Обычно он используется в конце раздела (внизу страницы). Элемент ‹footer› может содержать любое из следующего: информацию об авторе, информацию об авторских правах, навигационные ссылки, связанные документы, контактную информацию и многое другое.

5. КОММЕНТАРИИ:

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

Пример комментария в HTML: ‹! -- Это комментарий. Комментарии не отображаются в браузере--›.

6. НАЗВАНИЕ:
использование четких имен переменных, функций и классов также имеет значение для чистоты кода. Код становится намного легче читать, если вы записываете полные описательные имена переменных и функций.

Также попытайтесь установить соответствующее соответствие с именем, которое вы даете, и с тем, что вы также приписываете, чтобы помочь запоминанию.

ЗАКЛЮЧЕНИЕ
правильное использование этих тегов сделает ваш код чистым, доступным и удобным для навигации.
Да, написание чистого кода может быть непростым, потому что это требует определенного уровня осторожности, Чистое кодирование — это не навык, который можно приобрести за одну ночь. Это привычка, которую необходимо развивать, помня об этих принципах и применяя их всякий раз, когда вы пишете код.

Спасибо, что нашли время, чтобы прочитать, и я надеюсь, что это было полезно.