El tag HTML5 <dialog />, pensado para marcar una conversación, un chat u otro sistema de interacción entre dos o más interlocutores, aporta un valor semántico a nuestro código.
<dialog>
<dt> <time>14:22</time> egof </dt>
<dd> I'm not that nerdy, I've only seen 30% of the star trek episodes</dd>
<dt> <time>14:23</time> kaj</dt>
<dd> if you know what percentage of the star trek episodes you have seen, you are inarguably nerdy</dd>
<dt> <time>14:23</time> egof</dt>
<dd> it's unarguably</dd>
<dt> <time>14:24</time> kaj</dt>
<dd> you are not helping your case</dd>
</dialog>Como podemos ver en el código superior, marcamos el texto como un <dialog /> que posteriormente seccionamos en <dt /> y <dd /> para especificar nombre y frase asociada a esa persona. Tambien usamos el tag <time /> para indicar la hora de la conversación.
Twitter en HTML5
<dialog>
<dt><a href="http://twitter.com/akamike">@akamike</a>, <time datetime="2009-08-11T12:35:54">13 minutes ago</time></dt>
<dd>Where is a good place to eat in town?</dd>
<dt><a href="http://twitter.com/brucel">@brucel</a>, <time datetime="2009-08-11T12:37:56">11 minutes ago</time></dt>
<dd><a href="http://twitter.com/akamike">@akamike</a> Have your tried The Swine's Flu pub lunches?</dd>
<dt><a href="http://twitter.com/Rich_Clark">@Rich_Clark</a>, <time datetime="2009-08-11T12:38:04">11 minutes ago</time></dt>
<dd><a href="http://twitter.com/akamike">@akamike</a> If you like seafood, try the restaurants at the waterfront</dd>
<dt><a href="http://twitter.com/jackosborne">@jackosborne</a>, <time datetime="2009-08-11T12:40:02">9 minutes ago</time></dt>
<dd><a href="http://twitter.com/akamike">@akamike</a> What <a href="http://twitter.com/brucel">@brucel</a> said, or there are lots of good bakeries on the high street.</dd>
<dt><a href="http://twitter.com/spambot148">@spambot148</a>, <time datetime="2009-08-11T12:45:16">4 minutes ago</time></dt>
<dd><a href="http://twitter.com/akamike">@akamike</a> Gain 1000 followers in 5 minutes!</dd>
</dialog>Este ejemplo basado en Twitter y sacado de html5Doctor permite visualizar como debería ser la portada de Twitter en HTML5.
9 comentarios, 1 referencias
+
#