Возвращайте до 18% с пополнений рекламы
  • Все популярные рекламные сети в одном окне
  • Рекламные инструменты — бесплатно
  • Доступ к конструктору лендингов и WebApp-приложений
  • Закрывающие документы точно в срок
ring svg
  1. Главная >
  2. Блог >
  3. Семантический код: Что? Почему? Как?

Семантический код: Что? Почему? Как?

Семантический код: Что? Почему? Как?

Веб-дизайнеры и разработчики любят бросаться жаргонами и заумными фразами, которые нам иногда сложно понять. В этой статье речь пойдет о семантическом коде. Давайте разберемся, что же это такое!

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

Даже если вы не веб-дизайнер, вы наверное знаете, что ваш сайт был написан в HTML. HTML был первоначально предназначен как средство описывающие содержание документа, а не как средство, чтобы сделать вид визуально приятным. Семантический код возвращается к этой оригинальной концепции и призывает веб-дизайнеров писать код, который описывает содержание, а не то как оно должно выглядеть. Например, заголовок страницы может быть запрограммирован следующим образом:

<font size="6"><b>Это заголовок страницы </b></font>


Это сделало бы название крупным и жирным, придавая ему вид заголовка страницы, но в нем нет ничего, что описывает его как “заголовок” в коде. Это означает, что компьютер не может определить это как заголовок страницы.

При написание названия семантически для того, чтобы компьютер распознавал его как “заголовок”, мы должны использовать следующий код:

<h1>Это заголовок</h1>


Внешний вид заголовка может быть определен в отдельном файле, который называется “каскадные таблицы стилей” (CSS), при этом не вмешиваясь в ваш описательный (семантический) код HTML.

Чем важен семантический код?

Возможность компьютера правильно распознавать контент важно по нескольким причинам:

  • Многие слабовидящие люди полагаются на речевые браузеры для чтения страниц. Такие программы не смогут точно интерпретировать страницы, если они не были четко разъяснены. Другими словами, семантический код служит средством доступности.
  • Поисковые системы должны понимать о чем ваш контент, для того чтобы правильно ранжировать вас в поисковиках. У семантического кода есть репутация по улучшению ваших размещений в поисковых системах, так как его легко понимают “поисковые роботы”.

Также у семантического кода есть и другие преимущества:

  • Как вы видите из приведенного выше примера, семантический код короче, а загрузка быстрее.
  • Семантический код облегчает обновления на сайте, так как вы можете применять стили к заголовкам по всему сайте, а не постранично.
  • Семантический код прост для понимания, поэтому, если новый веб-дизайнер подхватывает данный код, то ему будет легко его разобрать.
  • Поскольку семантический код не содержит элементы дизайна, то тогда изменить внешний вид веб-сайта можна без перекодирования всего HTML.
  • Еще раз, потому что дизайн проводится отдельно от содержания, семантический код позволяет любому желающему добавить или редактировать страницы без необходимости хорошего глаза на дизайн. Вы просто описываете содержание, а CSS определяет как это содержание будет выглядить.

Как убедиться в том, что веб-сайт использует семантический код?

На данный момент не существует инструмента, который может проверить наличие семантического кода. Все сводится к проверке наличия в коде цветов, шрифтов или макетов, вместо описания контента. Если анализ кода звучит страшновато, то прекрасной отправной точкой будет вопрос к вашему веб-дизайнеру – кодирует ли он соблюдая семантику? Если он тупо на вас смотрит или начинает нелепую болтовню, то тогда вы можете быть уверены, что он не кодирует данным способом. В этот момент вы должны решить, предоставите ли ему новое направление в работе, или найдете себе нового дизайнера?!

blog comments powered by Disqus
Возвращайте до 18% с пополнений рекламы
  • Все популярные рекламные сети в одном окне
  • Рекламные инструменты — бесплатно
  • Доступ к конструктору лендингов и WebApp-приложений
  • Закрывающие документы точно в срок
ring svg
copyright © 2011–2024 Все права защищены
Запрещено любое копирование материалов ресурса без письменного согласия владельца — ООО "Феникс-Маркетинг". ИНН:7725812838, КПП:772501001, ОГРН: 513774619323915280, Москва, ул. Ленинская слобода, д. 19, стр. 1, этаж/пом 3/25

ООО «Феникс-Маркетинг» — IT-компания с многолетним опытом работы, разрабатывающая инновационные решения для управления процессом лидогенерации (пост-клик маркетинг). Разработанное нами технологическое программное решение LPGENERATOR позволяет создавать целевые страницы в визуальном редакторе и управлять заявками (лидами) в CRM-системе в целях проведения эффективных, высококонверсионных рекламных кампаний