0

DiagnostiCSS – Vérifiez votre code en live

Bonjour les amis.

Aujourd’hui, je vais vous parler d’un petit outil très sympa. Il s’agit de DiagnostiCSS.

DiagnostiCSS, c’est quoi ?

Comme son nom l’indique, il va vous servir à tester votre CSS…

Hé bien non !!
En fait, il porte assez mal son nom. Même s’il vous sortira certaines données CSS, le script est plutôt taillé pour les normes HTML.

Vous aurez le droit à une étude de la construction de vos éléments HTML et vous aurez ainsi des indications sur des attributs manquants ou sur la mauvaise utilisation de vos balises (un lien sans lien, un input sans name, etc…)

L’outil n’est pas fan non plus de l’utilisation des styles inline pour vos CSS donc si vous avez pour habitude de mettre beaucoup de vos styles directement dans vos balises:

  1. Essayez de minimiser le nombre de style en ligne que vous utilisez
  2. Ne soyez pas étonné que l’outil s’affole et vous entoure la moitié de votre site web en orange !

Et on l’utilise comment ?

En fait, c’est assez simple. Deux solutions s’offrent à vous.

Si vous utilisez Google Chrome, vous pouvez directement installer le plugin à votre disposition sur le site. Un petit clic sur le nouvel icone et vous aurez votre site analysé en moins qu’il ne faut pour le dire.

Si vous utilisez un autre navigateur, la manip’ n’est pas complexe non plus, puisque vous pourrez disposer du même outil mais directement via un signet (Vous pouvez aussi utilisez le signet sur Google Chrome si vous n’êtes pas fan des extensions). Toutefois, le script semble avoir des problèmes de z-index sur certains sites concernant les messages d’avertissements.

Voici l’adresse du site officiel.

Et si jamais l’envie vous dit de participer à l’amélioration du projet, voici le GitHub.

Bonne optimisation à tous.

A bientôt les amis !

A propos de Romuald

Romuald a écrit 23 articles sur le blog.

Les amis de nos amis sont nos amis, alors partageons !

Laissez un commentaire





Si vous êtes un vrai développeur, vous devez savoir compter.
Alors on vous met au défi !
Si vous réussissez cette épreuve, nous nous ferons une joie de lire votre commentaire.