H2 идет до h1 в источнике, это нормально?

ЕСЛИ я использую <h2> для заголовка левой боковой панели и использую <h1> для заголовка области основного центра контента, а затем на самом деле в источнике, а если CSS отключен, то в обоих условиях <h2> предшествует <h1>.

Все в порядке? или я не должен использовать <h2> для заголовков левой боковой панели?

Обновление: 5 февраля

Пример добавленного изображения

Структура заголовка http://easycaptures.com/fs/uploaded/235/1182330679.png

Почему я спрашиваю, потому что я всегда читаю во многих статьях <h1> должен быть первым заголовком на странице.

alt text http://www.crearecommunications.co.uk/seo-blog/wp-content/uploads/2009/11/heading-subheads.gif

Ответы

Ответ 1

Ну, учитывая семантику h-тегов, она не ОК. Заголовки в готовом документе должны содержать схему документа, например

 1. H1-Head
     1.1 H2-Head
         1.1.1 H3-Head
         1.1.2 H3-Head
         ...
     1.2 H2-Head
         1.2.1 H3-Head
         ...
     1.3 H2-Head
     ...

и т.д.

Конечно, этот контур должен соответствовать хронологии вхождения тегов.


Обновление для вашего обновления

Я бы предложил следующую разметку

<h1><a>Main title of your site</a></h1>
<h2>Sidebar</h2>
    <h3>Sidebar Headline 1</h3>
    <h3>Sidebar Headline 2</h3>
    ....  
<h2>Main content</h2>
    <h3>Headline 1</h3>
    <h3>Headline 2</h3>
    ...

Знаете ли вы Firefox Web Developer Plugin? Он имеет функцию "Показывать набросок документа". Там вы можете легко проверить логику вашей разметки. И чтобы дать вам представление, один хороший и один плохой пример из pfizer.com и phizer.de(я думаю, вы можете получить эту идею, даже если это немецкий язык - заголовки в красном говорят "Отсутствующий заголовок" ).

pfizer.com http://img246.imageshack.us/img246/1336/com.png


pfizer.de http://img96.imageshack.us/img96/1273/74591264.png

Кстати: Наличие всех этих h-меток в вашей разметке не обязательно означает, что все они должны быть видны;-)!

Ответ 2

Вы должны думать об этом семантически. H1 должен находиться до H2 в документе. H2 является подэлементом в H1.

Способ, которым я подхожу к странице, - сначала скопировать его в HTML, чтобы он имел смысл для пользователя без использования JavaScript и CSS Progressive Enhancement.

Только, тогда я беспокоюсь о стилизации содержимого.

Ответ 3

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

Ответ 4

Семантически, вам нужно, чтобы теги <h2> приходили после <h1> для контура документа. В этом случае - действительно ли боковая панель имеет смысл в потоке заголовков документов?

Из описанной структуры кажется, что тег <h2> используется как заголовок для контента, который не может быть связан с контентом на определенной странице. С точки зрения оптимизации поисковой системы это может оказаться не оптимальным, если эти заголовки фактически не используются в контексте, а используются для стилизации.

В этой статье можно прояснить немного больше: http://www.nathanrice.net/blog/ultimate-guide-to-wordpress-seo-optimized-heading-tags/

Ответ 5

С точки зрения браузера порядок тегов не имеет значения. Однако порядок h1 и h2 имеет семантические последствия для структуры вашего документа. Таким образом, иметь их в правильном порядке имеет значение.

Конечно, современное веб-приложение состоит не только из одного документа. Существуют "внешние" панели, которые не являются частью документа (боковые панели, панели и т.д.). Таким образом, если вы хотите быть семантически "правильным", вы должны зарезервировать h1, h2, а остальное - только на основное содержимое вашей страницы и использовать div и span для блоков и встроенных контейнеров, которые не относятся к семантической структуре вашего документа.

Ответ 6

Я думаю, что люди педантичны, когда говорят, что h1 должен прийти до h2 в коде. H1 должен быть вокруг самой важной информации на странице, находится ли она наверху или в нижнем колонтитуле.

Чем вы занимаетесь? Вы продвигаете название компании или то, что компания делает/продает?

Я полагаю, что если компания продает "красные виджеты" , я хочу, чтобы "Красные виджеты" были h1 на странице продукта, "Виджеты" были h1 на странице списка продуктов и "Мы продаем лучший красный, Белые и синие виджеты! быть h1 на домашней странице.

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

Ответ 7

Вы можете поместить любой HTML-тег в любом месте.

Hello

Hello

Отлично.

Ответ 8

Поместите H1 вокруг своего логотипа. Даже если этот логотип является лишь ссылкой на изображение. (Вы используете теги alt, правильно?) Проблема решена.