PSD-Tutorials.de
Forum für Design, Fotografie & Bildbearbeitung
Tutkit
Agentur
Hilfe
Kontakt
Start
Forum
Aktuelles
Besonderer Inhalt
Foren durchsuchen
Tutorials
News
Anmelden
Kostenlos registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Menü
Anmelden
Kostenlos registrieren
App installieren
Installieren
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Antworten auf deine Fragen:
Neues Thema erstellen
Start
News
News
Tipps zum Komprimieren von Webseiten
Beitrag
<blockquote data-quote="Pascal Bajorat" data-source="post: 2756795" data-attributes="member: 12812"><p>[newsstart] Kleinere Webseiten und Dateien bringen eine bessere Performance beim Aufrufen der entsprechenden Webseite - das ist eine Tatsache, die vielen von euch bekannt sein dürfte, allerdings werden die Aspekte der Optimierung oftmals aus Bequemlichkeit weggelassen oder einfach vergessen. In diesem Artikel möchte ich euch ein paar einfache Tipps zur Optimierung von Webseiten geben, die sich eigentlich bei fast jeder Seite oder auch bei Themes für Content-Management-Systeme anwenden lassen.[LBR] Der erste Tipp beginnt direkt beim Bild-Export aus Photoshop: Hier sollten die Bilder möglichst über die Funktion »Für Web speichern« exportiert werden. Ein einfaches Balkendiagramm mit wenigen Farben könnte zum Beispiel besser als PNG8 oder Gif gespeichert werden, ein JPG ohne Kompression wäre hier eher die falsche Entscheidung.[LBR] Allein mit optimal gespeicherten Bildern kann schon einiges an Traffic eingespart werden. Wenn nun für Icon-Sets oder ähnlich gruppierbare Bilder sogenannte CSS-Sprites verwendet werden, können hier auch noch einige HTTP-Requests eingespart werden. Bei CSS-Sprites liegen z.B. alle Icons in nur einer PNG-Datei und werden über Background-Position in die Webseite eingebunden.[LBR] Auch CSS- und JavaSript-Dateien können einfach zusammengelegt werden. Oftmals verwendet man in einer Webseite mehrere Scripte oder Plug-Ins (jQuery-Plug-Ins). Diese kann man nun alle einzeln einbinden oder zum Beispiel gesammelt aus einer zentralen JavaScript-Datei laden. Damit können weitere HTTP-Requests eingespart werden. Natürlich macht das Ganze nur dann Sinn, wenn die JavaScripte oder CSS-Dateien auch für die gesamte Seite gelten.[LBR] Mein letzter Tipp soll jetzt direkt die Dateigröße reduzieren. Es gibt diverse Online-Tools und auch native Software, um gängige Dateien zu komprimieren; dies geht in der Regel zu Lasten der Lesbarkeit. Ihr solltet also auf jeden Fall eine Sicherung der Dateien erstellen, bevor ihr diese komprimiert. Bei dieser sogenannten Minifikation werden Kurzschreibweisen eingefügt, leere Zeilen entfernt und Codes umgeschrieben. Auf diese Art komprimierte Dateien können teilweise bis zu 60% zur vorherigen Dateigröße einsparen.[LBR] Neben einer minified Version können einige Tools auch noch eine komprimierte GZIP-Version erstellen, die noch ein paar KB mehr einsparen kann.[LBR] Mein Favorit zum Komprimieren von Dateien ist Smaller App, eine native Anwendung für Mac OS. Natürlich gibt es auch diverse Online-Tools; hier eine kleine Liste:[LBR] <a href="http://smallerapp.com" target="_blank">http://smallerapp.com/</a> <a href="http://www.csscompressor.com" target="_blank">http://www.csscompressor.com/</a> <a href="http://javascriptcompressor.com" target="_blank">http://javascriptcompressor.com/</a> <a href="http://jscompress.com/" target="_blank">http://jscompress.com/</a> [newsend][/newsend][/LBR][/LBR][/LBR][/LBR][/LBR][/LBR][/LBR][/newsstart]</p></blockquote><p></p>
[QUOTE="Pascal Bajorat, post: 2756795, member: 12812"] [newsstart] Kleinere Webseiten und Dateien bringen eine bessere Performance beim Aufrufen der entsprechenden Webseite - das ist eine Tatsache, die vielen von euch bekannt sein dürfte, allerdings werden die Aspekte der Optimierung oftmals aus Bequemlichkeit weggelassen oder einfach vergessen. In diesem Artikel möchte ich euch ein paar einfache Tipps zur Optimierung von Webseiten geben, die sich eigentlich bei fast jeder Seite oder auch bei Themes für Content-Management-Systeme anwenden lassen.[LBR] Der erste Tipp beginnt direkt beim Bild-Export aus Photoshop: Hier sollten die Bilder möglichst über die Funktion »Für Web speichern« exportiert werden. Ein einfaches Balkendiagramm mit wenigen Farben könnte zum Beispiel besser als PNG8 oder Gif gespeichert werden, ein JPG ohne Kompression wäre hier eher die falsche Entscheidung.[LBR] Allein mit optimal gespeicherten Bildern kann schon einiges an Traffic eingespart werden. Wenn nun für Icon-Sets oder ähnlich gruppierbare Bilder sogenannte CSS-Sprites verwendet werden, können hier auch noch einige HTTP-Requests eingespart werden. Bei CSS-Sprites liegen z.B. alle Icons in nur einer PNG-Datei und werden über Background-Position in die Webseite eingebunden.[LBR] Auch CSS- und JavaSript-Dateien können einfach zusammengelegt werden. Oftmals verwendet man in einer Webseite mehrere Scripte oder Plug-Ins (jQuery-Plug-Ins). Diese kann man nun alle einzeln einbinden oder zum Beispiel gesammelt aus einer zentralen JavaScript-Datei laden. Damit können weitere HTTP-Requests eingespart werden. Natürlich macht das Ganze nur dann Sinn, wenn die JavaScripte oder CSS-Dateien auch für die gesamte Seite gelten.[LBR] Mein letzter Tipp soll jetzt direkt die Dateigröße reduzieren. Es gibt diverse Online-Tools und auch native Software, um gängige Dateien zu komprimieren; dies geht in der Regel zu Lasten der Lesbarkeit. Ihr solltet also auf jeden Fall eine Sicherung der Dateien erstellen, bevor ihr diese komprimiert. Bei dieser sogenannten Minifikation werden Kurzschreibweisen eingefügt, leere Zeilen entfernt und Codes umgeschrieben. Auf diese Art komprimierte Dateien können teilweise bis zu 60% zur vorherigen Dateigröße einsparen.[LBR] Neben einer minified Version können einige Tools auch noch eine komprimierte GZIP-Version erstellen, die noch ein paar KB mehr einsparen kann.[LBR] Mein Favorit zum Komprimieren von Dateien ist Smaller App, eine native Anwendung für Mac OS. Natürlich gibt es auch diverse Online-Tools; hier eine kleine Liste:[LBR] [url=http://smallerapp.com]http://smallerapp.com/[/url] [url=http://www.csscompressor.com]http://www.csscompressor.com/[/url] [url=http://javascriptcompressor.com]http://javascriptcompressor.com/[/url] [url=http://jscompress.com/]http://jscompress.com/[/url] [newsend][/newsend][/LBR][/LBR][/LBR][/LBR][/LBR][/LBR][/LBR][/newsstart] [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?
Antworten
Start
News
News
Tipps zum Komprimieren von Webseiten
Oben