5568 sujets

Sémantique web et HTML

Bonjour,

Je me suis demandé comment bien mettre en forme une citation en html5


<figure>
   <blockquote>
      Ici la citation
   </blockquote>
   <figcaption>
      <cite>author</cite>
   </figcaption>
</figure>


Comment auriez vous fait pour regrouper la citation (le texte) et la source dans un même élément ?

Sémantiquement quel serait la solution la plus correct ?
Modifié par ryuran (07 Sep 2011 - 14:48)
Merci pour votre réponse. Mais dans le Document officiel on a cet exemple :

a écrit :

Here, a part of a poem is marked up using figure.

<figure>
<p>'Twas brillig, and the slithy toves<br>
Did gyre and gimble in the wabe;<br>
All mimsy were the borogoves,<br>
And the mome raths outgrabe.</p>
<figcaption><cite>Jabberwocky</cite> (first verse). Lewis Carroll, 1832-98</figcaption>
</figure>


http://www.w3.org/TR/html5/grouping-content.html#the-figure-element

d'où le sens de ma question. Et oui c'est pas très clair dans la doc.


De plus le lien que vous m'avez fournis n'indique en rien comment regrouper le block de citation et les informations liés (auteurs source).

Vu que figure fournit "figcaption" pour préciser ce que représente la figure et que d'après le W3C ceci est utilisable pour une citation.

Est-ce sémantiquement correct ? ou un élément sans valeur sémantique comme la <div> serais plus adapté ? (personnellement utiliser des éléments sans poids sémantique me gène un peu)
Modifié par ryuran (06 Sep 2011 - 09:40)
Figure et figcaption présentent en plus de l'auteur, le contexte, dans un cas comme le tien.

Alors où est le souci, finalement, dans ce que tu as présenté ? Tu as vérifié la validité ?
à priori, c'est Valid vu que Figure accepte tout Flow content :
a écrit :
Most elements that are used in the body of documents and applications are categorized as flow content.

a
abbr
address
area (if it is a descendant of a map element)
article
aside
audio
b
bdi
bdo
blockquote
br
button
canvas
cite
code
command
datalist
del
details
dfn
div
dl
em
embed
fieldset
figure
footer
form
h1
h2
h3
h4
h5
h6
header
hgroup
hr
i
iframe
img
input
ins
kbd
keygen
label
map
mark
math
menu
meter
nav
noscript
object
ol
output
p
pre
progress
q
ruby
s
samp
script
section
select
small
span
strong
style (if the scoped attribute is present)
sub
sup
svg
table
textarea
time
u
ul
var
video
wbr
Text


Ce qui comprend blockquote.
Dans ce cas, quel est le souci ? Si tu as besoin de préciser le contexte, tu passes par un figure/figcaption, sinon un simple blockquote.

Ca me paraît logique, et le tout doit probablement très bien passer.
Ça me semble être le mieux aussi. Mais n'ayant jamais vu cet utilisation. Je voulais l'avis d'experts.
Modifié par ryuran (06 Sep 2011 - 10:16)