В предыдущих руководствах по Сети обучения веб-страницам много раз подчеркивалось, что HTML-файлы веб-страниц должны быть семантическими. Мы должны выбирать наиболее подходящие теги HTML или XHTML на основе структуры HTML-документа веб-страницы, а не выбирать их на основе их внешнего вида. Используйте тег P для определения абзаца, а не для получения эффекта разрыва строки. Мы используем теги h1-h6 для обозначения заголовков, а не для достижения размера текста и жирного эффекта.
Например, для заголовка мы можем использовать h1 для его определения:
<h1>Здесь напишите заголовок статьи</h1>
Вместо того, чтобы определять его каким-либо другим способом:
<p style="font-size:16px; font-weight:bold;">Напишите здесь текст заголовка статьи</p>
В предыдущих статьях Web Teaching Network мы перечислили все теги, разрешенные XHTML1.0. Мы также можем обнаружить, что на самом деле существует очень мало тегов элементов, которые мы можем выбрать. Но мы также ясно понимаем, что эти изысканные знаки элементов также имеют более четкое значение. Если вы действительно не можете найти нужный элемент для пометки, вы можете использовать общие теги div и span.
Использование тегов div и span на страницах — новая проблема, и мы склонны использовать их слишком часто. Необходимое и разумное использование divов позволяет существенно улучшить структуру документа. Если вы посмотрите на свой HTML-документ и обнаружите, что в нем много элементов div и span, вам придется взглянуть на проблему с другой точки зрения. Есть ли злоупотребления? Есть ли маркеры получше, чем их заменить? Если h1 может лучше представлять размеченный контент, то вам придется отказаться от p или span для его определения.
Возможно, это пара противоречий, и нам сложно понять, как ими правильно пользоваться, а возможно, мы вообще не можем получить внятного ответа. Но необходимо уточнить одну вещь, нам следует сделать так, чтобы документ имел четкую логическую структуру и было проще применять стили. Мы можем думать о div как о контейнере или «части» документа. Мы используем слишком много контейнеров, и это неразумно. А контейнер, который правильно расположен и находится в разумном положении, может сделать весь документ организованным.
Следующий код более разумен и эффективен:
| Ниже приводится цитируемое содержание: <div id="header"> |