En effet, la différence est très peu flagrante. Je me méfie trop en général de la perte de qualité, c'est pour ça
J'ai aussi exporté au JPG, j'ai obtenu une image à +700ko environ. Mais je vais garder la tienne
J'arrive pas à aussi bien compresser avec Photoshop, c'est normal ?
EDIT: Je supprime juste au cas où hein, merci d'avoir pris la peine de m'envoyer les liens
Photoshop sait très bien compresser les images, ensuite tout dépends des options que tu sélectionnes.
N'hésite pas à utiliser les vues multiples lors d'un export (ctrl+alt+shift+s) pour tester différentes combinaisons.
Tu devrais tomber sur cette fenêtre, avec les réglages sur la droite, et les poids / temps de chargement estimé en fonction de la connexion choisie en dessous de chaque vignette
Oh merci bien, je ne connaissais pas cette fonctionnalité !
J'ai compris pourquoi ça ne compressait pas plus que ça, mais du coup, Alpha, pour avoir une image à 128ko, tu as du beaucoup la compresser non ? Ça équivaut à 25% de qualité sur Photoshop, et on voit clairement que la qualité est moindre ! Comment as-tu fait pour autant compresser sans trop détériorer l'image ?
Elle faisait 184Ko mon image, pas 128Ko Ce qui correspond plutôt à une qualité "50" dans Photoshop.
Ensuite je n'avais pas utilisé Photoshop, donc les % de taux de qualité ne correspondent pas forcément entre chaque outil.
Oui, enfin bref, tu l'as bien compressé !
Qualité 50 tu dis ? Je regarderai le poids que ça fait avec cette qualité, mais visiblement Photoshop compresse moins bien que le logiciel que tu as utilisé !
Bon malgré le fait que le soucis semble régler avec un logiciel existant j'ai fait malgré tout un petit programme pour extraire les class et les id présent sur une page web (vu que j'avais du temps a perdre )
Plus qu'a comparer ça avec les selecteur présent sur les fichiers CSS et afficher ceux en trop et ce sera pleinement utilisable
Version actuel:
Sinon, Alpha, j'ai fait un test avec Webstorm, et j'ai une question :
Il me dit que l'ID "banner" n'est jamais utilisé. Je le supprime donc, mais juste en dessous de cet élément, dans le CSS, j'ai aussi par exemple "#banner p", ou "#banner h2".
Je suppose que je peux les supprimer aussi du coup, mais j'ai un doute :/
EDIT : Aussi, j'ai l'impression qu'il faut être très vigilant, parce qu'il m'a dit qu'un élément CSS était inutilisé alors qu'il permet d'avoir une petite animation lorsque l'on passe la souris sur les lien de la barre de menu.
Et aussi, j'ai l'impression qu'il trouve trop peu de ID/Class inutilisés. Il m'en a trouvé qu'un 10-15aine sur 2 feuilles CSS, mais je jurerai qu'il y en a plus :/
Comme je le disais dans mon premier message, l'outil aura du mal à détecter les usages dynamiques. L'animation de ton menu est provoquée à priori par l'ajout dynamique (c'est à dire que c'est du Javascript qui va l'ajouter) d'une classe sur l'élément lorsque tu passes la souris dessus (je pense que tu parles de l'apparition du sous-menu "Missions" ?).
Donc oui, il faut être prudent parfois (donc tout supprimer d'un coup est probablement une mauvaise idée).
Sinon, tu peux utiliser le raccourci CTRL + SHIFT + F pour faire une recherche globale dans tout le projet. Tape le nom du selector en question dans la boîte de dialogue qui s'ouvre et sélectionne bien "Whole Project" dans le scope. De manière optionnelle, tu peux aussi filtrer les résultats pour n'afficher que les occurrences dans les fichiers .html en cochant "File mask(s)" et en sélectionnant le filtre pour les fichiers html (*.html). Peut-être que laisser sans filtre et regarder les résultats dans les fichiers JS te permettra de voir si c'est utilisé dans du javascript.
Regarde si la chaîne de caractère est utilisée sur une balise html, ça te permettra de savoir si un selector est bien utilisé ou pas.
Si tu veux vérifier une classe/id CSS en particulier, tu peux aussi faire un clic droit sur le nom du selector dans le fichier CSS et choisir Find Usages.
Concernant les résultats que tu trouves "trop peu nombreux", à priori tu peux faire confiance à la recherche lorsqu'il pense qu'une classe est vraiment utilisée (le contraire faut être prudent comme on le disait plus haut).
Après, peut-être que certaines classes sont utilisées dans des fichiers HTML que tu n'utilises pas réellement.
En enregistrant la page d'accueil de ton site et en lançant l'analyse de code, il me trouve 152 classes/id non utilisées. Par contre il n'a pris en compte que la page d'accueil dans mon cas (seule page que j'ai récupérée), ça ne veut pas dire que certaines classes ne sont pas utilisées sur d'autres page. Mais bon, je vais pas aspirer ton site tout entier pour vérifier non plus
Non,je parlais de tous les liens, et je ne pense pas que le javascript intervienne dedans. Enfin bref, je vais essayer pour ta technique, je vais attendre le logiciel de MrTogimaro (si il veut bien le partager ), mais sinon je ne vais pas insister, j'ai plus peur de faire n'importe quoi
En ayant beaucoup allégé l'image, j'ai déjà beaucoup réduit le temps de chargement, c'est déjà ça !
Merci pour tout en tout cas !
Bien sur que le partagerai
Par contre je suis en train de finir l'analyse des selecteurs CSS, utilise tu des Media Queries par hasard? Ou alors Less.js? Car ça risque de me complexifier le travail pour l'instant (car ça fait intervenir des accolades dans d'autre accolades et donc je devrai gérer ce genre de truc et ça rajouterai du temps de travail, à termes ce sera implémenter bien sur)
(Accessoirement l'analyse des balises en HTML ne fonctionne que si tu utilise des guillemet ou des apostrophes pour délimiter le ou les noms des class/id d'une balise)
En effet, la différence est très peu flagrante. Je me méfie trop en général de la perte de qualité, c'est pour ça
J'ai aussi exporté au JPG, j'ai obtenu une image à +700ko environ. Mais je vais garder la tienne
J'arrive pas à aussi bien compresser avec Photoshop, c'est normal ?
EDIT: Je supprime juste au cas où hein, merci d'avoir pris la peine de m'envoyer les liens
Photoshop sait très bien compresser les images, ensuite tout dépends des options que tu sélectionnes.
N'hésite pas à utiliser les vues multiples lors d'un export (ctrl+alt+shift+s) pour tester différentes combinaisons.
Tu devrais tomber sur cette fenêtre, avec les réglages sur la droite, et les poids / temps de chargement estimé en fonction de la connexion choisie en dessous de chaque vignette
Oh merci bien, je ne connaissais pas cette fonctionnalité !
J'ai compris pourquoi ça ne compressait pas plus que ça, mais du coup, Alpha, pour avoir une image à 128ko, tu as du beaucoup la compresser non ? Ça équivaut à 25% de qualité sur Photoshop, et on voit clairement que la qualité est moindre ! Comment as-tu fait pour autant compresser sans trop détériorer l'image ?
Elle faisait 184Ko mon image, pas 128Ko Ce qui correspond plutôt à une qualité "50" dans Photoshop.
Ensuite je n'avais pas utilisé Photoshop, donc les % de taux de qualité ne correspondent pas forcément entre chaque outil.
Oui, enfin bref, tu l'as bien compressé !
Qualité 50 tu dis ? Je regarderai le poids que ça fait avec cette qualité, mais visiblement Photoshop compresse moins bien que le logiciel que tu as utilisé !
Bon malgré le fait que le soucis semble régler avec un logiciel existant j'ai fait malgré tout un petit programme pour extraire les class et les id présent sur une page web (vu que j'avais du temps a perdre )
Plus qu'a comparer ça avec les selecteur présent sur les fichiers CSS et afficher ceux en trop et ce sera pleinement utilisable
Version actuel:
Trop génial
Sinon, Alpha, j'ai fait un test avec Webstorm, et j'ai une question :
Il me dit que l'ID "banner" n'est jamais utilisé. Je le supprime donc, mais juste en dessous de cet élément, dans le CSS, j'ai aussi par exemple "#banner p", ou "#banner h2".
Je suppose que je peux les supprimer aussi du coup, mais j'ai un doute :/
EDIT : Aussi, j'ai l'impression qu'il faut être très vigilant, parce qu'il m'a dit qu'un élément CSS était inutilisé alors qu'il permet d'avoir une petite animation lorsque l'on passe la souris sur les lien de la barre de menu.
Et aussi, j'ai l'impression qu'il trouve trop peu de ID/Class inutilisés. Il m'en a trouvé qu'un 10-15aine sur 2 feuilles CSS, mais je jurerai qu'il y en a plus :/
Comme je le disais dans mon premier message, l'outil aura du mal à détecter les usages dynamiques. L'animation de ton menu est provoquée à priori par l'ajout dynamique (c'est à dire que c'est du Javascript qui va l'ajouter) d'une classe sur l'élément lorsque tu passes la souris dessus (je pense que tu parles de l'apparition du sous-menu "Missions" ?).
Donc oui, il faut être prudent parfois (donc tout supprimer d'un coup est probablement une mauvaise idée).
Sinon, tu peux utiliser le raccourci CTRL + SHIFT + F pour faire une recherche globale dans tout le projet. Tape le nom du selector en question dans la boîte de dialogue qui s'ouvre et sélectionne bien "Whole Project" dans le scope. De manière optionnelle, tu peux aussi filtrer les résultats pour n'afficher que les occurrences dans les fichiers .html en cochant "File mask(s)" et en sélectionnant le filtre pour les fichiers html (*.html). Peut-être que laisser sans filtre et regarder les résultats dans les fichiers JS te permettra de voir si c'est utilisé dans du javascript.
Regarde si la chaîne de caractère est utilisée sur une balise html, ça te permettra de savoir si un selector est bien utilisé ou pas.
Si tu veux vérifier une classe/id CSS en particulier, tu peux aussi faire un clic droit sur le nom du selector dans le fichier CSS et choisir Find Usages.
Concernant les résultats que tu trouves "trop peu nombreux", à priori tu peux faire confiance à la recherche lorsqu'il pense qu'une classe est vraiment utilisée (le contraire faut être prudent comme on le disait plus haut).
Après, peut-être que certaines classes sont utilisées dans des fichiers HTML que tu n'utilises pas réellement.
En enregistrant la page d'accueil de ton site et en lançant l'analyse de code, il me trouve 152 classes/id non utilisées. Par contre il n'a pris en compte que la page d'accueil dans mon cas (seule page que j'ai récupérée), ça ne veut pas dire que certaines classes ne sont pas utilisées sur d'autres page. Mais bon, je vais pas aspirer ton site tout entier pour vérifier non plus
Non,je parlais de tous les liens, et je ne pense pas que le javascript intervienne dedans. Enfin bref, je vais essayer pour ta technique, je vais attendre le logiciel de MrTogimaro (si il veut bien le partager ), mais sinon je ne vais pas insister, j'ai plus peur de faire n'importe quoi
En ayant beaucoup allégé l'image, j'ai déjà beaucoup réduit le temps de chargement, c'est déjà ça !
Merci pour tout en tout cas !
Bien sur que le partagerai
Par contre je suis en train de finir l'analyse des selecteurs CSS, utilise tu des Media Queries par hasard? Ou alors Less.js? Car ça risque de me complexifier le travail pour l'instant (car ça fait intervenir des accolades dans d'autre accolades et donc je devrai gérer ce genre de truc et ça rajouterai du temps de travail, à termes ce sera implémenter bien sur)
(Accessoirement l'analyse des balises en HTML ne fonctionne que si tu utilise des guillemet ou des apostrophes pour délimiter le ou les noms des class/id d'une balise)
Pages