Avec Chrome sans plugin/extension à installer, ouvrir les Developers Tools (Clic droit sur une page "Inspecter l'élément" Ou Ctrl+Maj+J )
Onglets "Resources", "Graphs" > "Size", puis suffit de regarder le "Total" à droit de la barre.
Regardes le point 6 sur cette page : http://www.chromium.org/devtools/google-chrome-developer-tools-tutorial#resources , tu vera ce que je t'explique visuellement
Onglets "Resources", "Graphs" > "Size", puis suffit de regarder le "Total" à droit de la barre.
Regardes le point 6 sur cette page : http://www.chromium.org/devtools/google-chrome-developer-tools-tutorial#resources , tu vera ce que je t'explique visuellement
Quant au poids total maximum, il n'y en a pas.
La première version du référentiel qualité web Opquast avait fixé des limites, du genre 150ko pour la page d'accueil (largement explosé dans la plupart des sites actuels). Je crois que ce genre de limite a été abandonné dans la V2.
Il n'y a donc pas de limite, mais des recommandations et des principes à suivre:
- Plus c'est léger, mieux c'est.
- Il faut optimiser toutes les images, mais aussi le poids de fichiers externes comme les CSS et JavaScript, éviter d'utiliser trois libs JS différentes, concaténer les fichiers, etc.
- C'est la vitesse d'affichage des pages qui compte. Le poids total est un indicateur de cette vitesse d'affichage, mais il y a pas mal d'autres paramètres (voir YSlow, Google Speed).
- Certains designs très graphiques vont faire des pages très lourdes, optimisation ou pas. Il faut pouvoir éduquer les graphistes, et s'assurer que le design répond aux objectifs du site, y compris les objectifs de vitesse. Suivant les projets, on pourra sacrifier (dans une mesure raisonnable) le poids de la page, tandis que pour d'autre il faudra épurer le design et sabrer certains éléments graphiques.
La première version du référentiel qualité web Opquast avait fixé des limites, du genre 150ko pour la page d'accueil (largement explosé dans la plupart des sites actuels). Je crois que ce genre de limite a été abandonné dans la V2.
Il n'y a donc pas de limite, mais des recommandations et des principes à suivre:
- Plus c'est léger, mieux c'est.
- Il faut optimiser toutes les images, mais aussi le poids de fichiers externes comme les CSS et JavaScript, éviter d'utiliser trois libs JS différentes, concaténer les fichiers, etc.
- C'est la vitesse d'affichage des pages qui compte. Le poids total est un indicateur de cette vitesse d'affichage, mais il y a pas mal d'autres paramètres (voir YSlow, Google Speed).
- Certains designs très graphiques vont faire des pages très lourdes, optimisation ou pas. Il faut pouvoir éduquer les graphistes, et s'assurer que le design répond aux objectifs du site, y compris les objectifs de vitesse. Suivant les projets, on pourra sacrifier (dans une mesure raisonnable) le poids de la page, tandis que pour d'autre il faudra épurer le design et sabrer certains éléments graphiques.
Arsene a écrit :
Il semblerait que l'algo Google tienne désormais compte de la vitesse de chargement comme facteur de classement.
Je confirme. Voir l'information ici.
Florent V. a écrit :
La première version du référentiel qualité web Opquast avait fixé des limites, du genre 150ko pour la page d'accueil
Accessiweb, dans sa version 1, fixait le poids maximum d'une page web à 60ko, tout compris (c'est à dire HTML, CSS, JS, images, ...).
Toutefois, cette limitation draconienne, aujourd'hui abandonnée, n'était à prendre en compte que si on visait une labellisation de niveau Or.
Il peut être réducteur de n'examiner que le poids de la page.
Je pense à certains sites de e-commerce, dont les pages ne sont pas très lourdes mais dont la génération peut prendre plusieurs secondes à causes des requêtes multiples vers la db, d'une configuration peu optimisée et d'un hébergement sous-dimensionné.
De plus, l'optimisation de la page (à poids égal) permet de gagner du temps: compression, sprites, concaténation de fichier, médias servis depuis un autre domaine, etags...
Au delà de ça, la prise en considération de la "cible" est très importante: les visiteurs d'un site de graphiste ou de photographe avec des pages alourdies par les visuels consentiront le sacrifice de l'attente de chargement plus volontiers que pour un site 'lambda'.
Je pense à certains sites de e-commerce, dont les pages ne sont pas très lourdes mais dont la génération peut prendre plusieurs secondes à causes des requêtes multiples vers la db, d'une configuration peu optimisée et d'un hébergement sous-dimensionné.
De plus, l'optimisation de la page (à poids égal) permet de gagner du temps: compression, sprites, concaténation de fichier, médias servis depuis un autre domaine, etags...
Au delà de ça, la prise en considération de la "cible" est très importante: les visiteurs d'un site de graphiste ou de photographe avec des pages alourdies par les visuels consentiront le sacrifice de l'attente de chargement plus volontiers que pour un site 'lambda'.
Florent V. a écrit :
La première version du référentiel qualité web Opquast avait fixé des limites, du genre 150ko pour la page d'accueil (largement explosé dans la plupart des sites actuels). Je crois que ce genre de limite a été abandonné dans la V2.
Dans la version 2, une proposition a été faite de comprendre entre 50 et 100 ko le poids des pages pour les terminaux mobiles ; mais, elle a été refusée.
Mikachu a écrit :
Installe toi l'extension Web Developer pour Firefox, puis ensuite dans le menu "informations" de l'extension, tu as accès à un lien "poids de la page" qui te donnera le poids de tous les composants de la page (documents, images, objets, scripts et feuilles de styles), ainsi que le poids total.
Existe t-il quelque chose de semblable pour Opera ?
-- EDIT -- Ok, j’ai trouvé un outil en ligne : www.webpagetest.org.
RE Edit (one day later) : je n’avais pas vu que depuis la dernière mise à jour d’Opera, il y a maintenant un onglet « Réseau » dans DragonFly (le debugger d’Opera). Les personnes intéressées peuvent le vérifier, et en profiter
Modifié par hibou57 (02 May 2010 - 19:57)
Mikachu a écrit :
Installe toi l'extension Web Developer pour Firefox, puis ensuite dans le menu "informations" de l'extension, tu as accès à un lien "poids de la page" qui te donnera le poids de tous les composants de la page (documents, images, objets, scripts et feuilles de styles), ainsi que le poids total.
Je viens d’essayer l’extension de FireFox : elle affiche le poids compressé mais distingue quand-même le poids non-compressé, qui est affiché à côté. Est-ce que le poids non-compressé a une importance ? Ou est-ce que c’est seulement à caractère informatif ?
-- EDIT --
Je ne sais pas si c’est moi qui en fait un usage maladroit ou pas, mais il me semble que ça ne rapporte pas le poids des images utilisées comme “background-image”. Est-ce que c’est normal ?
Modifié par hibou57 (14 Jul 2010 - 10:59)
hibou57 a écrit :
Est-ce que le poids non-compressé a une importance ?
Oui pour les UA qui n'acceptent pas la compression gzip, mais ils sont rares (même IE6 l'accepte).
Non pour le temps de chargement des ressources concernées avec la plupart des navigateurs actuels.
hibou57 a écrit :
il me semble que ça ne rapporte pas le poids des images utilisées comme “background-image”
Je n'ai pas fait de tests détaillés, mais depuis les versions 3.0+ ou peut-être 3.5+ de Firefox, j'ai des soucis de fiabilité avec certaines fonctions de la Web Developer Toolbar. Peut-être des changements d'API qui provoquent des bugs non corrigés. L'outil "poids de la page" en particulier me semble très peu fiable, du moins sur mon profil Firefox principal. Peut-être aussi des problèmes de compatibilité d'extensions.
Florent V. a écrit :
Je n'ai pas fait de tests détaillés, mais depuis les versions 3.0+ ou peut-être 3.5+ de Firefox, j'ai des soucis de fiabilité avec certaines fonctions de la Web Developer Toolbar. Peut-être des changements d'API qui provoquent des bugs non corrigés. L'outil "poids de la page" en particulier me semble très peu fiable, du moins sur mon profil Firefox principal. Peut-être aussi des problèmes de compatibilité d'extensions.
J’ai remarqué une étrangeté effectivement : sur des pages ouvertes depuis un répertoire, donc sans compression, il m’affichait un poids compressé (je ne sais pas compressé par qui ou par quoi), et en plus, à côté, un poids non-compressé qui était inférieur au poids compressé qu’il indiquait (1KB de différence).
Sinon, as-tu bien vidé et désactivé le cache au préalable ? Parce que sans cela, les résultats sont aussi un peu étrange : il me parlait d’un CSS de 0KB (de toute façons les nouveaux visiteurs ne peuvent pas encore avoir de cache, alors autant toujours faire comme ça)
Modifié par hibou57 (14 Jul 2010 - 12:59)
hibou57 a écrit :
Sinon, as-tu bien vidé et désactivé le cache au préalable ?
Non, mais je ne devrais pas avoir à m'en soucier pour obtenir un résultat correct. L'outil est bugué, et son auteur n'a sans doute pas le temps de corriger tous les bugs. Pour ma part je suis passé à Web Inspector (intégré à Safari, Chrome, Chromium) pour obtenir ce type d'information.
apericube a écrit :
Web Inspector est bizarre chez moi, selon lui les images pesent toutes 0Kb
Je crois que c'est ce qui s'affiche quand, pour une requête, le navigateur envoie une requête avec un header If-Modified-Since, et le serveur répond avec un code HTTP 304 (et donc pas de contenu dans la réponse).
Tu peux vider le cache au préalable ou, dans Chrome, rafraichir la page avec un Ctrl+Shift+R (ou Cmd+Shift+R sur Mac).