28172 sujets

CSS et mise en forme, CSS3

Balises H1 H2... qui posent des problemes !!

Bonjour à tous,
Je me permet de relancer un thème qui a été traité et retraité sur ce forum et pourtant, malgré mes recherches sur ce forum, je n ai rien trouvé qui pourrait répondre a ma question...

Voila mon problème:
Bien que l'intérêt des balises h1 h2 h3 etc.. Est plus que discutable de nos jours notamment avec google, j aimerai néanmoins en mettre par endroits.
Seulement, quand je rajoute des balises H1 par exemple autour d'une partie de mon code html que j'estime importante, l'aspect visuel du contenu de la balise change radicalement et devient énorme ce qui bouleverse (pour ne pas dire ruine) la mise en forme de ma page html.
Comment faire pour rajouter simplement ces balises dans un unique but de référencement afin de pouvoir conserver la mise en forme originelle a l identique?

Je sais que c'est une question de débutant...merci encore pour votre indulgence et votre compréhension...et merci par avance pour vos réponses.
Smiley biggrin
Modifié par lerouxjul (16 Feb 2008 - 12:15)
Modérateur
Salut, Smiley smile

lerouxjul a écrit :
Bien que l'intérêt des balises h1 h2 h3 etc.. Est plus que discutable de nos jours notamment avec google, j aimerai néanmoins en mettre par endroits.
Que penses-tu d'un écrivain qui mettrait des niveaux de titre comme bon lui chante dans le but de mieux vendre son livre ?
D'ailleurs, achèterais-tu ce livre sous prétexte qu'il y a plus de gros titres que dans les autres ?
a écrit :
Comment faire pour rajouter simplement ces balises dans un unique but de référencement
Cette démarche est érronée.
Les titres servent à rendre ton document plus clair en définissant une logique de structure.
La mise en page, quant à elle, est complètement indépendante. Les navigateurs attribuent des styles par défaut mais rien ne t'empêche, via CSS, de les remodifier.
Bonjour,

a écrit :
Bien que l'intérêt des balises h1 h2 h3 etc.. Est plus que discutable de nos jours notamment avec google, j aimerai néanmoins en mettre par endroits.


Tu dois avoir un problème de compréhension sur ce que sont ces niveaux de titre. Google n'a rien à voir avec la pertinence de leur utilisation:
http://www.la-grange.net/w3c/html4.01/struct/global.html#edef-H1 a écrit :

Un élément de titre décrit brièvement le sujet de la section qu'il introduit. Les agents utilisateurs peuvent utiliser les informations des titres pour, par exemple, construire automatiquement la table des matières du document.

Il existe six degrés de titrage dans HTML, l'élément H1 représentant le titre le plus important et H6 le moins important. Les navigateurs visuels restituent généralement les titres les plus importants dans un corps plus grand que les moins importants.


Ces niveaux de titre apporte une structure à ton document. C'est tout. Ce n'est pas une martingale SEO Smiley cligne

a écrit :
Seulement, quand je rajoute des balises H1 par exemple autour d'une partie de mon code html que j'estime importante, l'aspect visuel du contenu de la balise change radicalement et devient énorme ce qui bouleverse (pour ne pas dire ruine) la mise en forme de ma page html.
Comment faire pour rajouter simplement ces balises dans un unique but de référencement afin de pouvoir conserver la mise en forme originelle a l identique?


Pour gérer la mise en forme des hn il faut se tourner vers CSS qui est fait pour çà. A noter que le fait de mettre graphiquement un contenu jugé important comme un titre introduisant une section n'est peut-être pas si bête. Smiley cligne

En complément un peu de lecture: Le rendu par défaut des éléments HTML
Modifié par Igor (16 Feb 2008 - 18:16)
Je comprend ce que tu veux dire...
...mais la mise en forme et la structure de toutes mes pages est déjà travaillée et absolument correcte. Je n'ai besoin des balises dans un but unique de référencement dans ce cas précis. Je le répète la mise en forme n'est pas a changer. Elle est parfaite à mon gout.
...et donc j'aimerai seulement que la navigateur comprenne que je ne veux pas modifier la mise en forme actuelle qui est déjà structurée plutôt que de partir du principe qu'il va me la changer et que je devrai rechanger derrière et adapter le code css en conséquence...

En gros, ce que je cherche, c'est un code css qui dit cela:

h1 {
Ne pas changer la mise en forme
}

h2 {
Ne pas changer la mise en forme
}
lerouxjul a écrit :
Je comprend ce que tu veux dire...
...mais la mise en forme et la structure de toutes mes pages est déjà travaillée et absolument correcte. Je n'ai besoin des balises dans un but unique de référencement dans ce cas précis. Je le répète la mise en forme n'est pas a changer. Elle est parfaite à mon gout.


C'est donc que tu n'as pas tout compris Smiley sweatdrop

