Outils pour debugger un fichier css ?

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par paikan06, 29 Mars 2012.

  1. paikan06
    paikan06 WRInaute discret
    Inscrit:
    1 Août 2011
    Messages:
    125
    J'aime reçus:
    0
    Bonjour à tous !

    Je récupère un site web relativement lourd (css, js), après avoir bien étudié l’architecture je suis persuadé qu'une grande partie du code css ne sert à rien.
    Connaissez vous des soft qui permettes d'analyser et de repérer le codes css inutiles ???

    Je vous remercie d'avance pour votre aide.
    Très bonne journée. :D
     
  2. mipc
    mipc WRInaute accro
    Inscrit:
    11 Février 2009
    Messages:
    3 158
    J'aime reçus:
    0
    il me semble que l'un des meilleurs c'est celui là:

    http://www.minifycss.com/css-compressor/

    bon ça va surtout aider à minifier le code, c'est pas fait pour etre exploiter par un humain, c'est de la mise en production, car si non tu voi plus rien de ton code.


    si non les autres:

    http://www.cleancss.com/

    http://iceyboard.no-ip.org/projects/css_compressor

    http://www.cssdrive.com/index.php/main/csscompressor

    http://www.csscompressor.com/

    si non à une époque un plugin pour firefox appeler google pagespeed le faisait très bien, le plugin google pagespeed pour firefox permet de viré les code CSS inutile car pas utilise dans la page.
     
  3. paikan06
    paikan06 WRInaute discret
    Inscrit:
    1 Août 2011
    Messages:
    125
    J'aime reçus:
    0
    Merci énormément pour ta réponse rapide, je regarde de suite !!!!!
    Très bonne continuation
     
  4. mipc
    mipc WRInaute accro
    Inscrit:
    11 Février 2009
    Messages:
    3 158
    J'aime reçus:
    0
  5. paikan06
    paikan06 WRInaute discret
    Inscrit:
    1 Août 2011
    Messages:
    125
    J'aime reçus:
    0
    Alors la félicitation :D , vous venez de remplir ma journée de boulot de demain !!!
    Merci
     
  6. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 417
    J'aime reçus:
    0
    nettoyer le css, c'est bien différent de juste compresser le code, c'est surtout supprimer les sélecteurs qui ne servent à rien dans le site. Il y a un outil qui permet de le faire, mais juste age par page. Pour l'intégralité d'un site, je ne sais pas si ça existe.
     
  7. mipc
    mipc WRInaute accro
    Inscrit:
    11 Février 2009
    Messages:
    3 158
    J'aime reçus:
    0
    c'est pour ça que j'ai donner le plugin firebug et le plugin google pagespeed pour firefox qui donne les entré orphelines qui ne servent à rien sur la page HTML analyser.

    edit, j'me site:


    j'me re site encore une fois:


     
  8. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 417
    J'aime reçus:
    0
    oui, mais s'il faut passer sur toutes les pages, une par une, afin de vérifier les sélecteurs non utilisés, ça n'est vraiment pas pratique. Même avec quelques dizaines de pages. Alors quand on en a plusieurs dizaines (voire centaines) de milliers :roll:
     
  9. mipc
    mipc WRInaute accro
    Inscrit:
    11 Février 2009
    Messages:
    3 158
    J'aime reçus:
    0
    j'ai jamais dit que s'était simple.
     
  10. paikan06
    paikan06 WRInaute discret
    Inscrit:
    1 Août 2011
    Messages:
    125
    J'aime reçus:
    0
    Bonjour à tous :D
    Je te remercie Leonick d'avoir fait la distinction entre nettoyer et compresser. Les différentes références citées vont beaucoup m'aider une fois que le code inutile sera effacer.
    De mon côté, j'ai trouvé un site qui a l'aire sympa : http://unused-css.com/

    Si vous avez des avis, c'est avec plaisir :D
    Très bonne journée à tous !!
     
  11. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 417
    J'aime reçus:
    0
    je ne suis pas pour la compression à outrance des code html, js et css, ne serait que pour débugger/faire évoluer le site.
    On peut me répondre que gg le fait bien, sauf que gg, la qualité du code, 'est loin d'être sa priorité il suffit de voir es erreurs affichées dans firebug, voir valid xhtml sur des pages contenant des bouts de code de gg
     
  12. mipc
    mipc WRInaute accro
    Inscrit:
    11 Février 2009
    Messages:
    3 158
    J'aime reçus:
    0
    moi se que j'avais fait à un moment, c'est des fichier de développement ou je codais dessus, puis une fois ceci fait et que tous était OK, je faisais générer un code minifier de chaque fichier pour la mise en production, comme ça moi coté développement le code était compréhensible par un humaine car pas fouille et relativement propre, m'enfin après j'ai arrêter parce que j'ai très peut de page.
     
  13. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 417
    J'aime reçus:
    0
    et quand tu veux débogger en ligne, ça va t'indiquer que ce style là est ligne 1. Comme tout le reste des styles, vu que tout est compressé et tient sur une ligne !
     
  14. mipc
    mipc WRInaute accro
    Inscrit:
    11 Février 2009
    Messages:
    3 158
    J'aime reçus:
    0

    nan mais je débogguais avec le code de développement pas avec le code de production, m'enfin maintenant je ne minifie plus tellement mon code car pour un site plutôt petit s'était des queues de cerises et en gros c'est plus une perte de temps qu'autre chose.

    pour dire le j'ai fusionner CSS et html parce que mon fichier CSS était vraiment ridicule et que techniquement il valait mieux laisser les feuille de style CSS directement dans le HTML question vitesse de chargement, en fait quant le fichier CSS fait 8KO et moins ça ne sert à rien de le mettre à part autant l'intégrer au code HTML sans les séparer, après si le code CSS est plus lourd, ça peut avoir un intérêt de les Séparer, sauf que moi j'ai jamais réussi à faire en sorte que le serveur sache Gzip le CSS, du coup j'ai laisser tomber et j'ai fusionner CSS dans le HTML.
     
  15. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 417
    J'aime reçus:
    0
    tu t'en fou que le css soit zippé. L'avantage de l'avoir en externe, c'est qu'au delà de la 1° page, le fichier reste en cache dans le navigateur, donc pas besoin de le recharger
     
  16. mipc
    mipc WRInaute accro
    Inscrit:
    11 Février 2009
    Messages:
    3 158
    J'aime reçus:
    0
    nan mais j'ai analyser avec pagespeed, le plugin pour google chrome, et même avec pingdom.com et yslow et ma méthode est meilleurs au final, de quasiment rien mais c'est meilleurs, ça reste des queue de cerise dans l'ensemble.
     
  17. fobec
    fobec WRInaute discret
    Inscrit:
    10 Mai 2005
    Messages:
    189
    J'aime reçus:
    0
    Sous Firefox, je te conseille le plugin Dustme
    -http://www.sitepoint.com/dustmeselectors/

    L'outil prend en compte l'utilisation d'une même feuille de style pour plusieurs pages.
    Petit bemol, l'extension DustMe n'est plus supporté par la version FireFox 11 :(
     
  18. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 417
    J'aime reçus:
    0
    il suffit de peut de chose pour faire accepter un plgin en version supérieure de FF, sous réserve d'éventuels dysfonctionnements du plugin, mais souvent, c'est juste la version haute qui n'a pas été prévue suffisamment haute, du fait du versionning hyper rapide de FF ces derniers temps
     
Chargement...
Similar Threads - Outils debugger fichier Forum Date
Outils pour évaluer la concurrence sur un mot clé Débuter en référencement 20 Février 2021
Astuce Je partage ce site d'outils SEO gratuit Débuter en référencement 25 Janvier 2021
Outils : test des données structurées et des rich snippets Référencement Google 16 Décembre 2020
Quels Outils Javascript pour générer des documents Demandes d'avis et de conseils sur vos sites 21 Juillet 2020
Outils de lecture de positionnement Référencement Google 20 Janvier 2020
Outils gratuits pour voir les liens sortants (DF) Netlinking, backlinks, liens et redirections 10 Juin 2019
Ressources, outils pour les concepteurs Web Développement d'un site Web ou d'une appli mobile 29 Mars 2019
Outils pour estimer la valeur d'un site Débuter en référencement 28 Mars 2019
backlinks non vus par outils Netlinking, backlinks, liens et redirections 2 Novembre 2018
Quels outils pour générer un sitemap xml en ligne ? Référencement Google 20 Septembre 2018