Что касается поисковой оптимизации, можно ли иметь несколько заголовков на уровне 1?

  1. Мы говорим: да, это так!
  2. Альтернативные решения
  3. Подход № 1: h1 вверху страницы
  4. Подход № 2: h1 поверх основного контента

Сайты, оптимизированные для доступности, также приводят к улучшению рейтинга в поисковых системах. Вопрос о нескольких заголовках на уровне 1 часто касается экспертов по поисковой оптимизации (SEO). Хотя у нас есть четкое мнение об этом (основываясь на многолетнем опыте и интенсивных дебатах с различными экспертами), мы также предлагаем альтернативные решения.

Эксперты по SEO часто заявляют, что веб-страница должна иметь только один заголовок на уровне 1 (<h1>). Согласно им, подобно тегу <title> в <head> страницы, этот единственный заголовок первого уровня должен описывать основное содержание страницы. Потому что, если бы их было больше (утверждают эксперты SEO), поисковые системы не могли бы решить, какой из них является наиболее важным.

И конечно, это могло быть правдой некоторое время в прошлом.

Мы говорим: да, это так!

Но поскольку в HTML 5 представлены структурные элементы (такие как <header>, <nav>, <main> и т. Д.), Эти элементы могут обеспечить различный контекст для областей страницы. Увы, с семантической точки зрения, поисковые системы сегодня на 100% способны различать «главные заголовки» (которые находятся в элементе <main>) от других заголовков, независимо от их уровня.

Поэтому, по нашему мнению, наличие более одного заголовка на уровне 1 абсолютно разумно:

  • По крайней мере, один для основного контента (который находится в элементе <main>).
  • И дополнительные для маркировки других областей страницы, таких как заголовок, навигация, нижний колонтитул и т. Д.

Альтернативные решения

Если вы определенно не хотите иметь более одного заголовка на уровне 1, мы можем предложить вам несколько альтернативных решений, которые все еще довольно доступны.

Подход № 1: h1 вверху страницы

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

Страница только с одним h1 сверху страницы Страница только с одним h1 сверху страницы

<h1 class = "визуально-скрытый"> Мои хобби </ h1> <header> <h2 class = "визуально-скрытый"> заголовок </ h2> <p> веб-присутствие Джона Доу </ p> </ header> < nav> <h2 class = "визуально-скрытый"> Навигация </ h2> <ul> <li> <a href = "#"> Главная страница </ a> </ li> <li> <a href = "#" > Хобби </ a> </ li> <li> <a href = "#"> О </ a> </ li> <li> <a href = "#"> И т.д. </ a> </ li > </ ul> </ nav> <main> <h2> Мои увлечения </ h2> <p> Это все виды деятельности, которые я люблю делать регулярно. </ p> <h3> Физическая активность </ h3> <h4> Игра в футбол </ h4> <p> Футбол - командный вид спорта, в который играют две команды из одиннадцати игроков со сферическим мячом. </ p> <h4> Танцы </ h4> <p> Танец - это форма исполнительского искусства, состоящая из специально отобранных последовательностей человеческого движения. </ p> <h3> Расслабляющие занятия </ h3> <h4> Просмотр фильмов </ h4> <p> Фильм, также называемый фильмом, кинофильмом, театральным фильмом или фотоплеером, представляет собой серию неподвижных изображений, которые, при отображении на экране создает иллюзию движущихся изображений из-за явления фи. </ p> </ main> <footer> <h2 class = "visual-hidden"> нижний колонтитул </ h2> <p> Авторские права 2057 John Doe </ p> </ footer> .visually-hidden {position: absolute; слева: - 10000 пикселей; ширина: 1px; высота: 1 пикс; переполнение: скрытое; } body {margin: 0; } header {background-color: lightpink; переполнение: скрытое; нижняя граница: 1px сплошной черный; отступ слева: 20 пикселей; отступ справа: 20 пикселей; } nav {background-color: lightgreen; плыть налево; ширина: 200 пикселей; граница: 1px сплошной черный; } main {margin-left: 200px; переполнение: скрытое; рамка слева: 1px сплошной черный; отступ слева: 20 пикселей; отступ справа: 20 пикселей; } нижний колонтитул {background-color: lightsteelblue; переполнение: скрытое; отступ слева: 20 пикселей; отступ справа: 20 пикселей; граница сверху: 1px сплошной черный; } Результат Только для клавиатуры pass (проход) - 2018-4-9 NVDA 2018.1 + FF Quantum 59.0.2 pass (проход) - 2018-4-9 JAWS 2018.3 + IE 11 ✔ (проход) - 2018-4-5 JAWS 2018.3 + FF ESR 52.7.3 ✔ (пас) - 2018-4-9

