Posso aggiungere microdati da HTML5 a un sito Strict XHTML ed essere ancora compatibile?

https://stackoverflow.com/questions/3659778

01-10-2019
|

Domanda

Ho un sito codificato in XHTML 1.0 Strict. Voglio utilizzare il nuovo Microdata per aggiungere il pangrattato al mio sito (così Google capirà loro ).

Il mio vecchio non microdati pangrattato contrassegnati-up simile a questa:

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

Secondo Google, a markup pangrattato utilizzando i microdati, si estende il codice di cui sopra in questo modo:

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

Ma questo non è validato XHTML 1.0 Strict.

Che cosa devo fare?
Dovrei ignorare i conflitti di validazione?
Dovrei itemscope="itemscope" scrittura invece di itemscope (questo sarebbe XML valido, ma ancora non validato XHTML)?
Devo cambiare il doctype essere HTML5 invece di XHTML 1.0 Strict?

Voglio questo lavoro tutta la strada fino a IE6!

Si prega di consulenza:)

Soluzione

Sì, se si voleva utilizzare itemscope in XHTML, si avrebbe bisogno di itemscope="itemscope" di scrittura e utilizzare XHTML5 (stessa DOCTYPE come HTML5, ma la sintassi XML).

itemscope non è inclusa nel W3 HTML5, ma presente nella versione di WHATWG, quindi convalida può continuare ad essere una difficoltà. Sembra che ci sia un bel po ' politica argomento su questo tema, che mi rifugio 't stato seguito come sembra abbastanza noioso.

Per il momento, se si desidera utilizzare le annotazioni breadcrumb in un formato di documento validabile finalizzato, è possibile utilizzare RDFa invece: l'alternativa (ma vecchio) la proposta, che l'argomento è tutto, e utilizzare il doctype esistente:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">

Altri suggerimenti

Dal momento che i principali motori di ricerca hanno deciso schema.org lo scorso giugno (2011) come il modo per farlo ricco frammenti, questa domanda è diventata molto più importante vedere XHTML5 non dispone ancora di un DTD di lavoro (a proposito, http://www.html5dtd.org/ sta lavorando su un XHTML5 DTD e può ben essere pronti quando leggerete questo, in caso affermativo disprezzo quello che sto per dire). E quello che sto per dire riassume una pagina ho messo a http://www.nedprod.com/programs/portable/ XHTMLwithHTML5microdata / un paio di settimane fa, e ci deve più in dettaglio tra cui un rich snippet demo se lo vuoi.

ho avuto bisogno di estendere XHTML 1.x rigoroso con schema.org/HTML5 microdati e ottenere tutto per convalida correttamente per l'aggiornamento nedprod, e Web Microsoft Expression ha l'occasionale tendenza a mangiare pezzi di HTML edita, quindi convalida è a portata di mano per la cattura quando Borks. Quindi ho creato queste DTD che si estendono lo standard XHTML 1.0 quelle:

Per usare, prendere una copia della tua DTD desiderata (non utilizzare l'originale da nedprod, non posso permettermi la larghezza di banda) e l'utilizzo come segue:

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

o ...

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

... o più probabilmente, ignorare il DTD utilizzato per la convalida da parte vostra particolare configurazione validazione XML.

A proposito, qui c'è qualcosa di interessante, e ho includere solo questo come è utile sapere quando rispondere alla domanda. Ho onesto a Dio pensato che utilizzando i doctype di cui sopra sarebbe richiamare quirks mode durante il rendering. Si scopre che, con mia grande sorpresa, che IE8, Chrome 14, Firefox 5 e Opera 11.50 tutti un esempio di rendering quali doctype in modalità Standard. Chi l'avrebbe mai detto! Così si potrebbe, se si voleva, caricare le pagine XHTML su internet pubblico con la doctype costume e le più recenti browser almeno avrebbe fatto la cosa giusta.

Spero che questo aiuti qualcuno,
Niall

Valid HTML 5 esempio

<!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>

Trovato questi collegamenti utili:
- http://support.google.com/ webmasters / bin / answer.py? hl = it & answer = 2413309 & topic = 1088474 & ctx = topic
- http://www.reelseo.com/embedded-youtube-indexed-google/

Utilizzare il tipo MIME e application/ld+json un microdati generatore per trasformare il markup in dati :

<!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>

o un data:uri in un tag oggetto:

    <!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>

Voglio questo lavoro tutta la strada fino a IE6!

Utilizzare la application/xhtml+xml XSLT spessore per supportare IE6, estendendolo per ottenere una copia del markup.

Riferimenti

cercare di validare alcune delle pagine di Google ... non convalidano. validazione è uno strumento, uno stupendo, ma niente di più, anche se mi congratulo con la vostra determinazione. se sei così preoccupato per la convalida vorrei passare a HTML5.

Autorizzato sotto: CC-BY-SA insieme a attribuzione

Non affiliato a StackOverflow