0

Wie man seine CSS/Javascript-Dateien komprimiert

Es gibt Menschen, die bauen Webseiten, Blogs oder ähnliches. So richtig mit HTML, CSS und solchen Kram. Wenn du einer davon bist bist du hiermit eingeladen, weiter zu lesen. Der Rest: Ihr macht doch eh was ihr wollt…

Zwischen den CSS- und Javascript-Dateien die man selber schreibt und denen, die am Ende dem Besucher ausgeliefert werden, gibt meistens einen großen Unterschied: Der Code ist komprimiert. Das macht man, weil die Dateigröße dadurch drastisch abnimmt. Und kleinere Dateien bedeuten kürzere Ladezeiten. Und kürzere Ladezeiten sind gut, weil das bedeutet weniger warten und Besucher warten nicht gerne. Verstehste?

Unkomprimiertes CSS
minified CSS

Dateien komprimieren kann sehr anstrengen sein. Wenn man es mit der Hand macht. Beim CSS komprimieren werden beispielsweise alle Zeilen und alle überflüssigen Leerzeichen/Semikolons entfernt. Wenn man DAS mit der Hand macht wird man Irre. Aus diesem Grund gibt es Programme, die das netterweise für einen übernehmen. Eines davon hört auf den tollen Namen YUI Compressor.

Yahoos YUI Compressor ist in Java geschrieben, wird über die Kommandozeile bedient und kommt sowohl mit CSS-, als auch mit Javascript-Dateien zurecht. Dementsprechend einfach kann man YUI Compressor in seinen Editor einbinden oder anderweitig automatisiert nutzen. Doch es geht noch einen Tick einfacher.

Smaller ist eine kleine Mac App, die im Grunde nichts anderes als eine kleine, schicke GUI für den YUI Compressor ist. Genau wie Yahoos Tool kann also auch Smaller CSS- und Javascript-Dateien schrumpfen lassen. Per Drag and Drop kann man die Dateien oder gleich ganze Ordner hinzufügen. Außerdem kann man einstellen, dass die App bereits komprimierte Dateien ignorieren soll und neuen Dateien einfach ein “.min” anhängen soll – funktioniert soweit ganz gut.

Kleiner Nachteil von Smaller: Zum herunterladen gibt’s nur eine 30-Tage-Demo, die Vollversion kostet 15$. Kostenlos gibt’s die App wenn man so dreist ist wie ich und über die App bloggt (Bevor ihr euch aufregt: Chen Luo, der Entwickler hinter Smaller, hat mir die Lizens freiwillig und einfach so geschickt. Ohne ein "dafür musst du darüber aber bloggen". Ich mach blogge darüber, weil ich die App gut finde. Bum, zack, return!).

Übrigens: Für Bilder gibt es auch eine schicke GUI: ImageOptim. Und wer sein HTML im Blog klein halten will: W3 Total Cache macht das hier im Blog hervorragend…

Smaller App Screenshot
iVeröffentlicht am 28. April 2011.
0

in eigener Sache

Wenn ihr das hier lesen könnt hat es geklappt: mein Blog liegt jetzt nicht mehr in Berlin sondern in Köln bei Host Europe. Hoffentlich klappt das dann endlich mal mit den Kommentaren absenden ohne “Der Server ist überlastet” und dem ganzen Kram. Ich glaube, das Blog läuft auch etwas schneller, oder?

Wenn noch was nicht so richtig rund läuft: Sagt mir bescheid, kann gut sein, dass ich was übersehen habe.

iVeröffentlicht am 11. April 2011
3

HTML5 vs. Flash

Diese Seite geht zur Zeit auf Twitter um. Eine Seite, auf der Sander Kessels versucht zu beweisen, dass Flash doch viel besser ist als HTML5. Ein paar unsorierte Gedanken, die mir beim lesen dieser Seite gekommen sind:

Der erste Lacher ist die Tatsache, dass der gesamte Inhalt der Seite Flash ist. Wie super! Wenn sie nicht wollen, dass Google die Seite indexiert, warum sagen sie es nicht einfach? Ich als Leser fühle mich bei solchen Seiten übrigens verarscht, wenn ich einen Link noch nicht mal in einem neuen Tab/Fenster aufmachen kann oder manche Texte nicht markieren kann.  Aber hey, Hauptsache es ist schön bunt! Achja, Flash Inhalt lässt sich auch super automatisch übersetzen, seht ihr?

It’s  equipped with a browser that depends on HTML5. Due to the slow processor rich internet content will not play very smooth. However, comparable tablet-devices running Android 2.2 and the flash player 10.1 are able to show all the following Flash examples (marked TODAY) on this page.

Derren Akku hält aber nicht 10 Stunden lang. 3x dürft ihr raten warum! Richtig: Unterstützung von Flash = mehr Prozessorauslastung = höherer Stromverbrauch = kürzere Akkulaufzeit. So einfach ist das. Außerdem sagen sie nur, dass es läuft! Nur performant ist das nicht wirklich, das habe ich letzte Woche selbst gesehen. Vor allem beim Scrollen macht das Surfen mit Flash keinen Spass.

Just like the other 97% of all online users are used to.

Keine Frage, Flash ist im Moment weiter verbreitet als HTML5. Denn im Moment unterstützt so gut wie kein Browser komplett HTML5. Da lassen sich also echt super Vergleiche machen. Anders sieht es beispielsweise beim Nachladen von Schriften aus, das unterstützt sogar der InternetExplorer 6 – und das will was heißen. Da bekommt man bestimmt mehr als 97% zusammen! Übrigens: Die Zahl an Usern, die Flash mit voller Absicht blocken (z.B. mit ClickToFlash für Safari oder Firefox) nimmt immer weiter zu.

