Найти в Дзене
deweb

Принципы верстки

Оглавление

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

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

Принципы верстки | deweb
Принципы верстки | deweb

Валидность верстки

Валидность кода - это отсутствие ошибок в его структуре и синтаксисе. Все элементы кода должны быть правильно размещены, все теги должны быть закрыты, а синтаксические правила (такие как использование кавычек и пробелов) должны быть соблюдены. Большинство редакторов кода подсвечивают такие ошибки, что облегчает их обнаружение и исправление. Для проверки валидности кода используются специальные программы-валидаторы, например, W3C Validator. В настоящее время браузеры могут исправлять некоторые незначительные ошибки верстки автоматически или игнорировать их, однако валидность кода остается важным требованием для продвижения сайта в поисковых системах. Ошибки в коде рассматриваются поисковыми роботами как признак низкого качества сайта, что может отрицательно сказаться на его позициях в результатах поиска.

Красивый код

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

Интуитивно понятные имена классов и идентификаторов

При выборе имен для классов и переменных, верстальщик старается придумать такие, которые будут легко читаемыми и понятными. Например, вместо "d2" используется "radius", а вместо "swipe1" - "slider". Для того чтобы другой программист мог легко разобраться в коде, полезно использовать методологию верстки, такую как БЭМ. Однако, самое главное - чтобы все разработчики в рамках проекта согласовали, как мы обозначаем различные элементы. Это является более важным, чем следование рекомендациям случайных людей.

Семантическая разметка

Используя SEO-теги, верстальщик может помочь поисковому роботу анализировать контент страницы. Поисковый робот не сканирует всю страницу сразу, он сначала обращается к специальным контрольным точкам - метатегам. Затем, исходя из содержимого метатегов, робот делает выводы о структуре страницы, вложенности заголовков, связанности различных частей контента, понимает тематику страницы и определяет релевантные запросы. Для этого верстальщик использует теги H1-H6 для обозначения заголовков, задает внешний заголовок страницы (Title) и ее описание (Description) в соответствии с релевантностью, определенной SEO-специалистом.

Уважаемые читатели!

Наш проект существует и развивается и в других социальных сетях!

В нашем телеграме вы узнаете больше о веб разработке!

t.me/dewebme