Что такое семантическая разметка и почему я должен хотеть ее использовать?

Question

Как там написано.

Answer 1

Использование семантической разметки означает, что (X) HTML-код, который вы используете на странице, содержит метаданные, описывающие его назначение - например, <h2> который содержит имя сотрудника, может быть помечен class="employee-name".Первоначально некоторые люди надеялись, что поисковые системы будут использовать эту информацию, но по мере развития Интернета семантическая разметка в основном использовалась для предоставления хуков для CSS.

С помощью CSS и семантической разметки вы можете отделить визуальный дизайн страницы от разметки.Это приводит к экономии полосы пропускания, поскольку дизайн нужно загрузить только один раз, и упрощает модификацию дизайна, поскольку он не смешивается с разметкой.

---

Другой момент заключается в том, что используемые элементы должны иметь логическую связь с данными, содержащимися в них.Например, таблицы следует использовать для табличных данных, <p> следует использовать для текстовых абзацев, <ul> следует использовать для неупорядоченных списков и т.д.Это контрастирует с ранними веб-проектами, в которых часто использовались таблицы для всего.

Answer 2

Семантика буквально означает использование "осмысленного" языка;в веб-разработке это в основном означает использование тегов и идентификаторов, которые описывают контент.

Например, применяя к вашим тегам <div> такие идентификаторы, как #Navigation, #Header и #Content, вместо #Left и #Main или используя неупорядоченные списки для списка навигационных ссылок, а не таблицы.

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

Answer 3

От http://www.digital-web.com/articles/writing_semantic_markup/ :

семантическая разметка - это разметка, которая является достаточно описательной, чтобы позволить нам и машинам, которые мы программируем, распознавать ее и принимать решения относительно нее.Другими словами, разметка означает что-то, когда мы можем идентифицировать это и делать с этим полезные вещи.Таким образом, семантическая разметка становится чем-то большим, чем просто описательным.Это становится блестящим механизмом, который позволяет как людям, так и машинам “понимать” одну и ту же информацию.

Answer 4

Помимо уже упомянутой цели, позволяющей программному обеспечению "понимать" данные, существуют более практические приложения для их использования для перевода между онтологиями или для сопоставления между различными представлениями данных - без необходимости перевода или стандартизации данных (что может привести к потере информации и, как правило, мешает вам улучшить свое понимание в будущем).

В этом году на OSCon было проведено как минимум 2 сессии, связанные с использованием семантических технологий.Один из них был на BigData (слайды доступны здесь: http://en.oreilly.com/oscon2008/public/schedule/proceedings, другим были ребята из Бесплатная база.

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

Сопутствующие темы для изучения:OWL, OQL, SPARQL, Franz (AllegroGraph, RacerPRO и TopBraid).

Answer 5

Вот пример веб-сайта с семантическими тегами HTML5, над которым я работаю, который использует недавно принятые микроформаты, указанные на http://schema.org наряду с новыми, более семантическими элементами тегирования HTML5.

http://blog-to-book.com/view/stuff/about/semantic%20web

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

Вот тестовый инструмент: http://www.google.com/webmasters/tools/richsnippets?url=http%3A%2F%2Fblog-to-book.com%2Fview%2Fstuff%2Fabout%2Fsemantic+web&view=

Обратите внимание, что Google now знает, что "вещи" на странице - это книги, и у них есть идентификатор isbn13.Добавление дополнительных метаданных, таких как цена и автор, позволяет делать дальнейшие выводы.

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