5568 sujets

Sémantique web et HTML

Balise <section> HTML5

Bonjour,

Je voulais savoir qu'est ce qui était le mieux pour une page de plusieurs d'articles

<section>
<div>art1</div>
<div>art2</div>
</section>

ou

<div>
<section>art1</section>
<section>art2</section>
</div>


et puis est-ce-qu'il est possible sémantiquement de faire


<p>
blabla
<p>blabla</p>
</p>


Merci
Modifié par jewome62 (07 Apr 2010 - 18:24)
Bonjour Jewome62,

J'utiliserais plutôt l'élément article que section.


<article><p>art1</p></article>
<article><p>art2</p></article>



Concernant ta deuxième question, 
<p></p>
à l'intérieur d'un autre 
<p></p>
n'est pas valide. Et n'a d'ailleurs pas d'utilité.
donc la structure
<section>
<article></article>
<article></article>
</section>

Conviendrai mieux alors

Pour la deuxième question, c'est parce que j'utilise un script qui permet de mettre en forme le texte à la manière d'un wysiwyg et celui-ci ajoute des <p> qui me sont utile pour l'article mais quand je veux extraire juste le les 100 premiers caractère j'ai droit au <p> et je dois donc fermer ce <p> ce qui donne le <p><p></p></p>

Aurait t-il une manière alors de supprimer ce <p> ? j'ai essayer diverse fonctions php j'y suis jamais arrivé!
Pour ta structure tu as tout bon.

Par contre pour l'histoire de ton <p>, si ton script rajoute un <p> il faut que tu le modifie ou le change.
le script ajoute <p> </p> selon les paragraphe quand je saisie le texte c'est <p> et </p> sont utiles lorsque j'affiche l'actualité en entier, donc dans la base de donnée il y a les <p> etc

Mais dans la page d'accueil, je fais extraire les 100premiers caractères de des actualités pour juste avoir un aperçu et bien sur il y a le premier <p> mais pas la balise terminant!

Voici ce qui sort de la requête SQL
<p>blablablablabla


et j'ai mis en page comme ça,

<p><a href="">titre</a> par auteur, le date<br/>
extrait ...</p>


extrait est remplacé par la requête SQL

a la fin sa donne

<p><a href="">titre</a> par auteur, le date<br/>
<p>blablablablabla ...</p>


il y a un <p> en trop (ou il manque un </p> selon le point de vue)
J'ai essayer de retirer le <p> mais je n'arrive pas ...
J'avais penser a rajouter un </p> mais ce n'est pas au norme selon vous!

bref je ne sais pas comment débloquer tout cela Smiley lol

de plus je viens de voir sur wikipédia
a écrit :
# content (contenu de la page)
# section (Identifier un bloc de contenu


en sachant que mon section fais tout les actualités et représente le cadre du millieu, je devrai pas mettre content ??
Modifié par jewome62 (07 Apr 2010 - 21:07)
Je resterais sur l'idée de section qui a pour objectif de réinitialiser la hiérarchie des titres.

Tu peux également t'appuyer sur cet article.
je vais rester sur le <section> qui englobe tout le contenu
car la je commence a m'embrouiller c'est démotivant :S

et toujours pas de solution pour le <p> Smiley lol
Pour ton problème de balise ouvrante à supprimer, tu as tout plein de fonctions php dédiées au traitement des chaines de caractères. Regarde du cote de str_replace par exemple.
Ou encore du côté de strip_tags quoique non si t'es balise sont pas fermé ça peut coincer.
Utiliser str_replace peut être risqué vu que tu ne sais pas si tu auras un seul <p>.
Un truc du style peut fonctionner (à vérifier)
$str = preg_replace('#</?[a-z]*[^>]*>'#is', '', $str);

Modifié par MoOx (09 Apr 2010 - 15:51)
oki merci
une autre question,

<h2 class="titreActu">'.$titre.'</h2>
			<div class="actu">'.$contenu.'</div>
			<p class="infoActu">Par '.$auteur.' le '.$date.'.</p>


ma structure actuelle pour chaque articles est celle la.

Quel serai la structure avec <article>


<h2 class="titreActu">'.$titre.'</h2>
			<article>'.$contenu.'</article>
			<p class="infoActu">Par '.$auteur.' le '.$date.'.</p>


ou 
<article>
<h2 class="titreActu">'.$titre.'</h2>
			<div class="actu">'.$contenu.'</div>
			<p class="infoActu">Par '.$auteur.' le '.$date.'.</p>
</article>


ou encore

<article>
		<header>'.$titre.'</header>
		<section>'.$contenu.'</section>
		<footer>Par '.$auteur.' le '.$date.'.</footer>
</article>
???
Modifié par jewome62 (09 Apr 2010 - 15:49)
<article> 
        <header><hx>'.$titre.'</hx><time>...</time></header> 
        <div class="content">'.$contenu.'</div> 
        <footer>Par '.$auteur.' le '.$date.'.</footer> 
</article>

Sources:
Faire un blog en HTML 5 : http://html5doctor.com/designing-a-blog-with-html5/
L'élement section : http://html5doctor.com/the-section-element

Perso j'ai fais une structure du genre sur le dernier blog que j'ai fais : http://dame-bio.fr/

Plus:
Plusieurs h1 ? http://html5doctor.com/your-questions-answered-6/
Modifié par MoOx (09 Apr 2010 - 15:58)
Le <time> est un info qui peut faire parti des entetes (une date de plublication apr exemple).
A toi de voir si tu veux la mettre dans ton header ou ton footer de ton article.
Remarque, tu peux aussi prendre la deuxième solution avec le H2 dans l'article. Ca fait un genre de mix HTML4/HTML5, mais tu seras probablement moins embêté avec certains navigateurs.
En quoi plusieurs h1 posent problème en html4 ou avec les anciens browsers ? C'est totalement correcte selon les spécs.
En html 4 quand il y a des «sections» (div) dans la page, elles n'ont pas un h1 comme titre vu qu'il y a (en général) un titre au dessus dans la hiérarchie.

Pour garder une bonne accessibilité en html 5, il est conseillé d'utiliser les titres de sections comme avant: les lecteurs d'écrans ne gèrent pas encore le html 5 et ses sections qui peuvent redémarrer la hiérarchie sur un h1.
Modifié par Patidou (13 Apr 2010 - 12:55)
Questions subsidiaires : en véritable HTML5, e'st-ce une erreur de commencer une section directement par H2 ou H3 sans avoir mis de H1 plus avant dans cette section ? Que se passe-t-il avec les titres globaux non rattachés à une section particulière ?
Sujet clos
Aller à