Nachtrag: Mir fällt gerade auf, dass dieser Wert (97%) eigentlich nur direkt von Adobe stammen kann. Alle anderen Statistiken, z.B. diese hier (auf Plugins klicken), errechnen eine wesentlich geringere Rate von aktiviertem Flash. Komisch, oder? Weiterlesen »

iVeröffentlicht am 14. Juni 2010
0

Es grünt!

Wenn Twitterer die Deutschlandfahne in ihr Avatar-Bildchen bauen und stolze Autofahrer für 50 Cent eine Fahne an ihr Auto machen, dann ist es wieder so weit: Die WM 2010 wird morgen (oder heute, je nach dem, wann ihr das lest) beginnen. Brot und Spiele und so. Ihr wisst schon was ich meine. Erstes Spiel: Südafrika – Mexiko. Wie spannend.

Ich werde mir weder eine Flagge in den Avatar, ans Auto, noch sonstwo hinkleben. Ich schmücke mein Blog mit Rasen. Das Foto dazu kommt vo Nika Höfler (CC-Lizenz). Damit ihr’s wisst :D

Achja, nochwas: Ganz wichtig für die WM ist

  • Spielplan im Kalender, gibt’s z.B. hier oder hier (mit Anmeldung)
  • selbstverständlich gibt es eine mehrere WM-Apps, z.B. die hier
  • Unterwegs kann man sich die WM mit T-Mobiles MobileTV App und dem dazugehörigen Paket MobileTV FIFA WM 2010 (gibts pro Tag für 1,95€ oder pro Monat für 4,95€) auch live anschauen. Wer’s braucht.
  • Auf PC oder Mac kann man sich mit den Mediatheken der öffentlich-rechtlichen abgeben und die Spiele dort live verfolgen. Namentlich die ARD-Mediathek und die ZDF-Mediathek.

Ende der Durchsage.

iVeröffentlicht am 10. Juni 2010
2

Loremify

Oft sind es kleine Tools, die einem die Arbeit erleichtern. Genau so eins will ich jetzt ganz knapp vorstellen:

Loremify heißt’s und ist ein Dashboard Widget für Mac OS X. Seine Aufgabe ist denkbar einfach: Es erstellt Lorem-ipsums in allen möglichen Varianten. Dabei kann es den fertigen Text entweder als blanken Text oder als fertiges HTML in die Zwischenablage kopieren. That’s it!

Loremify kann im Blog des Entwicklers heruntergeladen werden und kost’ nix.

iVeröffentlicht am 06. Mai 2010
1

immer noch keinen Titel

Ich hab immer noch keine Überschrift gefunden. Naja, ned so wichtig. Überschriften werden sowieso total überbewertet.

Dieser Typ auf dem Video da unten, Remi Gaillard, hat echt Spass am Leben. Echt krass, was der so treibt :D

youtube.com

Der App-Store Zulassungsprozess bei Apple geht seit diesem Jahr ein bisschen schneller, sagte zumindest AppelInsider. In grade mal 48h soll seine App freigeschaltet worden sein. Ob das ein Missverständnis war oder ob das Apples guter Vorsatz für’s neue Jahr war wird sich zeigen.

Ohne Worte: Der Vatikan findet Avatar doof, weil Avatar Heidentum fördere.

Wer ist eigentlich der schnellste SMS-Schreiber der Welt? Diese Frage wird morgen auf der LG Mobile Cup in New York entschieden. Für was es alles Wettbewerbe gibt…

Javascript kann auch immer mehr: Jetzt kann’s sogar schon Flash-Dateien rendern. Hut ab. Damit wäre ja quasi Flash auch auf dem iPhone :D

iVeröffentlicht am 13. Januar 2010
3

HelioHost

HelioHost - ein genialer Freehoster

Ich kenne mittlerweile über 180 kostenlose Webhoster. Manche sind wirklich, andere sind solala – zumindest, wenn man sie mit Paidhostern vergleicht. Umso mehr war ich gerade überrascht. Überrascht, was der Hoster, der gerade in meinen E-Mails gelandet ist, alles kann: nämlich so ziemlich alles. Er kann so ziemlich alle Programmiersprachen, die man nur irgendwie ins Web bekommen kann, von ASP über Ruby on Rails über Visual C# bis hin zum .NET Framework oder Klassikern wie PHP (selbstverständlich mit url_fopen). Sogar Java Servlet (also Java aufm Server), Visual BASIC oder Django (Python im Web) werden unterstützt.

Als Programmierer braucht man natürlich eine Datenbank. Bei HelioHost gibt es hier keine Beschränkungen, man kann sich so viele Datenbanken erstellen wie man will. Eingebaut ist mySQL, SQLlite und PostgreSQL.

Des weiteren gibt es unendlich E-Mail-Adressen (mit POP3, Webmail und sogar IMAP), unendlich Subdomains und unendlich FTP-Accounts. Nur bei einem gibt’s nicht unendlich: beim Speicher. Auch der sollte mit 250MB für normale Webseiten reichen, beim Traffic könnte es dann noch mit 2,5GB etwas knapp werden.

Fazit: Ein super Server, um viele verschiedene Programmiersprachen zu testen und auszuprobieren ;)

iVeröffentlicht am 22. Oktober 2009
« Ältere Einträge