On pourrait voir un exemple de page correctement structurée sans niveaux de titre et à laquelle on rajoute des h1 pour "un but unique de référencement". Je suis assez currieux de voir çà Smiley smile .
<bande son = "crouîîîc... crouîîîc..." title="bruit de la lame du couteau sur la meule" />

Non, bon, sérieusement: il y a en effet de très fortes chances que les pages de lerouxjul soient structurées n'importe comment et, en réalité, beaucoup moins référençables que s'il s'y était bien pris à la base. Et ses h1 ne vont rien arranger.

Mais après tout.... Un site de plus ou de moins dans ce cas, quelle importance ?

Donc: appliquer aux élémentsh1 les mêmes styles qu'aux éléments qu'ils vont remplacer, en précisant si nécessaire des choses comme:
- font-size: ...
- margin: ...
- font-weight: ...

<edit>Tiens, en fait: c'est bon d'écrire de temps en temps des choses sans aucun rapport avec la qualité Smiley ravi </>
Modifié par Laurent Denis (16 Feb 2008 - 19:00)
Igor a écrit :


C'est donc que tu n'as pas tout compris Smiley sweatdrop

On pourrait voir un exemple de page correctement structurée sans niveaux de titre et à laquelle on rajoute des h1 pour "un but unique de référencement". Je suis assez currieux de voir çà Smiley smile .


Les Hn ne sont pas l'unique moyen de mettre en forme une page...on peut très bien mettre en forme une page en utilisant des feuilles de style avec des titres, des paragraphes, des soustitre, des tableaux et avoir une mise en page agréable a l'oeil et bien construite sans forcément utiliser des balises Hn, non?
Modifié par lerouxjul (16 Feb 2008 - 19:07)
Je ne vois pas en quoi l'intérêt des h1 à h6 est discutable, à partir du moment où ils sont utiles à la structuration du contenu, en le divisant en sections. Sinon, autant ne plus faire, dans les notes de cours, des grands 1 comportant des petits 1 qui comportent à leur tour des petits a...

Ce n'est pas parce que certains abusent des h1, au prix d'un déni de balisage sémantique, dans l'espoir de mieux se faire remarquer par les robots des moteurs de recherche qu'il faut rendre discutable l'intérêt de cet élément.

Autrement dit, une utilisation à bon escient des éléments HTML ne causera jamais de soucis avec Google. Smiley cligne
lerouxjul a écrit :
Les Hn ne sont pas l'unique moyen de mettre en forme une page...on peut très bien mettre en forme une page en utilisant des feuilles de style avec des titres, des paragraphes, des soustitre, des tableaux et avoir une mise en page agréable a l'oeil et bien construite sans forcément utiliser des balises Hn, non?

Je crois que tu confonds présentation et mise en forme (rôle des CSS) et structuration du contenu (rôle du (X)HTML). Smiley rolleyes
Oui, il y a pas mal de confusions à vue de nez.

Les élément h1, h2, ..., h6 sont des éléments HTML qui servent à indiquer des titres de section (c'est à dire qu'un titre introduit le contenu qui le suit) dans une page HTML. Un titre hN, à l'instar d'un paragraphe p, ne peut accueillir comme contenu que du texte brut et des éléments de type en-ligne (span, a, em, etc., mais pas de p ou div ou table...).

Pour rappel, il n'y a pas d'autre manière d'indiquer un titre (en dehors du titre du document) en HTML.

Si on utilise par exemple un h1 (balises <h1> et </h1>), on ne pourra donc pas y mettre des blocs complets. C'est un codage invalide et le résultat d'un navigateur à l'autre peut être assez aléatoire -- quant à Google et ses amis, ça ne m'étonnerait pas qu'ils ignorent les h1 dont le contenu leur semble suspect: blocs, liens à tout va, contenu très long, etc.

Maintenant, la question balisage et mise en forme: on peut très bien prendre un élément ne donnant pas ou peu d'information sur son contenu (un span, un p, un div) et l'afficher comme un titre en lui attribuant des styles CSS qui donnent cet effet. À l'inverse, on peut très bien avoir un titre (h1, h2, etc.) et l'afficher comme du texte «normal» en lui attribuant des styles CSS qui donnent cet effet. Mais l'intérêt de la manoeuvre est plutôt douteux.
Modifié par Florent V. (16 Feb 2008 - 20:24)
lerouxjul a écrit :

Les Hn ne sont pas l'unique moyen de mettre en forme une page...on peut très bien mettre en forme une page en utilisant des feuilles de style avec des titres, des paragraphes, des soustitre, des tableaux et avoir une mise en page agréable a l'oeil et bien construite sans forcément utiliser des balises Hn, non?


Vu comme çà c'est pas faux. Tu peux même truffer ta page de h1 et les masquer et/ou les afficher par le biais de la propriété display en CSS.


Laurent Denis a écrit :
<bande son = "crouîîîc... crouîîîc..." title="bruit de la lame du couteau sur la meule" />

