Share
Einer der häufigsten Kritikpunkte an Frameworks wie Twitter Bootstrap ist, dass sie weit mehr Code enthalten, als Sie auf Ihrer Website tatsächlich verwenden. Dies führt zu einer aufgeblähten Codebasis und einer schlechten Website-Leistung. Dies ist eine mögliche Gefahr, aber die Seite Anpassen von Bootstrap bietet ein hervorragendes Werkzeug zur Behebung des Problems. Lassen Sie sich durch den Prozess der Anpassung Ihrer CSS- und JavaScript-Dateien führen, um deren Dateigröße erheblich zu reduzieren.
Das kümmert sich um das erste Video, im zweiten Schritt gehe ich Sie durch einen weiteren wichtigen Schritt: Ausdrücken von Bildern aus Ihren Bilddateien mit dem Smushit-Tool von Yahoo !. Zusammen werden diese beiden Schritte (Optimierung des Codes und Optimieren der Bilder) die Standfläche Ihrer Website erheblich reduzieren.
Wir verwenden die Seite Anpassen von Twitter Bootstrap, um nur die CSS- und JavaScript-Komponenten auszuwählen und herunterzuladen, die wir benötigen viel kleinere Dateigrößen.
Alternativ können Sie das Video herunterladen oder Webdesigntuts + Screencasts über iTunes oder YouTube abonnieren!
Im Folgenden finden Sie Screenshots von Auswahlen, die ich im Screencast getroffen habe.
Nachdem Sie Ihre angepassten CSS- und JS-Dateien heruntergeladen und bereitgestellt haben, können Sie weitere Verbesserungen vornehmen, indem Sie ein Plugin wie Dust Me Selectors verwenden, um verbleibende, nicht verwendete Selektoren zu identifizieren, die Sie manuell aus Ihrer CSS-Datei bearbeiten können. Das wird sein viel einfacher mit der kleineren angepassten Datei als mit der Originaldatei.
Während wir Dateien optimieren, können wir auch einen zusätzlichen Schritt erwähnen, der Ihnen bei den größten Dateien auf einer durchschnittlichen Website helfen wird: den Bilddateien. Es gibt viel zu überlegen, wenn Sie Bilder für das Web optimieren. Sie sind vielleicht überrascht zu wissen, dass nicht alle Komprimierungswerkzeuge gleich sind. Der Dialog "Für Web und Geräte speichern" in Photoshop stellt sich als eines der am wenigsten wirksamen Komprimierungswerkzeuge heraus.
Hier verwenden wir das Smushit-Tool von Yahoo!, um uns dabei zu helfen, das zu erreichen, was Photoshop nicht konnte.
Alternativ können Sie das Video herunterladen oder Webdesigntuts + Screencasts über iTunes oder YouTube abonnieren!
Accentsconagua