Для экранных ридеров это выглядит так:

Для экранных ридеров это выглядит так:

Таким образом, пользователям программы чтения с экрана будет немного сложнее найти «настоящий» основной контент. Но используя элементы HTML 5, такие как <header>, <footer> и особенно <main>, вы можете эффективно обойти эту проблему.

Может быть немного неловко иметь основной заголовок как <h1> и <h2>. При желании вы можете добавить префикс к заголовку в области <main> и скрыть его визуально (см. Скрытие элементов визуально, перемещая их за пределы экрана ), например "Основной контент:":

<main> <h2> <span class = "visual-hidden"> Основное содержимое: </ span> Мои хобби </ h2> </ main>

Подход № 2: h1 поверх основного контента

Если вы предпочитаете иметь один заголовок на уровне 1 непосредственно над основным контентом, это тоже нормально. Если вам все еще нужны заголовки для элементов над ним (например, заголовок), вы можете начать с уровня 2 для них.

Страница только с одним h1 поверх основного контента Страница только с одним h1 поверх основного контента

<header> <h2 class = "визуально-скрытый"> заголовок </ h2> <p> веб-присутствие Джона Доу </ p> </ header> <nav> <h2 class = "визуально-скрытый"> навигация </ h2 > <ul> <li> <a href = "#"> Главная страница </ a> </ li> <li> <a href = "#"> Хобби </ a> </ li> <li> <a href = "#"> О </ a> </ li> <li> <a href = "#"> И т.д. </ a> </ li> </ ul> </ nav> <main> <h1> Мой Хобби </ h1> <p> Это все виды деятельности, которые я люблю делать регулярно. </ p> <h2> Физическая активность </ h2> <h3> Игра в футбол </ h3> <p> Футбол - командный вид спорта, в который играют две команды из одиннадцати игроков со сферическим мячом. </ p> <h3> Танцы </ h3> <p> Танец - это форма исполнительского искусства, состоящая из специально отобранных последовательностей человеческого движения. </ p> <h2> Расслабляющие занятия </ h2> <h3> Просмотр фильмов </ h3> <p> Фильм, также называемый фильмом, кинофильмом, театральным фильмом или фотоплеером, представляет собой серию неподвижных изображений, которые, при отображении на экране создает иллюзию движущихся изображений из-за явления фи. </ p> </ main> <footer> <h2 class = "visual-hidden"> нижний колонтитул </ h2> <p> Авторские права 2057 John Doe </ p> </ footer> .visually-hidden {position: absolute; слева: - 10000 пикселей; ширина: 1px; высота: 1 пикс; переполнение: скрытое; } body {margin: 0; } header {background-color: lightpink; переполнение: скрытое; нижняя граница: 1px сплошной черный; отступ слева: 20 пикселей; отступ справа: 20 пикселей; } nav {background-color: lightgreen; плыть налево; ширина: 200 пикселей; нижняя граница: 1px сплошной черный; } main {margin-left: 200px; переполнение: скрытое; рамка слева: 1px сплошной черный; отступ слева: 20 пикселей; отступ справа: 20 пикселей; } нижний колонтитул {background-color: lightsteelblue; переполнение: скрытое; отступ слева: 20 пикселей; отступ справа: 20 пикселей; граница сверху: 1px сплошной черный; } Результат Только для клавиатуры pass (проход) - 2018-4-9 NVDA 2018.1 + FF Quantum 59.0.2 pass (проход) - 2018-4-9 JAWS 2018.3 + IE 11 ✔ (проход) - 2018-4-5 JAWS 2018.3 + FF ESR 52.7.3 ✔ (пас) - 2018-4-9