C'est vrai qu'une petite musique d'arrière plan dans la page...
oui, je ne pense que l'on ne se comprend pas...
ON confond html, mise en forme et esthétique...

Car cette pages de ce site par exemple, n'utilise pas de balise Hn par exemple et la mise en forme visuelle est correcte et ethétique...
http://www.igrafy.com/content/view/16/28/
On peut donc dire que, s'il n'y a pas de but de référencement, on peut se passer des balises Hn, non?
lerouxjul a écrit :
On peut donc dire que, s'il n'y a pas de but de référencement, on peut se passer des balises Hn, non?

Si le seul but est l'affichage visuel, oui.

Mais voici pourquoi utiliser les titres Hn peut être intéressant:

1. Parce que ça allège un peu le code HTML et ça le rend plus simple à relire (<h2>Mon titre</h2> plutôt que <div class="titre_niveau_2">Mon titre</div>).
2. Parce que le résultat avec feuille de styles désactivée sera beaucoup plus lisible.
3. Parce que ça renfore très nettement l'accessibilité d'une page.

Mais bon, si rien de tout ça n'est dans tes objectifs, ça n'a pas forcément d'intérêt pour toi. Smiley smile

PS: la page que tu indiques comme exemple utilise le code suivant pour baliser ses titres:
<table style="color: rgb(255, 255, 255); background-color: rgb(0, 0, 0); width: 68px; height: 25px; text-align: left; margin-left: auto; margin-right: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="68">
	<tbody>
		<tr>
			<td style="white-space: nowrap;" align="center"><span style="font-family: Arial; color: rgb(255, 255, 255);">&nbsp;&nbsp;<img style="width: 10px; height: 10px;" src="images/rondr.gif" alt="">&nbsp;
			Nos Plus
			...&nbsp;&nbsp;&nbsp;&nbsp;</span></td>
		</tr>
	</tbody>
</table>

Alors qu'on aurait pu avoir:
<h2><span>Nos Plus...</span></h2>
et à peu près quatre lignes de CSS.
Modifié par Florent V. (16 Feb 2008 - 20:31)
Bonsoir,

Vous ne vous comprenez pas parce que tu parles de rendu affiché dans un navigateur, là où tes interlocuteurs de parlent de la structure (invisible) de tes contenus. En d'autres termes, tu appartient à la très grande frange du Web qui utilise le langage HTML comme un format de présentation à l'écran, et eux à la petite frange qui l'utilise comme un format de structuration de l'information. C'est une histoire aussi vieille que le Web, ça.

De ton point de vue, les éléments HTML ont effectivement le rôle que tu veux bien leur prêter. Par exemple, les titres Hn peuvent très bien être supposés servir au référencement. Quelqu'un d'autre dira qu'ils servent à écrire en plus gros. D'autres encore pourraient aussi bien dire qu'ils servent à repousser le mauvais sort. Tout cela est tout aussi valable dans ce contexte où, en fait, les éléments HTML ne servent pas à grand-chose pour la plupart d'entre eux.

Du point de vue de tes interlocuteurs, en revanche, ces éléments servent uniquement à baliser quelques mots placés en titre d'une partie du contenu. C'est là tout l'étendue de la "sémantique HTML".

Là où vous pouvez trouver un terrain de rencontre, c'est que ces quelques mots que tu pourrais être amené à avoir placé en titre de certaines parties de ton contenu pourraient très bien être aussi pertinents en terme de référencement.
Modifié par Laurent Denis (16 Feb 2008 - 20:43)
Laurent Denis a écrit :

Là où vous pouvez trouver un terrain de rencontre, c'est que ces quelques mots que tu pourrais être amené à avoir placé en titre de certaines parties de ton contenu pourraient très bien être aussi pertinents en terme de référencement.


Le plus efficace serait de se concentrer sur les contenus avant de reprendre les légendes urbaines html appliquées au référencement. Si on en arrive à un stade d'un projet web où l'on considère que le placage d'une balise est nécessaire au référencement (positionnement ?) c'est qu'on a peu de confiance dans le contenu que l'on s'apprête à mettre en ligne.
Là on se comprend mieux...
Revient l'éternelle question de l'intérêt des Hn dans le positionnement Google...Les liens entrants sont probablement bien plus utiles ainsi que la qualité et la pertinence du contenu...
lerouxjul a écrit :
Là on se comprend mieux...
Revient l'éternelle question de l'intérêt des Hn dans le positionnement Google...Les liens entrants sont probablement bien plus utiles ainsi que la qualité et la pertinence du contenu...


Donc les utiliser pour ce qu'ils sont et non pas par ce que l'on souhaiterait qu'ils soient Smiley cligne

Par ailleurs ce forum ne s'intéresse pas aux "techniques" liées au référencement et au positionnement.
http://www.webrankinfo.com/ oui.
Modifié par Igor (17 Feb 2008 - 11:04)
Sujet clos
Aller à