Share
L'une des critiques courantes des frameworks tels que Twitter Bootstrap est qu'ils incluent beaucoup plus de code que ce que vous utilisez réellement sur votre site, vous laissant avec une base de code saturée et des performances de site médiocres. Ceci est un danger possible, mais la page de personnalisation de Bootstrap constitue un excellent outil pour résoudre le problème. Laissez-moi vous guider dans le processus de personnalisation de vos fichiers CSS et JavaScript afin de réduire considérablement leur taille..
Cela s’occupe de la première vidéo. Dans la seconde, je vais vous expliquer une autre étape importante: extraire des bits de vos fichiers d’image à l’aide de l’outil Smushit de Yahoo! Ensemble, ces deux étapes (optimisation de votre code et optimisation de vos images) réduiront considérablement l'empreinte de votre site..
Nous utiliserons la page Personnaliser de Twitter Bootstrap pour sélectionner et télécharger uniquement les composants CSS et JavaScript dont nous avons besoin, ce qui se traduira par: beaucoup taille de fichier plus petite.
Vous pouvez également télécharger la vidéo ou vous abonner à Webdesigntuts + screencasts via iTunes ou YouTube.!
Vous trouverez ci-dessous des captures d'écran des sélections effectuées dans le screencast..
Une fois que vous avez téléchargé et déployé vos fichiers CSS et JS personnalisés, vous pouvez choisir de réaliser des gains supplémentaires en utilisant un plugin tel que Dust Me Selectors pour identifier les sélecteurs restants non utilisés, que vous pouvez éditer manuellement à partir de votre fichier CSS. Ce sera beaucoup plus facile avec le fichier personnalisé plus petit qu'avec le fichier d'origine.
Pendant que nous optimisons les fichiers, nous pouvons également mentionner une étape supplémentaire qui vous aidera à gérer les fichiers les plus volumineux du site moyen: les fichiers image. Il y a beaucoup à penser lors de l'optimisation des images pour le Web. Vous serez peut-être surpris de savoir que tous les outils de compression ne sont pas égaux. La boîte de dialogue "Enregistrer pour le Web et les périphériques" de Photoshop s’avère être l’un des outils de compression les moins efficaces sur le marché..
Ici, nous allons utiliser l'outil Smushit de Yahoo! pour nous aider à accomplir ce que Photoshop ne pourrait pas.
Vous pouvez également télécharger la vidéo ou vous abonner à Webdesigntuts + screencasts via iTunes ou YouTube.!
Accentsconagua