cooloweb Posté 11 Juillet 2004 Auteur Posté 11 Juillet 2004 heu j'ai mis les images au format gif et leur poid ont diminué d'environ 10* + quelques octets avec Png... je suis trop content j'comprends pas ce que j'ai fais j'étais persuadé que le format habituelle pour les sites était le jpg quand j'aurai fini le poid total de mes images devrait donc passer de 600 à 60 je commence à comprendre pourquoi le taux de visite était de 72% ...
cooloweb Posté 11 Juillet 2004 Auteur Posté 11 Juillet 2004 je commence à comprendre pourquoi le taux de visite à une page était de 72% ...
ElMoustiko Posté 11 Juillet 2004 Posté 11 Juillet 2004 Pour les repeat-x et repeat-y, ca sert a repeter une image d'arriere plan (background) selon l'axe des abscices (X) ou des ordonnée (Y), c'est a dire horizontalement et verticalement Par exemple je vois que pour ton menu tu as utilisé une image en degradé de bas en haut, si tu regarde bien (en faisant abstraction du texte) tu remarqueras que l'image est la meme de gauche a droite, c'est a dire que si tu repete l'image horizontalement (repeat-x) tu obtiendras le meme motif, il parait facile de prendre une image de 1px de large (oui oui 1px de large) contenant ton degradé, et de la repeter horizontalement, ainsi tu obtient le meme rendu avec une image netement plus petite Tu n'as plus ensuite qu'a ajouter le texte sur le fond te le tour et joué Si je reprend tout ca en css : (supposons que tes menus sont contenu dans un element ayant pour classe menu (class="menu") .menu a { display: block; /*pour permetre de dimensionner tes cellules*/ width: 100px; line-height: 25px; background: url(tonimagede1pixeldelarge.gif) repeat-x; } et en html : <a href="tonlien">Le titre du lien</a> Tu vois le principe ? @++
cooloweb Posté 11 Juillet 2004 Auteur Posté 11 Juillet 2004 Super ! mes images ne pèsent plus que 116ko 207 en tout croyez vous que je devrais encore baisser où est-ce que ça va comme ça ?
Denis Posté 12 Juillet 2004 Posté 12 Juillet 2004 Je suis surpris de ce que tu me dis ! je pensais que tout le monde utillisait le jpg Une petite recherche sur Google m'a permi de te trouver un article pas trop mal expliquant les différences entre les deux formats. http://actuel.fr.selfhtml.org/articles/graphisme/gif-jpeg/ Bravo, pour ton taux de compression, c'est déjà une belle réussite. Je ne crois pas que tu devrais tenter de les compresser davantage, je fais pleinement confiance à pngoptimizer pour avoir appliqué le taux correct sur tes images. Maintenant, si tu veux faire descendre ton poids de page plus bas encore, c'est sur la structure même qu'il faudra se pencher. Autrement dit, remplacer ou joindre certaines images pour diminuer le nombre de requêtes http et favoriser l'utilisation de CSS pour remplacer certaines autres. Mais le plus important à ce point, ce n,est plus tellement tes images, mais bien ton HTML. Si tu entreprend de virer tous tes tags FONT et autres éléments de présentation pour les remplacer par des équivalences CSS, au bas mot, tu diminuera encore de 50% le poids de ta page... Mais là, on entre dans quelque chose d'un peu plus corsé. Te sens-tu d'attaque ? Si oui, il est temps de commencer à lire les articles que je t'ai proposé lors de mon premier message : http://openweb.eu.org/css/ http://www.alsacreations.com/articles/ Bonne chance ! Reviens quand tu auras des questions.
Vincent Posté 12 Juillet 2004 Posté 12 Juillet 2004 Super ! mes images ne pèsent plus que 116ko 207 en tout croyez vous que je devrais encore baisser où est-ce que ça va comme ça ? Je pense aussi que les images ont assez maigri comme ca, faut pas non plus les rendre rachitique Pour finir avec les images et avant d'entamer les CSS, n'oublies pas de rassembler l'ensemble de tes boutons en 1 : - toutes les images commencant par -http://www.cooloweb.net/Images/blah212 - toutes les images commencant par -http://www.cooloweb.net/Images/Fond gain espéré : 5*5.7ko + 7*2.1ko = 43.2ko
Xavier Posté 12 Juillet 2004 Posté 12 Juillet 2004 Si je puis me permettre de revenir aux PNGs : si tu les a compressés à partir des jpg, comme le jpg entraine une perte de qualité, ça entraine une forte augmentation de la taille de ces images Si tu as les originales non compressées, tu risque de pouvoir gagner encore de la place en les compressant directement...
LaurentDenis Posté 12 Juillet 2004 Posté 12 Juillet 2004 Hum... Si tu souhaites aller plus loin, il faut regarder un peu le code des pages à présent. Comme documentation, je te recommande Ecrire une page Web, fait par les élèves de l'ENS, qui donne toutes les bases dans un langage... humain Il semble que tu aies beaucoup procédé par copié-collé de pages ou de bribes de codes que tu as pris en exemple. C'est une très bonne façon de commencer, mais il faudrait y mettre un petit peu d'ordre. En l'état, ta page d'accueil (par exemple) comporte 3 sections <html>...</html>, 3 sections <body>...</body> et 4 sections <head>...</head>, ce qui est un peu trop En effet, abondance de biens ne nuit pas, mais... une page HTML ne peut comporter qu'une section <html>...</html> unique, et dans celle-ci : - une section <head>...</head> unique pour des informations non directement affichées par le navigateur dans la fenêtre, mais nécessaires à la bonne restitution de la page, - une section <body>...</body> unique pour ce qui sera affiché. Donc typiquement : <html> <head> ici pleins de lignes de code </head> <body> ici pleins de lignes de code </body></html> Avant d'aborder des choses commes XHTML, CSS et autres, l'étape suivante me semble donc de déplacer un peu les bouts épars et d'éliminer les morceaux inutiles. Tes pages y gagneront à nouveau en poids, et tu pourras aborder le code avec quelque-chose de lisible (pour l'instant, tu aurais beaucoup de mal à t'y retrouver). Pour t'aider, voici à quoi devrait ressembler le résultat dans un premie temps: <html> <head> -ici un seul <title>CooloWeb.net : Le site généraliste de l'internaute et du webmaster classé en 8 thèmes</title> -ici plein de <meta... -ici un seul <style>...</style> -ici plein de <script>...</script> </head> <body background="... -ici plein de lignes de code </body></html>
Denis Posté 12 Juillet 2004 Posté 12 Juillet 2004 Hum... Si tu souhaites aller plus loin, il faut regarder un peu le code des pages à présent. Comme documentation, je te recommande Ecrire une page Web, fait par les élèves de l'ENS, qui donne toutes les bases dans un langage... humain Ouais, merci pour cette ressource Laurent, je ne la connaissais pas. Approche très intéressante pour présenter HTML.
PwetPwet Posté 12 Juillet 2004 Posté 12 Juillet 2004 Denis - Assainisseur Web lol, c'est tellement vrai que ... ... je sais plus quoi dire
Denis Posté 13 Juillet 2004 Posté 13 Juillet 2004 lol, c'est tellement vrai que ... je sais plus quoi dire Veux-tu que je te propose une phrase ou deux ?
LaurentDenis Posté 13 Juillet 2004 Posté 13 Juillet 2004 Ouais, merci pour cette ressource Laurent, je ne la connaissais pas. Approche très intéressante pour présenter HTML. Le mérite revient en fait à Cédric Malherbe qui l'a signalé en juin dernier sur la liste de l'AFUL.
Denis Posté 13 Juillet 2004 Posté 13 Juillet 2004 Qu'il en soit remercié alors. C'est une excellente mise en contexte.
Sujets conseillés
Veuillez vous connecter pour commenter
Vous pourrez laisser un commentaire après vous êtes connecté.
Connectez-vous maintenant