Для экранных ридеров это выглядит так:

Для экранных ридеров это выглядит так:

Это создает схему заголовка, которая технически немного недопустима, так как начинается с заголовка на уровне 2 (и вы не должны пропускать уровни заголовков). Но в таких ситуациях программы чтения с экрана терпят неудачу, как вы можете видеть на скриншоте выше: NVDA просто отображает эти недействительные заголовки на уровне 1.

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

Этот особый случай принят сообществом доступности.

Похожие

Консультанты по поисковой оптимизации в Лондоне
... href="https://position1seo.co.uk/search-engine-optimisation-consultant/"> Консультанты по поисковой оптимизации в Лондоне и в Великобритании, важно убедиться, что вы работаете с авторитетным профессионалом. Читайте дальше, чтобы обнаружить признаки того, что ваш нынешний консультант по SEO на самом деле наносит ущерб вашему бизнесу, а не помогает ему. Один из ключевых признаков того, что вы работаете с агентством по поисковой оптимизации, которое не работает для вашего
Оптимизация целевой страницы
... это, пожалуй, самая важная страница сайта , но во многих случаях она не оптимизирована и не создана должным образом, что приводит только к негативным последствиям для вашей кампании или вашего бренда"> целевая страница это, пожалуй, самая важная страница сайта , но во многих случаях она не оптимизирована и не создана должным образом, что приводит только к негативным последствиям для вашей кампании или
→ Майами-Бич SEO // Карма Снэк-маркетинг
... таким предприятием. Дано с правом SEO Майами-Бич Поставщик услуг, вы можете просто преодолеть препятствия, которые возникнут позже, когда вы будете строить и развивать свою фирму. Итак, кого вы выбираете для лучших услуг интернет-маркетинга, обслуживающих в районе Майами-Бич? Что мы предлагаем SEO ОПЛАТА ЗА КЛИК ВЕБ-ДИЗАЙН СОЦИАЛЬНЫЕ МЕДИА
Что это такое и как работает Majestic?
Специалисты по медиа, маркетингу и интернету используют величавый , Способность адаптироваться к широкому спектру рынков позволила этому инструменту онлайн-маркетинга позиционировать себя как один из самых популярных. Для профессионалов SEO он предлагает помощь в поиске потенциальных клиентов и управлении ими, подготовке предложений, отчетов и проверке веб-сайтов. Это позволяет аналитикам наблюдать за тем, что находится внутри и снаружи виртуального
Одностраничные сайты и SEO: совместимо ли это?
... подходят для сайтов, которые рассказывание хочу работать. Бесконечная вертикальная прокрутка больше не является аргументом против современного дня. дизайн Но как устроен одностраничный дизайн с точки зрения SEO ? Можете ли вы привести одностраничный к усикам? Этот вопрос был
Что такое транспортный поток?
... href="https://www.mondovo.com/learning/wp-content/uploads/2017/10/Estimated-Traffic.png"> Метрика рассчитывается на основе: Объем локального поиска по ключевому
SEO на странице оптимизации
... это метод SEO, отвечающий за оптимизацию всех элементов On Page на сайте. Цель состоит в том, чтобы упростить правильную индексацию веб-страниц поисковыми системами , что обеспечит более оптимальное ранжирование и ранжирование в Google или других поисковых системах. Контроль всех соответствующих факторов исходного кода сайта приводит к лучшему и эффективному отслеживанию ботов на сайте, потому что для выполнения этой функции требуется ограниченное время, поэтому, если мы
Школа SEO - руководство для начинающих по поисковой оптимизации
... также известен как поисковая оптимизация Речь идет об оптимизации вашего сайта, чтобы он мог занимать высокие позиции в поисковых системах (таких как Google) благодаря использованию построения ссылок, исследования ключевых слов, оптимизации веб-сайта и контент-маркетинга. Это может быть чрезвычайно важно для вашего интернет-бизнеса, блога или веб-сайта, когда речь идет о получении трафика.
Позиционирование в поисковых системах: что есть, а что нет?
В какой-то момент мы все задались вопросом, как они выглядят на этих сайтах в Google, Bing, Yahoo и т. Д.? Хорошо, чтобы четко рассказать о том, что такое позиционирование в поисковой системе, а что нет, я попробую эту публикацию Ясный и лаконичный способ прояснения различных концепций, которые обычно даже многих экспертов по позиционированию SEO путают. Для этого первое, что мы должны знать, это состав использования поисковых систем, хотя, поскольку в Испании более 90% используют Google,
SEO определение: что это за бред?
В самом сердце отличного разговора с вашей бандой гиков было выпущено неизвестное слово: « SEO »! "Но что такое бред? Вы спрашиваете, пока обсуждение продолжается, и вы теряетесь все больше и больше. Не волнуйтесь, мы объясним все, что вы хотите знать, не решаясь спросить. Определение поисковой оптимизации SEO - это сокращение от « Поисковая оптимизация », что означает «поисковая оптимизация» на французском языке, но на языке Мольера
Что такое SEO: как достичь вершины Google
... href="https://www.ubersuggest.io/"> ubersuggest.io является очень полезным инструментом в определении этих терминов. Кроме того, Google Keyword Planner также дает вам четкое представление об объеме поиска, однако ваши результаты уже не так точны. Если у вас есть доступ к инструменту SEO MOZ Вы можете использовать инструмент исследования ключевых слов. Оптимизировать страницы После того, как вы определили термины для связи, вы можете

