Заказ тегов заголовков

StackOverflow https://stackoverflow.com/questions/1098806

  •  11-09-2019
  •  | 
  •  

Вопрос

Я не нашел этот вопрос, не стесняйтесь закрыть, если он уже здесь.

Какой способ создания заголовков в HTML вам больше всего нравится?

<h1> Main Part </h1>
<h2> In here there are many sections</h2>
<div id="section1">
  <h1> Section 1 </h1>
  <h2> Subtitle </h2>
</div>
<div id="section2">
  <h1> Section 2 </h1>
  <h2> Subtitle </h2>
</div>

ИЛИ

<h1> Main Part </h1>
<h2> In here there are many sections</h2>
<div id="section1">
  <h3> Section 1 </h3>
  <h4> Subtitle </h4>
</div>
<div id="section2">
  <h3> Section 2 </h3>
  <h4> Subtitle </h4>
</div>

...это означает упорядочивание сверху или начиная с H1 в каждой части страницы, которая является отдельным разделом (/container/sidebar/что угодно).

Есть и другие практики.Так какой из них вы предпочитаете?Делаете ли вы это вообще по-другому, и если да, то как?Есть ли лучшая практика?Влияет ли это на SEO?Какой из них наиболее смысловой?

Редактировать:Кажется, здесь люди согласны со вторым решением.Это тоже мое мнение, но вот проблема, которая привела меня к этому вопросу:что если я захочу поместить h3 в основную часть?

<h1> Main Part </h1>
<h2> In here there are many sections</h2>
<h3> Something else </h3>
<div id="section1">
  <h3> Section 1 </h3>
  <h4> Subtitle </h4>
</div>
<div id="section2">
  <h3> Section 2 </h3>
  <h4> Subtitle </h4>
</div>

Нужно ли переписывать все разделы?Это может быть целый сайт!Зачастую довольно сложно точно определить, сколько субтитров будет в разделе.

Имейте в виду, что разделы могут быть боковыми панелями или чем-то совершенно другим и находиться где-то в другом месте страницы.

Это было полезно?

Решение

Я считаю, что в каждом документе должен быть только один элемент H1, но я не уверен, что это правило.Тем не менее, это то, чему я склонен следовать.

Таким образом, я голосую за второй приведенный вами пример, логичнее иметь несколько H3/H4 и т. д.элементов, чем несколько элементов H1.Это подразумевает иерархию, которую вы пытаетесь передать лучше.

Другие советы

Основная причина, по которой я склонен использовать подход h1-h4, а не стиль h1-h2, h1-h2, заключается в том, что я получаю больше контроля над форматированием в CSS.Если вы хотите, чтобы H1 и H3 выглядели одинаково, просто оформите их соответствующим образом.

Ваш HTML должен отражать состав документа, и, похоже, вы имеете в виду, что H3 и H4 являются подтемами более высоких уровней.Так что закодируйте это таким образом...и используйте CSS для управления своим фактическим внешним видом.

РЕДАКТИРОВАТЬ:В HTML4 у вас мало выбора, но в HTML5 вы можете использовать Раздел теги.Преимущество здесь в том, что в самом теге нет информации об уровне раздела.Используйте атрибуты классов, чтобы задать имена разделов, и вы сможете легко вставить новый уровень, определив новый атрибут класса (и, возможно, переделав CSS, который соответствует различным классам разделов).

Альтернативно (оставаясь на HTML4), рассмотрите возможность размещения вашего контента в XML или базе данных, а затем используйте язык с шаблонами для динамического создания тегов H.Если вам нужно добавить уровень, вы можете один раз изменить код шаблона.

Определенные разделы заголовка должны иметь одинаковый вес на всей странице.Если что-то является h2 в левом столбце, а что-то — h2 в правом столбце, эти два элемента должны иметь одинаковый вес.Поэтому не имеет значения, где он находится или в каком разделе div он находится, важно, насколько это важно семантически.

Я также предпочитаю иметь только один файл h1.Что касается SEO, конкретные теги заголовков не так важны, как раньше.

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

А.Главная часть
1.Множество разделов
а.Секция 1
1а.Субтитры
б.Раздел 2
1б.Субтитры

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

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top