5568 sujets

Sémantique web et HTML

Bonjour.

J'ai eu remarque, avec surprise d'ailleurs, que l'html5 autoriserait une utilisation de balises de type block au sein d'un balise de type inline.
p.ex. :
<div class="div parente">
<a href="#">
<div>contenu ou pas</div>
</a>
</div>

Info ou intox ? je vous remercie infiniment de m'éclairer sur le sujet et éventuellement indiquer une source vers ces règles…

Bonne soirée.
J'ai trouve l'info (et non l'intox) dans les tutos du site.

Navré davoir ouvert le post pour trouver la reponse peu de temps après.
Administrateur
C'est effectivement officiellement possible pour les liens <a>, mais pas pour les autres éléments HTML de type block. On ne peut donc pas placer un <div> dans un <span> par exemple.
Bonjour.
Merci pour la precision. J'ai lu en effet que seule la balise de lien l'acceptait, ou du moins je n'ai rien lu sur les autres balises inline.

Ben même si c'est accepté, j'ai des difficultés avec ce fait. Jamais il ne me viendrait à l'esprit d'agir ainsi. Je n'en voit même pas une seule vraie raison.

En avez-vous vous ? Avez vous un exemple où ça aurait vraiment de l'intérêt ?

Merci pour un éventuel complément à cette discussion.
__
Eddy.
Modérateur
Faire un lien sur un block (ou une «carte»). Comme par exemple sur la page d'accueil d'alsacréations.
Bonjour.

Parfois, avec le texte qui est habituellement mis en lien, il y a aussi une ou plusieurs images, (tout un article parfois). Elles constituent une cible plus évidente pour l'utilisateur.

C'est tentant de mettre un lien sur l'ensemble des éléments.

Smiley smile
Meilleure solution
Et tout ça ne peut pas être géré par css sur un lien en display bloc ?

J'essaye de comprendre l'utilité réelle de cette situation.
kustolovic a écrit :
Faire un lien sur un block (ou une «carte»). Comme par exemple sur la page d'accueil d'alsacréations.


Je suis allé voir ces fameuses cartes (j'imagine les différentes parties de cette page d'accueil).
On peut voir que seul un titre de niveau 3 est contenu par le <a> et quand même, le lien se répend sur la "carte", avec le tout géré par CSS.

Par contre, l'insertion du <h3> dans le <a> me suffit à comprendre la "logique" de ces possibilités.

Je vous remercie de vos interventions, je suis pas 100% convaincu mais ce doit être dû à mes vieilles habitudes des inline dans les block et pas l'inverse… Smiley ohwell Smiley confused

Bonne semaine.
Modérateur
edfred a écrit :

Je vous remercie de vos interventions, je suis pas 100% convaincu mais ce doit être dû à mes vieilles habitudes des inline dans les block et pas l'inverse… Smiley ohwell Smiley confused

À noter qu'en HTML 5 il n'y a plus d'éléments inline ou block, mais des catégories plus spécifiques:

- Metadata content
- Flow content
- Sectioning content
- Heading content
- Phrasing content
- Embedded content
- Interactive content

Avec une hiérarchie entre eux (voir: https://www.w3.org/TR/html5/dom.html#content-categories)

Le cas de <a> est le suivant: le contenu permis est «transparent» c'est-à-dire qu'il hérite le contenu autorisé de son parent: Autrement dit:


<!-- C'est autorisé: -->
<div>
  <a href="truc.html"><h3>super</h3></a>
</div>
<!-- Ce n'est pas autorisé: -->
<span>
  <a href="truc.html"><h3>super</h3></a>
</span>


Block et inline ne concernent plus que la présentation et les CSS désormais.