Html5 un framework bootstrap

bonjour

tous les tags HTML possèdent tous les même propriétés mais pas les mêmes valeurs par défaut . Alors que bootstrap est basé sur la création de nouveau sélecteurs dans une hiéarchie html spécifique..... les tags HTML partent des noms des propriétés communes disponibles pour chaque tag avec des valeurs spécifiques et en associant au tag selon le contexte d'autres tags (tag table avec td tr row colspan...).

Ainsi un <div id="footer"> en HTML5 devient <footer> et de même pour header. <header> et <footer> ont ils dans toutes les valeurs prédéfinies / initialisées par défaut des valeurs de propriétés identiques pour toutes les propriétés CSS ? ( je ne prend pas en compte le fait qu il faut un reset.css car chaque navigateur n'initialise pas les valeurs des propriétés de façon identiques !!...et que chaque navigateur a des attributs css spécifiques )

Qu'apporte html5 puisque avant une page devait aussi être structuré .A part diminuer le nombre de sélecteur au profit de l 'augmentation du nombre de tag html ...et créer des incompatibilité avec les anciens navigateurs je ne vois pas l' intêret de ces nouveau nom de balise !!

Maintenant angular permet la définition de balises ( directive ) . Comment se comporte les navigateurs lors de la rencontre d'un tag inconnu ? le supprime t il ...dans ce cas angular ne peut fonctionner ou le laisse t il dans le dom ? Un validateur HTML / CSS n'a plus d 'intêret dans ce cas !! Sinon lire l article sur la comparaison entre directive angular ,polymer , custom Element , Xtag

Merci
h2 est un "selector" ( appelle du "descriptor")
h2{ color:green} est un "descriptor" ( définition liste de déclaration attribut: value;)
Modifié par 75lionel (30 Jul 2016 - 09:17)

75lionel a écrit :

Ainsi un &lt;div id="footer"&gt; en HTML5 devient &lt;footer&gt; et de même pour header. &lt;header&gt; et &lt;footer&gt; ont ils dans toutes les valeurs prédéfinies / initialisées par défaut des valeurs de propriétés identiques pour toutes les propriétés CSS ? ( je ne prend pas en compte le fait qu il faut un reset.css car chaque navigateur n'initialise pas les valeurs des propriétés de façon identiques !!...et que chaque navigateur a des attributs css spécifiques )

<div> devient <footer> mais il n'a jamais été question de remplacer les id ou les class par des balises. L'intérêt du balisage c'est décrire du code compréhensible par les machines et il ne faut pas mélanger code html et présentation(css).

75lionel a écrit :

Qu'apporte html5 puisque avant une page devait aussi être structuré .A part diminuer le nombre de sélecteur au profit de l 'augmentation du nombre de tag html ...et créer des incompatibilité avec les anciens navigateurs je ne vois pas l' intêret de ces nouveau nom de balise !!

Les navigateurs qui ne prennent pas en compte html5 sont obsolètes. Ça n'augmente pas significativement le nombre de balise car généralement on mettait de <div> en lieu et place de toutes ces balises.

75lionel a écrit :

Maintenant angular permet la définition de balises ( directive ) . Comment se comporte les navigateurs lors de la rencontre d'un tag inconnu ? le supprime t il ...dans ce cas angular ne peut fonctionner ou le laisse t il dans le dom ? Un validateur HTML / CSS n'a plus d 'intêret dans ce cas !! Sinon lire l article sur la comparaison entre directive angular ,polymer , custom Element , Xtag

M'étonnerait qu'un quelconque framework génère des tags à sa sauce, je pense que le code dans ton article est interprété pour générer une image.

En quoi <footer> est plus compréhensible par la machine que <div id="footer"> ?
sur quel point la machine interprète <div id="footer" > et <footer> de façon différente ?
Est ce que le code css et les évènements attachés a ces tag/id change ?

le style peut être créé sur des sélecteurs utilisant le nom des tag des id des class des atrribut et même valeur des attributs .... en quoi au niveau style <footer> et différent de <div id="footer" > si les 2 tag contiennent class="big" ? ( id pour javascript ? )
Modifié par 75lionel (30 Jul 2016 - 10:40)

Les nom des classes et id n'ajoutent aucune sémantique et servent uniquement à la mise en forme.
Tu pourrais remplacer <div id="footer" > par <div id="bananas" > ce serait exactement la même chose par conséquent un robot sera incapable de savoir où se situe le footer dans le code ou même si il y en a un dans la page autrement qu'en essayant de deviner.

Pour le rendu navigateur ça n'a pas d'incidence de faire du html4 ou du html5 ni même de tout coder uniquement avec des <div>, ces balises n'ayant qu'une potentielle valeur informative pour des agents extérieurs (comme Google pour être clair).

Si vous allez sur ce liens qui explique le concept du mot semantic .
Je suis désolé mais entre <div id="footer" > et <div id="df45"> on peut dire que <div> seule n est pas sémantique par rapport à <footer> mais on ne peut pas dire que <div id="footer"> n'est pas sémantique car ici la valeur de l'attribut donne de la sémantique et a un sens aussi claire que <footer> .

remplacer <div id="footer" > par <div id="bananas" > : ce n'est pas la même chose car bananas n'est pas utilisé ici pour donner de la sémantique à sa balise !

google est souvent discret et je ne connais pas de documentation officiel de leur part ou de tiers affirmant que le moteur de recherche de google utilise la balise footer dans leur moteur de recherche ( en interne ou dans leur page de rendu ).Des liens ?

pour moi <footer> n'aucun intéret et n'est qu'une autre façon de faire syntaxiquement les choses ( plus facile a voire dans un arbre de hiéarchie ou seul les noms des tags HTML sont visualisable) mais rien de nouveau fonctionnellement ....

les directives ne sont que des alias comme data-* pour localiser l'endroit ou injecter du code dynamique ( html templates / js css ) .

cordialement
Modifié par 75lionel (30 Jul 2016 - 17:29)

75lionel a écrit :
remplacer <div id="footer"> par <div id="bananas"> : ce n'est pas la même chose car bananas n'est pas utilisé ici pour donner de la sémantique à sa balise !

Je crois que tu mélanges les choses...
Le robot qui lit une balise FOOTER ne se pose pas de questions sur son contenu et sait, de facto, qu'il s'agit d'un pied de page.
Lorsqu'il lit une DIV affublée d'un attribut @id = "footer", rien n'affirme qu'il s'agit d'un pied de page. Un "humain" supposera que c'est bien le cas, parce que dans son dictionnaire le mot "footer" correspond à cette notion en anglais. Par contre, dans une autre langue, celle du concepteur du site, absolument rien ne garantit que le mot "footer" signifie la même chose.
Si tu prends le cas d'un Français qui crée une DIV avec un attribut @id ayant pour valeur "Mon_Pied_de_Page"... ta sémantique n'existe pas. Et pourtant, le Français en question aura bien stocké des infos bas de page dans ce conteneur.
Donc, on résume... si c'est un footer et qu'on est en HTML5, on ne cherche pas la petite bête et on se contente tout simplement d'utiliser la balise FOOTER qui est faite pour ça.
En HTML4, faute d'avoir une telle balise à disposition, on prend une bonne vieille DIV qu'on qualifie avec un @id qui va bien mais qui ne signifiera absolument rien pour un robot.
Les gens de Google et autres moteurs de recherche sont probablement assez futés pour détecter ce genre de structure si l'anglais est utilisé pour l'ID. S'il s'agit d'un nom composé écrit dans une autre langue... c'est foiré.

En quoi ma bananas est moins sémantique que ton footer, je ne comprend pas ?
Qu'est ce qui fait qu'écrire <footer> c'est faire syntaxiquement les choses alors qu'écrire <div id="footer"> non ? Ne vaudrait mieux pas écrire <div id="bananas"> pour ne pas faire syntaxiquement les choses ?
Qu'est qui montre que google n'utilise pas les balises footer ? Qu'il ne le fera pas demain ?
Quid de la balise bananas ?
Pourquoi toutes ces questions alors que tu as juste la flemme de comprendre ou d'appliquer une norme ?
Pourquoi je m'embête à te répondre ?
Modifié par bzh (30 Jul 2016 - 20:42)

Je reviens sur la discussion après un peu de repos . Oui bananas et footer peut être sémantique si le contenu est en rapport au nom du sélecteur. J'ai essayé c'est mots : semantic with css dans le moteur de recherche . Cela relative ce que j'ai dis : david snook , Anna Monus , W3C , rob dodson , chris coyer , ethan muller .

Sinon je change mon avis sur les screen reader en effet certains supportent HTML5 et l article précise que le screenreader énonce par la voix certaines informations en rapport à ces balises . IL est bizarre que HTML5 et ARIA permettent de faire les mêmes choses différement.

Pour les moteurs de recherche ..je n'ai pas trouvé de ressource sur ce sujet .
Modifié par 75lionel (30 Jul 2016 - 21:29)

Je prend la discussion en cours et je ne l'ai parcouru que rapidement. Je n'entrerais pas dans trop de détail dans ma réponse du coup.

75lionel a écrit :
Oui bananas et footer peut être sémantique si le contenu est en rapport au nom du sélecteur.

A partir du moment où un humain est à l'origine du code il ne faut pas exiger la perfection.
Un élément ayant pour fonction d'être un footer sera tout autant sémantiquement juste s'il rattaché par un d'ID "footer" que par une ID nommé "pie_de_pagina" parce que l'intégrateur est hispanophone.

Mais d'une part, comment faire pour que les robots comprennent correctement cette fonction ? Certes nous savons que Google lie les noms de classe. Mais cela conserve une trop grande marge de subjectivité.

La normalisation d'un élément HTML permet de mettre le robot et les différents humains d'accord.

75lionel a écrit :

IL est bizarre que HTML5 et ARIA permettent de faire les mêmes choses différement.

Euh... non.
Dans tous domaines, différentes normes existes et coexistes. Elles sont issues d'organismes pouvant être différentes et pour des causes pouvant être différentes malgré le fait que leurs applications se rejoignent. Il existe énormément de normes.
Et puis un jour, constatant l'usage massif de certaines normes faisant doublon, une unification peut se produire sous forme d'une nouvelle norme.