< P > Здесь разбивка при использовании всего, что может предложить HTML и почему он является основополагающим для SEO, видимости ИИ и веб -структуры.
< IMG WIDTH = "1600" HEIGHT = "840" SRC = "https://www.searchenginejournal.com/wp-content/uploads/2025/semantic-html-915.png" class = "Привязанность wp-prost-image" alt = "semantic htmlese for seo andifire" alt = "alt =" "Decoding =" async "srcset =" https://www.searchenginejournal.com/wp-content/uploads/2025/semanty-html-915.png 1600W, https://www.searchenginejournal.com/wp-content/uploads/2025/08/semantic-html-915-480x252.png 480w, https://www.searchenginejournal.com/wp-content/uploads/2025/08/semantic-html-915-680x357.png 680w, https://www.searchenginejournal.com/wp-content/uploads/2025/08/semantic-html-915-384x202.png 384w, https://www.searchenginejournal.com/wp-content/uploads/2025/08/semantic-html-915-768x403.png 768w, https://www.searchenginejournal.com/wp-content/2025/08/semantic-html-915-1024x538.png 1024w "Sits =" (Max-Width: 1600px) 100VW, 1600px "/> < p >Я & rsquo; Некоторое время у меня был этот пост в проектах, в основном в качестве контейнера, чтобы я мог бросить кусочки, когда у меня есть время, чтобы расширить его в надлежащую рассылку.
< P > Затем мой хороший друг Джоно Олдерсон опубликовал свою превосходную статью о семантическом HTML, и в течение нескольких недель я потерял волю, чтобы завершить мою.
< p > Но я должен закончить ухо свою версию в любом случае, так как мой фокус немного отличается и, возможно, немного более практично, чем Jono & с
Вы все равно должны быть определенно прочитать Jono & rsquo; S блог; Это говорит все, что я хочу сказать, и многое другое.
< H2 > SEMANTIC HTML < P > Let & S Начните с быстрого обзора того, что такое семантический HTML.
< P > Как язык, на котором создается сеть, HTML – это разметка, которая окружает текст, обеспечивая его структурой.
< p > the & LT; p & GT; День вокруг блока контента указывает, что это абзац текста.
< p > the & LT; H1 & GT; Теги вокруг предложения показывает, что это страница & rsquo; S Главный заголовок.
< p > the & LT; OL & GT; Тег указывает начало упорядоченного (обычно пронумерованного) списка.
< p > the & LT; img & GT; тег указывает на вас & rsquo; Будьте загружать изображение на веб -страницу. И так далее
< P > Semantic HTML использовался для кодирования каждой веб -страницы.
< P > Содержание было окружено конкретными тегами, которые указывали на то, для чего предназначался каждый бит контента, а затем CSS был применен, чтобы он выглядел хорошо. Это было & rsquo; T
< p >Значит, что вы можете посмотреть на необработанный HTML -источник веб -страницы и посмотреть, что пытается доставить страницу, и как. HTML указал структуру и значение каждого бита контента на странице. Вы можете увидеть & NBSP; Цель & страницы, просто посмотрев на его код.
< P > Редакторы Wysiwyg и более поздние фреймворки JavaScript прибыли на место происшествия, и HTML снялись на заднем сиденье. Вместо & LT; p & GT; и & LT; Таблица & gt;, у нас бесконечные гнездости & LT; Div & GT; и & LT; Span & GT; Теги.
< p > Конечные результаты – веб -страница HTML, которая структура лака и не имеет смысла, универса, она завершена в браузере и визуально рисует на экране. Только тогда хочет, чтобы пользователь (и машина, пытающаяся эмулировать пользователя), понимал, что страница & rsquo; с целью.
< p >Это & S, почему Google переживает усилия по ликвидации страниц как часть процесса индексации (даже если он действительно & < p > Мы знаем, что Google Do Don & Обычно у меня есть время, чтобы представить новостную статью, прежде чем она должна оценить ее в лучших историях и в других местах. Таким образом, необработанный HTML очень важен для издателей новостей.
< P > Хороший HTML позволяет Google усилительно извлекать контент вашей статьи и оценивать вашу историю, где она заслуживает в Google & rsquo; S Экосистема.
< p > Семантический HTML является ключевым фактором здесь. Это причина, почему такие SEO, как я, настаивают на том, что статья & rsquo; Заголовок S завернут в & LT; H1 & GT; Заголовок тега, и что это единственный экземпляр & LT; H1 & GT; На странице статьи.
< P > Заголовок H1 указывает на веб -страницу и AMPT; rsquo; S Основной заголовок. Он указывает, где начинается статья, так что Google может найти содержимое статьи простым.
< H2 >, которые HTML -метки являются семантическими ? < p >За пределами & LT; H1 & GT; Заголовок тег, есть много других семантических элементов HTML, которые вы можете реализовать, которые позволяют Google более простой извлечь и индексировать содержание вашей статьи.
< p > В любом конкретном порядке элементы, которые вы должны использовать:
< ul > < li > ~ Strong > параграфы : don & rsquo; t Использование & LT; Div & GT; и & LT; Span & GT; Теги, чтобы отформатировать статью в абзацы. Там & rsquo; был день для этого до тех пор, пока существует HTML, и это & rsquo; s & LT; p & GT; день. Используйте его.
< li >< Стронг >Подголовки >: Использование & LT; H2 & gt;/& LT; H3 & gt;/& LT; H4 & GT; Подзаголовок тегов, чтобы дать структуру вашей страницы. Используйте подзаголовки в статье, чтобы предисловать конкретные разделы контента в вашей статье. Используйте подзаголовки для заголовка выше бетонных структурных элементов, поиск в качестве рекомендуемых статей.
< li > ~ Strong > Изображения : всегда используйте & LT; img & GT; День, если вы хотите показать изображение, которое вы & rsquo; D нравится Google, чтобы увидеть. Google & NBSP; Explicitly Recommends this.
< li > ~ 60 > Клигабельный слева : при ссылке на другую страницу, внутренняя или внешняя, используйте & A & GT; день с & ldquo; href & rdquo; Значение, содержащее целевой URL. Это & rsquo; S Единственный ребенок ссылки, которым Google определенно будет следовать.
< li > < Стронг > Относительно левые сильные>: & Amp; LT; Link & GT; Тэг позволяет создавать отношения между текущим URL и другим URL. Это может быть каноническая страница, таблица стилей, альтернативная языковая версия текущей страницы и т. Д.
< li > 60 > Списки : списки пулей должны использовать & LT; Ul & GT; Тег и пронумерованные списки должны использовать & LT; OL & GT; день. Вы можете заставить их выглядеть так, как хотите с CSS, но используйте теги списка в качестве основы.
< li > 60 > Акцент и & LT; Сильный & GT; для & NBSP; ~ 60 > BOLD .
< p > Все вышеперечисленные теги, за исключением & LT; Link &, предназначена для содержания веб -страницы, предоставляя структуру и значение для текста.
< p >Существуют дополнительные семантические теги HTML, которые предназначены для обеспечения структуры и значения для & NBSP; Код страницы.
< P > Тезис позволяйте Google идентифицировать различные на странице, поиск как навигация против боковой панели и соответственно обрабатывать тему.
< Decoding = "async" src = "https://www.searchenginejournal.com/wp-content/uploads/2025/semantic-html-image-685.webp" alt = "semantic html" width = "ehess =" 258 "class =" wp-image-553204-size-size-with with high elect ehuse = "258" = "wp-image-553204-size-wired-with hith with with with with with with with with with html html html «Ленивый» ~ Семантическое HTML -изображение от w3schools.com (изображение кредитование: Барри Адамс) < ul > < li > the & NBSP; < Стронг > & LT; Голова & & NB SP; и & NBSP; < Стронг > & LT; тело & & NBSP; Теги существуют, чтобы разделить страницу & rsquo; S Metadata (в & lt; head &) из фактического содержания (в & lt; body & gt;). Каждая HTML -страница начинается с этих двух.
~ 60 >< Стронг > & LT; заголовок & & NBSP; Можно использовать для обертывания головного раздела страницы, где расположены логотип, навигация и другие стилистические элементы.
~ 60 >< Стронг > & NAV & ~ 60 > & Shult будет использоваться для вашего сайта & rsquo; S Главная навигация. Мега -меню, меню гамбургера, верхняя навигация, в любом случае, в какой бы форме придерживается ваша навигация, вы должны обернуть его в & LT; NAV & GT; День.
< li > Вы можете использовать & ~ 60 > & LT; раздел; Теги, чтобы разделить вашу страницу на несколько разделов. Одним из разделов может быть статья; Другим может быть комментарии ниже статьи.
< li > 60 ~ Strong > & LT; Статья & ~ 60 > & это тег, который показывает, где страница & Фактический текст основной статьи (включая заголовок). Это очень ценный тег для издателей новостей.
< li > с & NBSP; < Стронг > & LT; в стороне & gt;, & NBSP; Вы можете указать блоки контента, такие как боковая панель трендов, рекомендуемые статьи или последние новости.
~ 60 >< Стронг > & LT; Нижний колонтитул & ~ 60 > & NBSP; как вы уже догадались, используется для обоснования веб -страницы.
< P > Структурные семантические теги помогают поисковым системам понять цель и значение ACH Раздела HTML.
< P > Это позволяет Google быстро индексировать ваш контент и соответствующим образом обрабатывать различные элементы ваших страниц.
< p >В вашем распоряжении гораздо больше семантических HTML -тегов для различных целей. Chanances есть, есть & rsquo; S -HTML -элемент & NBSP; Для каждого мыслимого варианта использования.
< p >, а не втиснуть свой код, полный & LT; Div & GT; Теги, чтобы что -то сделать, сначала посмотрите, есть ли там & rsquo; S правильный HTML -элемент, который делает уловку.
< H2 > Как помогает Ai ? < P > Мы знаем, что LLM, такие как CHATGPT и сбивает с толку открытую сеть для данных обучения, а также для конкретных пользовательских запросов, которые требуют контента из Интернета.
< P > ЧТОГО, ЧТО ВЫ МОЖЕТЕ НЕ ЗНАТЬ, это то, что LLMS не визует JavaScript, когда они обрабатывают веб -страницы.
< P > Google является исключением из правила, так как оно предложило большие ресурсы для визуализации веб -страниц в рамках индексации.
< p >Потому что Google & rsquo; S Gemini – единственный LLM, построенный на Google & rsquo; S INDEX, Gemini – единственный LLM, который использует контент из полностью отображаемых веб -страниц. ~ 60 > < p > Итак, если вы хотите иметь шанс появиться в качестве цитируемого источника в Chatgpt или смущенности, вы & D Делайте, чтобы убедиться, что ваш полный контент страницы доступен в вашем необработанном, не обреченном HTML. > < P > Использование семантического HTML для структуры вашего кода и обеспечения значения, поэтому помогает LLMS, легко идентифицируя ваше основное содержание.
< p > it & гораздо проще для Chatgpt, чтобы проанализировать несколько десятков семантических HTML -тегов, а не несколько сотен (или даже & nbsp; тысячи) вложенных & LT; div & GT; Теги, чтобы найти веб -страницу & rsquo; S Главный контент.
< p > Если и когда & ldquo; Агент веб -сайта & rdquo; Оживает (I & rsquo; m Skeptical), семантический HTML, вероятно, является важным аспектом успеха.
< p >С бессмысленным & LT; Div & GT; и & LT; Span & GT; Теги, это & rsquo; Степени агенту ИИ не понимают, какие действия он должен выполнять.
< p > Когда вы используете семантический HTML для таких вещей, как кнопки, ссылки и формы, шансы на агент AI, выполняющий его задачу, намного ниже.
< p > Значение в правильных тегах HTML хочет сказать агенту ИИ, куда идти и что делать.
< H2 > Что насчет структурированных данных ?
< p > Вы можете подумать, что & < p > В конце концов, со структурированными данными вы можете предоставить машинные системы с необходимой информацией о странице и amp; S содержание и цель в простом автоматическом формате.
< p > Это верно до такой степени. Тем не менее, структурированные данные никогда не были предназначены для замены семантического HTML. Это служит совершенно иной цели.
< P > Структурированные данные имеют ограничение, что Semantic HTML делает & rsquo; Т.
< P > Структурированные данные WON & t Скажите машине, какая кнопка добавляет продукт в корзину, что подзаголовок предшествует критическому абзацу текста, и что читатель должен нажать для получения дополнительной информации. ~/P > < P > Во всех отношениях используйте структурированные данные для обогащения ваших страниц и помощи машинах понимать ваш контент. Но вы плечетесь, поэтому используете Semantic HTML по тем же причинам.
< P > Используемые вместе, семантические HTML и структурированные данные на невозмутимой комбинации.
< H2 > СОЗДАТЬ СВЕТИ, НЕ ВЕБ -приложения < P > Я мог бы отправиться на разглагольствование 2,500 слов о том, почему мы должны создавать веб-сайты вместо веб-приложений и как приоритет в Интернете является антемтемами к принципам, на которых всемирная паутина была найдена полемика.
< P > Достаточно сказать, что веб-приложения для веб-сайтов по доставке контента (например, новостных сайтов) почти всегда уступают простым старомодным сайтам.
< P > и веб -сайты созданы или должны быть на HTML. Используйте все, что может предложить HTML, и вы & rsquo; Повторно избегая 90% технической ловушки SEO, которую веб -приложения имеют тенденцию к теме лица.
< p > that & rsquo; это для другого издания. Спасибо за чтение и подписку, и я & rsquo; Увидимся на следующем!
~ 60 >~ 60 > Этот пост был первоначально опубликован в SEO для Google News.