Могу ли я добавить микроданные из HTML5 на сайт XHTML Strict и при этом быть совместимым? - PullRequest
Новая
       26

Могу ли я добавить микроданные из HTML5 на сайт XHTML Strict и при этом быть совместимым?

25 голосов
/ 07 сентября 2010

У меня есть сайт, закодированный в XHTML 1.0 Strict.Я хочу использовать новые микроданные для добавления панировочных сухарей на мой сайт (поэтому Google их поймет ).

Мои старые хлебные крошки с разметкой без микроданных выглядят так: 

<ul>
  <li><a href="...">Level 1</a></li>
  <li><a href="...">Level 2</a></li>
  <li><a href="...">Level 3</a></li>
</ul>

Согласно Google, для разметки панировочных сухарей с использованием микроданных вы расширяете приведенный выше код следующим образом: 

<ul>
  <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
    <a href="..." itemprop="url">
      <span itemprop="title">Level 1</span>
    </a>
  </li>
  ...
</ul>

Но это не действительно XHTML 1.0 Strict.

Что мне делать?
Должен ли я игнорировать конфликты проверки?
Должен ли я писать itemscope="itemscope" вместо просто itemscope (это будет действительный XML, но все еще не действительный XHTML)?
Должен ли я изменить Doctype на HTML5 вместо XHTML 1.0 Strict?

Я хочу, чтобы это работало вплоть до IE6!

Пожалуйста, совет:)

Ответы [ 5 ]

16 голосов
/ 07 сентября 2010

Да, если вы хотите использовать itemscope в XHTML, вам нужно написать itemscope="itemscope" и использовать XHTML5 (тот же DOCTYPE, что и в HTML5, но синтаксис XML).

itemscope не включенов W3 HTML5, но присутствует в версии WHATWG, поэтому проверка может оставаться проблемой.В этом вопросе, похоже, есть какой-то политический аргумент , которым я не следил, поскольку он выглядит довольно утомительно.

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">
12 голосов
/ 03 сентября 2011

