11 Outils utiles pour vérifier, nettoyer et optimiser votre fichier css

Réduire au minimum le poids de l`CSS a stylesheet été considéré par beaucoup comme une bonne façon d`augmenter votre vitesse de chargement du site. En effet, en réduisant le fichier CSS par plusieurs kilo-octets, le serveur prendra un temps plus court pour charger et le résultat dans une page Web plus rapide.

Video: WINDOWS 7 - Améliorer l'affichage - TUTO #20

Dans le cas où vos articles ont frappé le frontpage Digg, cela pourrait aussi être l`un des rares facteurs décisifs (il y a beaucoup plus) si votre serveur se bloque ou pas.

Certaines des méthodes les plus utilisées pour minimiser / optimiser une feuille de style CSS consiste à éliminer les sélecteurs inutilisés, des espaces non désirés, des onglets, des commentaires et changer la déclaration longhand à la sténographie notations.

Je sais que certains d`entre vous ne sont pas technophiles assez pour modifier votre propre code CSS, donc ici, je vais vous donner quelques-uns des outils utiles que vous pouvez utiliser pour optimiser votre code CSS, même si vous avez complètement aucune connaissance codage CSS.

Vérifiez votre code CSS

W3C CSS Validator

Le validateur CSS du W3C est un outil que vous pouvez utiliser pour valider votre CSS. Vous pouvez télécharger le Java validateur sur votre ordinateur et de l`utiliser en mode hors connexion, ou utilisez le formulaire en ligne pour vérifier votre code CSS.

Video: Lier sa feuille de style à sa page HTML

CSS Validator Firefox Add-On

Pour le rendre plus facile pour vous de valider votre code CSS, il y a cette extension Firefox - CSS Validator - que vous pouvez installer sur votre navigateur. Une fois installé, vous pouvez facilement et rapidement vérifier votre code avec un clic droit de la souris.

CSSCheck

Même si votre code CSS est validé, cela ne signifie pas qu`il est exempt d`erreur. La validation signifie seulement qu`il est conforme aux normes CSS définies par le W3C. Si vous voulez valider ainsi que la recherche dans quelques problèmes de compatibilité du navigateur avec votre feuille de style, puis CSSCheck est un bon outil pour vous.

analyseur CSS

Analyseur CSS est un outil utile qui vous permet de valider votre feuille de style contre la norme du W3C, effectuer un test de contraste des couleurs, et un test pour vérifier que les tailles correspondantes sont spécifiées dans les unités de mesure relatives.

Si vous vous demandez, le test de contraste des couleurs est de vérifier que les avant-plan et des combinaisons de couleurs de fond fournissent suffisamment de contraste lorsqu`elle par une personne daltonienne, ou lorsqu`elles sont affichées sur un écran noir et blanc.

Nettoyez votre code CSS

Dust-Me Selectors

Dust-Me Selectors est une extension Firefox qui trouve des sélecteurs CSS inutilisés sur la page que vous consultez. Comme vous tester les pages suivantes du même domaine, le résultat est recoupées avec les données précédentes et les sélecteurs sont rencontrés biffé de la liste. Vous pouvez l`utiliser pour tester des pages individuelles ou obtenir à l`araignée tout le site.

En fin de compte, vous obtiendrez un rapport sur les sélecteurs qui ne sont pas utilisés partout dans le site. Vous pouvez ensuite supprimer les sélecteurs de votre feuille de style (code signifie moindre petite taille du fichier).

CSS redondance Checker

Similaire à la poussière Me Selectors, cet outil vérifie votre site pour sélecteurs CSS inutilisés et redondants. La seule chose qui est différent est que vous devez entrer manuellement l`URI pour chaque page que vous souhaitez tester.

Optimiser et Compresser votre code CSS

Une fois que vous avez terminé la vérification de la validité de votre CSS et nettoyé code inutile, il est temps d`optimiser le fichier CSS et le réduire à la plus petite taille possible.

CSS Tidy

CSS Tidy est un logiciel open source que vous pouvez utiliser pour optimiser et compresser votre fichier CSS. Il est disponible en format .exe (Windows uniquement) et un format de script php compressé (toutes les plates-formes, pour les développeurs Web). Qu`est-ce que CSS Tidy fait est principalement supprimer le commentaire, les espaces inutiles et changer une partie du code à la sténographie. Lors de la compression, vous pouvez choisir entre la lisibilité du code ou la compression maximale. En fonction de la durée de votre code, vous pouvez facilement obtenir un taux de compression allant jusqu`à 30% ou plus.

Depuis CSS Tidy est un projet open source, il y a eu plusieurs sites Web qui utilisent le code et l`a transformé en un outil en ligne pour les personnes à utiliser. En voici quelques uns:

• CSS CLEAN
• code Beautifier
• CSS Formatteur et Optimiseur de Portal CSS

Autres CSS optimiseurs

FlumpCakes CSS Optimizer

Un optimiseur simple qui est livré avec plusieurs options pour vous de choisir.

Robson CSS Compresseur

Bien qu`il puisse regarder la même chose que les autres, j`ai trouvé le taux de compression pour Robson CSS Compressor pour être le plus élevé parmi tous. Bien qu`il est livré avec plusieurs options pour vous d`ajuster le réglage, laissant toutes les options intactes (toutes les options cochées) produit toujours le meilleur résultat.

Compresseur CSS CSS disque

Le compresseur CSS proposé par CSS lecteur est disponible en deux modes que vous pouvez utiliser: et le perfectionnement. En mode normal, il vous suffit de sélectionner le niveau de compression que vous voulez (Light, Normal ou Super Compact) et le compresseur CSS fera le reste. Dans le mode avancé, vous avez plus d`options et plus mot à dire sur la façon dont vous voulez que votre feuille de style à optimiser.

Optimizer CSS

L`Optimiseur CSS à partir mabblog.com est une application en ligne de commande pour Mac et Linux. Il est destiné à ceux qui sont plus à l`aise avec le terminal plutôt que d`une interface en ligne. Il y a aussi une version simple disponible en ligne pour ceux qui veulent obtenir rapidement encore et fait avec.

Espérons que les outils énumérés ici sont assez pour vous d`ajuster et d`optimiser votre feuille de style CSS. Si vous avez utilisé d`autres outils qui sont plus utiles que ceux mentionnés ci-dessus, les partager avec nous dans les commentaires.