Комментарии

Этот отчет дает и клиенту, и SEO возможность рассказать о том, что происходит в проекте, что сделано, что должно, как мы измеряем успех и «что это значит снова?
Этот отчет дает и клиенту, и SEO возможность рассказать о том, что происходит в проекте, что сделано, что должно, как мы измеряем успех и «что это значит снова?». Это лучше всего рассмотреть в коротком 30-минутном звонке каждую неделю. Ниже я поделился шаблоном, который мне очень нравится. Его электронная таблица помещается на 1 странице и охватывает практически все, что можно было бы узнать о проекте, начиная с обзора высокого уровня вверху и заканчивая мельчайшими подробностями внизу.
Мы можем перечислить около ста вещей, почему мы так любим КангДзюн, но знаем ли мы о том, что он любит и его идеальный тип?
Мы можем перечислить около ста вещей, почему мы так любим КангДзюн, но знаем ли мы о том, что он любит и его идеальный тип? Seo KangJun 's Идеальная подборка типов Seo KangJun: мне действительно наплевать на возраст. Если она старше меня на 9 лет, это нормально. Я люблю доброго человека и того, с кем мне приятно общаться. Дело не в внешности для меня, а в том, какие эмоции я испытываю, когда я с этим человеком. Если я скажу то, что меня интересует, особенно во взглядах,
Теперь, когда мы понимаем, что представляют собой подобные концепции, можем ли мы сказать, что динамическое обслуживание лучше для SEO, чем адаптивный веб-дизайн?
Теперь, когда мы понимаем, что представляют собой подобные концепции, можем ли мы сказать, что динамическое обслуживание лучше для SEO, чем адаптивный веб-дизайн? Я знаю, что мой коллега Майкл Мартин большой сторонник динамического обслуживания и предпочитает адаптивный веб-дизайн или мобильные URL для SEO. Я согласен с тем, что это может быть отличным решением для многих проблем, с которыми сталкиваются
Мне просто интересно, где Google идет с этим и как это можно сделать, потому что это нарушает TOS или делает это?
Мне просто интересно, где Google идет с этим и как это можно сделать, потому что это нарушает TOS или делает это? Обсуждение на форуме WebmasterWorld ,
Я также задавался вопросом, какая версия будет добавлена ​​в его альбом, я не думаю, что это будет версия IU, но будет ли это только версия Seo Taiji или это будет дуэт?
Это может быть хорошо, но хорошо ли это для поисковой оптимизации?
Это может быть хорошо, но хорошо ли это для поисковой оптимизации? Не модно и не прослеживается Вы помните тенденцию превращать целые сайты во Flash? При взгляде на минуты загрузки баров приходила одна или другая мысль, что это, вероятно, не будет преобладать. Тем не менее, сайты, которые поддерживали свои сообщения с помощью интерактивных возможностей Flash, были популярны. Как и в случае с Flash, одностраничные дизайны не только заставляют все сайты переходить в новые
Как мы можем сообщить Google, что мы внедрили AMP и что есть новые страницы для сканирования и индексации?
Как мы можем сообщить Google, что мы внедрили AMP и что есть новые страницы для сканирования и индексации? Чтобы указать Google версии AMP страниц, в заголовок HTML-кода вставляется определенный тег ссылки. Каноническая страница указывает на страницу AMP со ссылкой rel = "amphtml", в то время как со страницы AMP связана каноническая страница со ссылкой отн = «канонической» , Просто верно? Это та же операция hreflang
Можете ли вы использовать повышение, когда мы говорим о качественных посещениях сайта и позволяет ли это ваш бюджет?
Можете ли вы использовать повышение, когда мы говорим о качественных посещениях сайта и позволяет ли это ваш бюджет? Тогда стоит подумать об «инвестировании» в СЭО. «Инвестирование» в кавычки действительно, потому что, как только вы остановите SEA, вы сразу увидите значительное снижение трафика на вашем сайте. Не совсем долгосрочное решение. Это снова SEO. Посадите семена, инвестируя время в
Есть ли области, которые можно поддержать на органической стороне, оптимизируя свои страницы или создавая больше контента?
Есть ли области, которые можно поддержать на органической стороне, оптимизируя свои страницы или создавая больше контента? Есть ли области, в которые вы можете инвестировать с точки зрения платной перспективы? Существуют ли области, на которых ваши конкуренты не слишком сосредоточены, но где вы видите возможности (и, следовательно, вам следует больше инвестировать)? 4. Найдите органические ключевые слова для вашей отрасли. Иногда самые большие неиспользованные возможности
Однако знаете ли вы, что использование услуг рекламодателей, таких как Google AdWords, означает, что мы должны каждый месяц платить Google?
Однако знаете ли вы, что использование услуг рекламодателей, таких как Google AdWords, означает, что мы должны каждый месяц платить Google? Фактически, если мы знаем, как использовать методы SEO, мы можем сэкономить на довольно большом рекламном бюджете. Плюс для тех из вас, кто только начинает онлайн бизнес. Победа в поиске Google означает, что это увеличит возможности
Можно ли с уверенностью сказать, что это было просто обычное умеренное движение?
Можно ли с уверенностью сказать, что это было просто обычное умеренное движение? Весь кредит идет на изменения алгоритма обновлений Google . Я думаю, что это была смесь большинства этого. Я предполагаю, что несколько мест назначения могут видеть восстановление к прошлым обновлениям. Тем не менее, кроме того, дни событий действительно мешают мне оценить болтовню в дискуссиях. Статья сока: Напишите ваш контент уникальным, используйте маркеры

Итак, кого вы выбираете для лучших услуг интернет-маркетинга, обслуживающих в районе Майами-Бич?
Дизайн Но как устроен одностраничный дизайн с точки зрения SEO ?
Можете ли вы привести одностраничный к усикам?
Позиционирование в поисковых системах: что есть, а что нет?
Но что такое бред?
Этот отчет дает и клиенту, и SEO возможность рассказать о том, что происходит в проекте, что сделано, что должно, как мы измеряем успех и «что это значит снова?
Мы можем перечислить около ста вещей, почему мы так любим КангДзюн, но знаем ли мы о том, что он любит и его идеальный тип?
Мы можем перечислить около ста вещей, почему мы так любим КангДзюн, но знаем ли мы о том, что он любит и его идеальный тип?
Теперь, когда мы понимаем, что представляют собой подобные концепции, можем ли мы сказать, что динамическое обслуживание лучше для SEO, чем адаптивный веб-дизайн?
Мне просто интересно, где Google идет с этим и как это можно сделать, потому что это нарушает TOS или делает это?
3D стерео фильмы для 5D