HTML: контейнеры

Как бы вы заверстали копирайт? Варианты ответов:

<p id="copyright">(с) 2005 Company Inc.</p>

<div id="copyright">(с) 2005 Company Inc.</div>

<div id="copyright">
   <p>(с) 2008 Company Inc.</p>
</div>

Первый вариант ограничивает нас только одним абзацем. Если со временем потребуется добавить второй абзац копирайта, то верстку придется переделать. Кроме того, представим, что вдруг потребовалось вставить в копирайт блок с какой-то сложной версткой (очередное дизайнерское извращение). Тег <p> не может содержать блоковых элементов, поэтому опять-таки придется переделать.

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

Однако, я выбираю третий вариант, не смотря на то, что он самый длинный. Тег <p> добавляет еще немного семантики — получается «параграф текста внутри блока копирайта».

Еще один плюс: в версии без стилей блоки текста не слипнутся.

Простой пример.

В версии без стилей текст слипнется:

<div id="some_additional_info">Some additional info.</div>

<div id="copyright">(с) 2008 Company Inc.</div>

А так не слипнется:

<div id="some_additional_info">
   <p>Some additional info.</p>
</div>

<div id="copyright">
   <p>(с) 2008 Company Inc.</p>
</div>

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