Так как основные поисковые системы решили schema.org в июне прошлого года (2011) как способ создания богатых фрагментов, этот вопрос стал гораздо более важным, поскольку XHTML5 невсе же иметь работающий DTD (кстати, http://www.html5dtd.org/ работает над DTD XHTML5 и вполне может быть готов, когда вы прочитаете это, если не обращаете внимания на то, что я собираюсь сказать).И то, что я собираюсь сказать, суммирует страницу, которую я разместил на http://www.nedprod.com/programs/portable/XHTMLwithHTML5microdata/ несколько недель назад, и там есть более подробная информация, включая демонстрацию с богатым фрагментом кода, если хотите.

Мне нужно было расширитьXHTML 1.x Строгий доступ к микроданным schema.org/HTML5 и обеспечение правильной проверки правильности обновления для nedprod, а Microsoft Expression Web иногда имеет тенденцию употреблять куски HTML, которые он редактирует, поэтому проверка удобна для отлова при сбое.Поэтому я создал эти DTD, которые расширяют стандартные XHTML 1.0:

Для использования, возьмите копию вашего желаемого DTD (не используйте оригинал от nedprod, я не могу позволить себе пропускную способность) и используйте следующее: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict with HTML5 microdata//EN" "xhtml1-strict-with-html5-microdata.dtd">

или ... 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional with HTML5 microdata//EN" "xhtml1-transitional-with-html5-microdata.dtd">

... или, что более вероятно, переопределите DTD, используемый для проверки вашей конкретной установкой проверки XML.

Кстати, вот кое-что интересное, и я включаю это только потому, что полезно знать, отвечая навопрос.Честно говоря, Бог подумал, что использование вышеупомянутых типов докторов вызовет режим причуд при рендеринге.К моему большому удивлению, оказывается, что IE8, Chrome 14, Firefox 5 и Opera 11.50 все отображают такой тип документа в стандартном режиме.Кто бы мог подумать!Таким образом, вы можете, если хотите, загрузить свои страницы XHTML в общедоступный Интернет с пользовательским типом документа, и, по крайней мере, более новые браузеры будут делать правильные вещи.

Надеюсь, это кому-нибудь поможет,
Niall

1 голос
/ 08 апреля 2013

Пример действительного HTML 5 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example page</title>
</head>
<body>
    <div itemscope="" itemtype="http://schema.org/MediaObject">
        <div itemprop="video" itemscope="" itemtype="http://schema.org/VideoObject">
           <meta itemprop="name" content="Breast Augmentation Video Diary">
           <meta itemprop="duration" content="PT12M54S">
           <meta itemprop="thumbnailUrl" content="http://www.plastic-surgery-estonia.com/new-assets/images/thumbnails/breast-augmentation.jpg">
           <meta itemprop="contentURL" content="http://www.youtube.com/watch?v=BwPN6eCpxTk">
           <meta itemprop="embedURL" content="http://www.youtube.com/watch?feature=player_embedded&amp;v=BwPN6eCpxTk">
           <meta itemprop="uploadDate" content="2010-11-09">
           <iframe src="http://www.youtube.com/embed/BwPN6eCpxTk?rel=0&amp;autohide=1&amp;modestbranding=1&amp;showinfo=0"></iframe>
           <span itemprop="description">Video Diary</span>
        </div>
   </div>
</body>
</html>

Нашли эти ссылки полезными:
- http://support.google.com/webmasters/bin/answer.py?hl=en&answer=2413309&topic=1088474&ctx=topic
- http://www.reelseo.com/embedded-youtube-indexed-google/

0 голосов
/ 20 декабря 2013

Используйте тип application/ld+json MIME и генератор микроданных для преобразования разметки в данные: 

<!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>microdata.xhtml</title>
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/>
    </head>
    <body>
      <div>
      <script type="application/ld+json">
      {"items": [{
        "type": ["https://schema.org/breadcrumb"],
        "properties":{ 
        "url": ["..."],
        "title": ["Level 1"]
        }
       }]
      }
      </script>
      </div>
    </body>
    </html>

или data:uri в теге объекта: 

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>microdata.xhtml</title>
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/>
    </head>
    <body>
      <div>
        <object data="data:text/html;charset=utf-8;base64,PHVsPiA8bGkgaXRlbXNjb3BlIGl0ZW10eXBlPSJodHRwOi8vZGF0YS12b2NhYnVsYXJ5Lm9yZy9CcmVhZGNydW1iIj4gICAgICAgICA8YSBocmVmPSIuLi4iIGl0ZW1wcm9wPSJ1cmwiPiAgICAgICAgICAgPHNwYW4gaXRlbXByb3A9InRpdGxlIj5MZXZlbCAxPC9zcGFuPiAgICAgICAgIDwvYT4gICAgICAgICA8L2xpPiAgICAgICA8L3VsPg==">

          <?microdata
          <ul>
            <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
             <a href="..." itemprop="url">
               <span itemprop="title">Level 1</span>
             </a>
            </li>
          </ul>
          ?>

        </object>
      
        <!--[if lt IE 8]>
        <object data="mhtml://#foo">

          <?microdata
          <ul>
            <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
             <a href="..." itemprop="url">
               <span itemprop="title">Level 1</span>
             </a>
            </li>
          </ul>
          ?>
          <div id="foo">
              PHVsPiA8bGkgaXRlbXNjb3BlIGl0ZW10eXBlPSJodHRwOi8vZGF0YS12b2NhYnVsYXJ5Lm9yZy9CcmVhZGNydW1iIj4gICAgICAgICA8YSBocmVmPSIuLi4iIGl0ZW1wcm9wPSJ1cmwiPiAgICAgICAgICAgPHNwYW4gaXRlbXByb3A9InRpdGxlIj5MZXZlbCAxPC9zcGFuPiAgICAgICAgIDwvYT4gICAgICAgICA8L2xpPiAgICAgICA8L3VsPg==
          </div>
       </object>
       <![endif]-->
      </div>
    </body>
    </html>

Я хочу, чтобы это работало вплоть до IE6!

Используйте application/xhtml+xml XSLT shim для поддержки IE6 и расширьте его, чтобы получить копию разметки.

Ссылки

0 голосов
/ 11 декабря 2010

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

...