En quoi le respect des standards améliore la vitesse de chargement ?

Bonjour à tous,

tout est dans le titre.

Je suis en train de réaliser une étude et je vois sur plusieurs sources (exemple :ici ) que l'application des standards W3C améliore la vitesse de chargement des pages d'un site.
Quand pensez-vous et comment cela est - il possible ?


merci d'avance

Bonjour,

C'est surtout qu'une page respectant les standard à moins d'éléments inutiles dans son code et privilégie la séparation de la forme (CSS) et du contenu (HTML). Donc oui, une page bien conçue est généralement plus rapide.

Salut,

Lorsque structure (HTML), forme (CSS) et comportement (JavaScript) sont séparés par des fichiers distincts, le navigateur aura la faculté de mettre en cache les fichiers CSS et JavaScript, tout comme les images, et n'aura plus qu'à recharger le HTML en cas de nouvelle consultation de la page ou en cas de consultation d'une page faisant appel aux mêmes CSS et JavaScript. Bref, c'est bon pour les performances.

Bonjour,

je pense à tout moment de la journée et je ne suis pas neurologue ou neurobiologiste donc j'aurai du mal à t'expliquer comment c'est possible

Démonstration par l'absurde : un site qui utilise des spacer.gif, des tables imbriquées, des CSS en ligne (attribut HTML style="" ou élément style) et idem pour le JS ne sera pas aussi performant au chargement de la page.
GROS bonus de lenteur sous IE si le site utilise les expression en "CSS" (en fait du script bien lent) et les filtres propriétaires alphaloader et cie

Tu peux regarder Yahoo! YSlow et Google Page Speed et imaginer l'inverse en fait

Merci de vos réponses.

La piste de la séparation du contenu et du style est vérifié ainsi que celle de l'élimination des balises inutiles.
Connaissez un moyen de connaitre le traitement css correspondant au comportement naturel d'un <H1>.
En gros, quelle est le code css appliqué à la balise <H1> pour obtenir son comportement naturel ?
Modifié par zicolas (01 Aug 2011 - 10:06)

zicolas a écrit :

En gros, y a t-il un équivalent css de la balise H1.

Ça ne veut absolument rien dire.

Correction faite. J'espere que c'est plus clair...

Hello,

On ne peut pas vraiment parler d'aspect naturel d'une balise, mais plutôt une feuille de style appliquée par défaut sur chaque navigateur… Et il y a des différences suivant les configurations utilisées.

Après bien sûr, <strong> donne du gras sur tous les navigateurs visuels, mais on sait bien qu'on peut modifier l'aspect de ce renforcement en CSS…

Maintenant avec l'inspecteur de Firebug (sur Firefox, donc), sur un élément h1 sans CSS supplémentaire, j'obtiens ce qui suit en mode « Calcul » :

font-family : serif
font-size : 32px
font-weight : bold
font-style : normal
color : #000000
text-transform : none
text-decoration : none
letter-spacing : normal
word-spacing : 0
line-height : 38.4px
text-align : start
vertical-align : baseline
direction : ltr
background-color : transparent
background-image : none
background-repeat : repeat
background-position : 0 0
background-attachment : scroll
opacity : 1
width	: 100%
heigh : 100%
top : auto
right : auto
bottom : auto
left : auto
margin-top : 21.4333px
margin-right : 0
margin-bottom : 21.4333px
margin-left	: 0
padding-top	 : 0
padding-right : 0
padding-bottom: 0
padding-left : 0
border-top-width : 0
border-right-width : 0
border-bottom-width : 0
border-left-width : 0
border-top-color : #000000
border-right-color : #000000
border-bottom-color : #000000
border-left-color : #000000
border-top-style : none
border-right-style	 : none
border-bottom-style : none
border-left-style : none
position : static
display : block
visibility : visible
z-index : auto
overflow-x : visible
overflow-y : visible
white-space : normal
clip : auto
float : none
clear : none
-moz-box-sizing : content-box
cursor : auto
list-style-image : none
list-style-position :outside
list-style-type : disc
marker-offset : auto

Tu peux faire de même sur Opéra avec Dragonfly et avec l'inspecteur de Google Chrome et tu pourras mettre en évidence les possibles différences de rendu par « défaut » entre les navigateurs…
Modifié par audrasjb (01 Aug 2011 - 10:21)

Ah parfait, c'est exactement ce que je recherche.
Plus qu'une réponse, une manière de trouver la réponse.
Merci @audrasjb

zicolas a écrit :
Connaissez un moyen de connaitre le traitement css correspondant au comportement naturel d'un <H1>.

Dans Firefox avec Firebug, tu inspectes les styles d'un élément H1 et dans Firebug tu actives l'option "Show user agent CSS".
Tu peux aussi consulter directement l'URL resource://gre-resources/html.css dans Firefox. (Certains autres navigateurs ont des mécanismes semblables je crois.)
Modifié par fvsch (01 Aug 2011 - 12:34)

zicolas a écrit :
Connaissez un moyen de connaitre le traitement css correspondant au comportement naturel d'un &lt;H1&gt;.

Le w3c avait sorti à titre d’information une page de style par défaut.

Pour ce qui est de la conformité aux standards du web, je vais aller à contre-courant de ce qui a été dit. Une page valide pour le w3c ne veut absolument pas dire qu’elle se chargera rapidement. Une page au contenu et à la mise en forme mélangés avec son lot de balises inutiles pourra très bien être valide au sens du w3c.
Le but du w3c est de rendre compatible les technologies web. Utilisez-vous une fourchette pour manger la soupe ?
Modifié par adrien881 (01 Aug 2011 - 16:25)

adrien881 a écrit :
Une page valide pour le w3c ne veut absolument pas dire qu’elle se chargera rapidement. Une page au contenu et à la mise en forme mélangés avec son lot de balises inutiles pourra très bien être valide au sens du w3c.

Les validateurs du W3C ne vérifient que la validité syntaxique. Autrement dit, c'est le même problème que la phrase D'incroyables idées vertes dorment furieusement : la phrase est grammaticalement correcte, tout en étant dénuée de sens.

Quant au rendu par défaut sous les navigateurs, il y a aussi cet outil disponible sur Alsacréations.