Normalerweise würde es niemanden interessieren wenn eine Person bzw. dessen Firma etwas derartiges äußern würde. Doch das iPhone und das iPad sind Verkaufsschlager die ihresgleichen suchen. Gestern erst wurde vermeldet das bereits 1 Million iPads verkauft wurden. 1 Million Geräte, dessen Hauptaufgabe die Erkundung des Webs ist. 1 Million Geräte und User die ohne Flash auskommen.

Dazu kommen noch weltweit etwa 85 Million verkaufte iPhones. Also rund 86 Million potentielle Kunden für jede kommerzielle Website – selbst wenn weniger als 1% dieser Nutzerschicht die eigene Website besuchen würde, wäre so ziemlich jede Firma oder jeder Online Shop glücklich. Bei diesen Zahlen also eine Äußerung die man ernst nehmen sollte.

Berechtigte Kritik?

Dennoch stellt sich die Frage ob Steve Jobs recht hat, mit dem was er sagt. Viele Stimmen im Internet sagen Apple würde Flash nur nicht zulassen, weil das eigene Geschäftsprinzip mit den AppStore und dessen Apps damit zerstört würde. Viele andere User wiederum stimmen ihm im vollen Umfang zu – Flash sei von gestern, die Zukunft ist HTML5 – denn HTML5 ist offen und für jeden benutzbar … ohne zusätzliche Software neben dem Browser.

HTML5 ist die Zukunft, aber eben nicht die Gegenwart. Jeder Webentwickler u. -designer weiß wie groß der Anteil an Internet Explorer 6 Usern im Web ist. Ein Browser von 1999. Steve Jobs möchte gerne etwas zum Standard erklären, was zum aktuellen Zeitpunkt noch von keinem aktuellen Browser zu 100% unterstützt wird. Viele Videoportale haben mitlerweile eine Weiche eingebaut. Flash für die Leute von gestern, HTML5 für die von heute. Sicherlich eine gute Idee…aber Ressourcen die sich nicht jede Firma leisten kann. Bis auch der letzte User auf einen modernen Browser umgestellt hat, wird noch einige Zeit vergehen.

Ein weiterer Punkt ist, das Flash für die Maus gemacht wurde, und nicht für den Finger. Die Maus besitzt einen Zeiger der über ein Element fahren kann und damit ein “Hover” Event auslöst. Dies ist mit dem Finger nicht möglich…der Finger ist entweder auf dem Touchscreen oder er ist es eben nicht. Somit müssten sehr sehr viele Flash-Seiten an die neue Usability angepasst werden und in dem Zuge könnte man doch direkt auf etwas User-freundlicheres Umstellen…meint zumindest Steve Jobs.

Adobes Sicht

Adobe hat die Kritit an Flash aufgenommen und mit einem kleinen Statement dagegen gehalten. Wenn man dies mit dem vergleicht was Steve Jobs zu der Thematik zu sagen hat, wirkt die Äußerung des Herrn Shantanu Narayen (Adobe Chef) auf mich jedoch so, als ob er nicht wirklich viele Argumente dafür hätte, warum Flash unbedingt auf dem iPhone und dem iPad laufen müsste.

Shantanu Narayen sagt so viel, wie: “Wir sind nich alleine Schuld daran das Flash nicht so gut läuft, der Akku würde nicht so viel Strom fressen wenn Apple eine Hardwarebeschleunigung anbieten würde und Apples System ist auch properitär“. Irgendwie wirkt das sehr einfallslos…

Kommentar

Meine Sicht der Dinge ist, dass Flash der Vergangenheit angehört. Flash ist zumindest auf dem Mac sehr Ressourcenfressend und sollte – wenn Adobe sich durchsetzen möchte – schon überall gleichgut laufen. Von den Ladezeiten auf mobilen Geräten möchte ich garnicht erst anfangen, denn selbst normale HTML Websites die nicht für mobile Geräte optimiert sind können mir schon manchmal den letzten Nerv rauben.

Zudem lassen sich mitlerweile mit JavaScript Frameworks, wie z.B. jQuery oder Mootools viele schöne Effekte zaubern. So kann jede Website dynamisch gestaltet werden und niemand wird Flash vermissen. Gleiches gilt für die Videoseiten – hier wird es zwar noch ein paar Tage dauern, aber die großen wie YouTube und Vimeo haben schon auf h.264 und HTML5 umgestellt und sind für die Zukunft gerüstet – ein moderner Browser wird natürlich vorrausgesetzt.

Ob der Weg von Apple, Flash überhaupt nicht auf dem iPhone zu erlauben der Richtige ist, sei dahingestellt – aber es ist definitiv ein konsequenter und einer der evtl. das Internet der nächsten Jahre mitprägen wird.

Was meint ihr dazu? Hat Steve Jobs mit seinen Aussagen recht?

Ähnliche Beiträge:

1. jQuery Tutorial: mitskalierende Hintergrundbilder
2. Hands on: iPad
3. Update to IE8: Essen für Obdachlose

Doch diese Grenzen heben sich langsam dank jQuery und anderen Frameworks auf. Sie bringen viele Animationstechniken mit, die Scrollbare Inhalte, Farbübergänge oder ähnliches bewerkstelligen können. In einigen vorherigen Tutorials habe ich schon die jQuery Tools beschrieben und was für schöne Sachen man damit anstellen kann.

Eine schöner Effekt war bzw. ist das mitskalieren eines großen Hintergrundbildes, wie z.B. auf der Website der Deutschen Post. Dies passt sich automatisch der Browser- bzw. Auflösungsgröße des jeweiligen Users an. Zusätzlich ein paar schöne halb-transparente Text boxen und eine schöne Website ist fertig gestaltet.

Umsetzung

Doch wie macht man das? Eigentlich ganz einfach. Wir benötigen dafür jQuery (aktuell in Version 1.4.2) und fragen via Eventabfrage ab ob der User die Browsergröße verändert. Wenn dies geschieht, wird einem (möglichst gut aufgelöstem) Bild auf der Seite mitgeteilt das es seine größe verändern soll – und zwar auf die des Browser-Viewports.

Hört sich erst einmal ganz einfach an – und das ist es im Prinzip auch, soweit man natürlich schon etwas mit JavaScript bzw. jQuery gearbeitet hat.

CSS

body{margin:0px;}
#background{position:fixed; top:0; left:0; z-index:0;}
#ausgabe{background:black; padding:10px 15px; margin:10px; border:1px solid #cecece; color:white; opacity:0.8; position:absolute; top:140; z-index:10; font-size:12px; width:500px;}

HTML

<body>
     <img src="bg.jpg" alt="Background-Image" id="background" />
     <div id="ausgabe">Ein Layer über dem Hintergrundbild</div>
</body>

Wir legen eine kleine HTML Datei an, welche nur das Bild zur Skalierung und eine halbtransparente Ebene mit dem Content beinhält.

JavaScript

$(document).ready(function(){
    var width  = $(window).width();
    $("#background").width(width);
    $(window).resize(function(){
        width  = $(window).width();
        $("#background").width(width);
    });
})

Wenn das Dokument fertig geladen ist, wird die größe des Browser-Viewports an die Variable width weitergegeben und die ID Background (das Bild) in der Breite an das Fenster angepasst. Die höhe skaliert sich automatisch mit. Das gleiche soll natürlich auch passieren wenn sich die Fenstergröße ändert. Dafür fragen wir das Event resize in Verbindung mit dem Browserfenster (window) ab. Sollte sich hier etwas tun wird das Event ausgelöst und ebenfalls die Breite angepasst.

Also insgesamt ein leichtes diesen Effekt zu nutzen. Optimal z.B. für Seiten im Vintage Style.

Ähnliche Beiträge:

1. jQuery Tools – Teil 3: Scrollable
2. jQuery Tools – Teil 1: Tabs
3. jQuery Tools – Teil 2: Tooltips

Was bedeutet Scrollable? Im Grunde ist es versteckter Content, der durch eine Scrollfunktion sichtbar gemacht wird. Optimale Einsatzgebiete dafür sind Bildergalerien oder Newsticker. So wird der Fokus auf ein Thema oder eine begrenzte Anzahl an Fotos gelegt – sollte einen User dies nicht für Interessant halten, kann er mit einem klick andere Themen und Bilder sichtbar machen. Insgesamt eine sehr schöne und imposante Funktion, welche den Content auf Seiten deutlich lebendiger werden lässt.

Impressionen

Da man diese Funktion mit Bildern nur schlecht präsentieren kann, erläutere ich in diesem Fall nur anhand von Beispielen den Einsatz.

Coda
Optimal nutzt wieder einmal Panic’s Coda diese Funktion. Coda hat die eigene Seite in 7 Bereiche aufgeteilt, welche alle Informationen zu der Software abdecken. Möchte man nun Wissen wie der Editor funktioniert, klickt man auf den Menüpunkt und der Inhalt “rutscht” von rechts nach Links in den Fokus. Also alle Informationen schnell an der Hand ohne die Seite neu laden zu müssen.

Chukki.de
Auf Chukki.de wird diese Funktion ebenfalls im Kopfbereich genutzt. Als Vorschau für den Wordpress Theme Download habe ich einige Bilder hinterlegt welche abwechselnd dargestellt werden.

jQuery Tools Example
Im Beispielbereich der jQuery Tools ist ein Anmeldungs Formular mit mehreren schritten, welche Step-by-Step abgearbeitet werden, erläutert. Hier wird im ersten Schritt der Benutzername eingegeben und wenn alle Informationen ausgefüllt sind kann zum nächsten Schritt “gerutscht” werden bis die Anmeldung abgeschlossen ist.

Erläuterung

Natürlich ist wieder die jQuery Tools Library nötig um folgendes Script zu verwenden. Der Download ist nach wie vor auf der jQuery Tools Seite zu finden

JavaScript

<script type="text/javascript">
$(document).ready(function(){
    $("div.scrollable").scrollable();
});
</script>

Dieses Stück Quelltext besagt das auf den Div Container mit der Klasse “scrollable” die Funktion Scrollable ohne jegliche weiteren Parameter angewendet werden soll. Das ist es im groben auch schon was man dafür brauch. Aber auch hier bieten die jQuery Tools viele viele Parameter mit denen man die Funktion weiter anpassen kann.

So kann man mit “size” die Größe der Schritte angeben, mit “vertical” ob das Scrollen statt horizontal vertikal ausgeführt werden soll und mit “items” welche Klasse die Bilder oder Texte beinhalten soll. Dies kann z.B. so aussehen:

<script type="text/javascript">
$(document).ready(function(){
    $("div.scrollable").scrollable({size: 1, vertical: true, loop: true});
});
</script>

Diese Parameter verändern das Scrollable dahin das nur 1 Bild weiter gescrollt wird, dabei aber Vertikal anstatt Horizontal und das wenn das letzte Element erreicht ist, wieder vorne begonnen werden soll.

Was brauchen wir an HTML und CSS um das ganze zu realisieren?

HTML

<!-- vorige Seite Button (wird mit CSS gestylet) -->
<a class="prevPage browse left"></a>
<!-- Die Scrollable haben wir im JavaScript Code als zu Scrollendes Objekt ausgewählt und muss den Rest beinhalten  -->
<div class="scrollable">
    <!-- Die Klasse "items" beinhaltet immer alle Bilder, es sei denn ein anderes Parameter ist angegeben -->
<div class="items">
        <img src="http://example.com/bild1.jpg" />
        <img src="http://example.com/bild2.jpg" />
        <img src="http://example.com/bild3.jpg" />
        <img src="http://example.com/bild4.jpg" />
        <img src="http://example.com/bild5.jpg" />
    </div>
</div>
<!-- nächste Seite Button (wird mit CSS gestylet) -->
<a class="nextPage browse right"></a>

CSS

div.scrollable {
    position:relative;
    overflow:hidden;
    width: 660px;
    height:90px;
}
div.scrollable div.items {
    width:20000em;
    position:absolute;
} 

Dieser CSS Code sagt das alles was in der Scrollable Klasse überhängt abgeschnitten werden soll. Die Items werden absolut positioniert und haben eine riesige Breite damit der komplette Inhalt nebeneinander dargestellt werden kann. Dadurch das Scrollable auf eine Breite von 660px begrenzt ist, gibt es hier keine Darstellungsprobleme.

Alles weitere an Feintuning entnehmt ihr wie immer der jQuery Tools Seite oder einem Beitrag auf noupe.com, welche ebenfalls die Funktionen sehr gut erläutert. Bei Fragen einfach ein Kommentar schreiben oder mich über Twitter kontaktieren.

Ähnliche Beiträge:

1. jQuery Tools – Teil 1: Tabs
2. jQuery Tools – Teil 2: Tooltips
3. jQuery Tutorial: mitskalierende Hintergrundbilder

Jetzt wurde die Aktion aufgebessert und Microsoft spendet insgesamt 16 Essen für jeden Download des IE8, wenn man vorher die veraltete Version 6 des Browser genutzt hat. Ein weitere ansporn also für alle, den IE6 verschwinden zu lassen.

Viele können davon profitieren… die Obdachlosen haben etwas zu essen, die User erhalten ein neues Browserfeeling, Webentwickler können endlich die Zeit welche sie sonst mit der Optimierung für den IE6 genutzt haben dafür nutzen moderne Techniken in die Seite einzubauen und Microsoft baut seinen Marktanteil evtl. wieder etwas aus.

Die Aktion läuft noch bis zum 30. September… also steigt um und ladet euch den neuen Browser runter – damit tut ihr mir, meiner Berufsgruppe und nochmehr – den Obdachlosen was gutes!

BrowserForTheBetter.com

Ähnliche Beiträge:

1. Der Internet Explorer 6 muss sterben…

Und genau da setzt jQuery Tools an – einmal als eigenständige Datei oder als Komplettpaket in Verbindung mit der jQuery Library auch wahlweise auf einem, von den Entwicklern bereitgestellten CDN (Content Distribution Network). So kann innerhalb von wenigen Sekunden jede Website durch schöne und sinnvolle Effekte aufgewertet werden.

Die jQuery Tools können hier heruntergeladen werden und bieten viele verschiedene Elemente um die eigene Seite durch Features in der Usability zu verbessern und optisch aufzuwerten – Tabs, Tooltips, Scrollable, Overlay, Expose und Flash Embed sind die Funktionen, welche die Library mit sich bringt. Was sich hinter den ganzen Begrifflichkeiten versteckt erläutere ich in dieser Reihe. Heute angefangen mit den Tabs, werde ich jeden Tag ein weiteres Element der jQuery Tools mitsamt Programmierbeispielen erläutern.

Tabs – für platzsparenden Content

Tabs sind seit einigen Jahren voll im Trend. Angefangen mit dem Mozilla Firefox welcher Tabs dazu nutzt um in nur einem Browserfenster möglichst viele Websites zu öffnen, ist es mittlerweile auch auf Websites gängig Tabs zu nutzen, um möglichst viel Content platzsparend unterzubringen.

Beispiele dafür findet man im Internet genug – Einsatzgebiete sind bevorzugt Klappmenüs oder aber um News, Suche und weiteres in einem Container zu verstecken und dem User nur das zu zeigen was er gerade benötigt.

Beispiele

Tintometer.de – Tabs werden hier genutzt um sehr viele Menüpunkte in einem Klappmenü unterzubringen.

AQUALYTIC.de – Hier werden mithilfe der Tabs die Suche, die News und die Produkte geschickt in einem Container versteckt. Der User bzw. Kunde hat schnellen Zugriff auf weitere Informationen.

Sportschau.de – Die Programminformationen für die kommenden Tage sind durch Tabs in Szene gesetzt und somit sind die Informationen schnell und leicht abrufbar.

Spox.com – Auch Spox benutzt Tabs um die vielen verschiedenen Sportarten zu unterteilen und dem jeweiligen Bereich die News schnell zur Verfügung zu stellen.

Der Einsatz von jQuery Tools

Durch jQuery Tools können die Tabs sehr leicht umgesetzt werden. Nur wenige Zeilen Code sind nötig und man hat ein wunderbares Ergebnis mit vielen Möglichkeiten der Individualisierung.

HTML
Der HTML Aufbau ist ziemlich einfach. Wir benötigen nur 2 Container. Einen mit den Links (Tab Buttons) und einen mit dem Inhalt der Tabs.

<ul class='tabs'>
<li><a href="#">Tab 1</a></li>
<li><a href="#">Tab 2</a></li>
<li><a href="#">Tab 3</a></li>
</ul>
<div class="tab-content">
<div>Tab 1 content</div>
<div>Tab 2 content</div>
<div>Tab 3 content</div>
</div>

JavaScript
Aber auch der JavaScript Teil ist nicht viel schwieriger. Nur eine einzige Funktion reicht um die Tabs umzusetzen. Es wird lediglich dem DOM Selektor mitgeteilt auf welchen Bereich er die Funktion anwenden soll. In diesem Beispiel dem HTML Element ul mit der Klasse tabs für die Navigation und die Container für das HTML Element div mit der Klasse tab-content und allen unterhalb liegenden div Containern.

$("ul.tabs").tabs("div.tab-content > div");

Aber auch weitere Parameter sind ohne weiteres möglich, so dass die Tabs den eigenen Wünschen sehr gut angepasst werden können.

$("ul.tabs").tabs("div.tab-content > div", {current: 'active', event: 'mouseover', effect: 'slide', fadeInSpeed: '500'});

In der geschwungenen Klammer {} werden die Parameter übergeben. Current gibt die Klasse bekannt die genutzt werden soll, wenn ein Tab aktiv ist. Event wird in diesem Fall genutzt um der Funktion mitzuteilen das sie bei einem Mouseover funktionieren soll und nicht bei einem Klick, wie gewöhnlich.

Effect stellt verschiedene Effekte aus der jQuery Library bereit, die der Programmierer nutzen kann um ein Tab zum Vorschein zu bringen. Standardmäßig wird hier nur zeigen und verstecken genutzt, aber alternativ können auch fade, slide und horizontal als Effekt hinzugefügt werden um eine schöne Animation zu zaubern. Der Parameter fadeInSpeed gibt die Dauer der Millisekunden an mit der die Animation durchgeführt werden soll. Dieser Wert sollte nach den eigenen Erfahrungen ausgefüllt werden.

Das ganze kann dann noch mithilfe von CSS optisch aufgewertet und den eigenen Wünschen weiter angepasst werden. Weitere Informationen und Parameter können der Entwickler-Seite entnommen werden.

Ähnliche Beiträge:

1. jQuery Tools – Teil 3: Scrollable
2. jQuery Tools – Teil 2: Tooltips
3. jQuery Tutorial: mitskalierende Hintergrundbilder

Die Diskussion über das Ableben des IE6 ist momentan größer denn je. Webdesigner und -entwickler fordern mit Nachdruck, dass eine weitere Unterstützung des Internet Explorers 6 unterbunden werden sollte. Die Fakten sind da: Der IE6 ist mitlerweile 8 Jahre alt, kann keine aktuellen Webstandards richtig umsetzten, die Dateiformate .png und .svg werden nur sehr geringfügig unterstützt und er bedeutet oft einen (riesigen) Mehraufwand bei der Umsetzung von Projekten.

Please update!

Die Entwicklung der Debatte rund um den IE6 entwickelt sich momentan dahin, das immer mehr große Web 2.0 Websites die Unterstützung fallen lassen und einen Hinweis darauf anbieten, doch bitte einen neuen und aktuellen Browser zu nutzen. Da ist unter anderem die Initiative “IE6 No More” mit einer Reihe an unterstützenden Websites und einem Warnhinweis, der allen Usern mit IE6 eine Update Meldung anzeigt.

Eine weitere Initiative sind die sogenannten “Twibbons” (Mini Logos auf Twitter Avataren). Hier gibt es ein Twibbon für die Kampangne “IE6 Must Die” mit mitlerweile mehr als 12.000 aktiv unterstützenden Usern. Der Nachteil hierbei ist, dass sich bei Twitter fast nur Internet Affine Menschen bewegen, welche mit dem IE6 eh nur noch selten was zu tun haben – es ist also nicht viel mehr als ein Statement ohne weiterem wirken.

Die Statistik sagt…

Größere Websites wie Xing (”Internet Explorer 6: Bitte wechseln Sie auf einen neueren Browser”) und Digg (”Much Ado about IE6″) haben sich in letzter Zeit daran gemacht ihre Statistiken auszuwerten und zu analysieren, wieviel und welche ihrer User noch den IE6 nutzen. Bei Xing ist man zu dem Ergebnis gekommen, dass die Seitenzugriffe des IE6 in der Woche sehr stark zulegen und am Wochenende eher gering sind. Dies ist ein Hinweis darauf das der IE6 nicht im privaten, sondern eher im wirtschaftlichem Umfeld (Arbeit) genutzt wird.

Und genau hier ist der Knackpunkt, welchen auch Microsoft in einem Pressebericht aufgreift – der IE6 wird von Usern genutzt die aufgrund der eingeschränkten Administrationsrechte im Büro oder aufgrund einer Terminal Server Infrastruktur im Betrieb nicht updaten können. Viele IT-Administratoren fehlt das Budget für ein Update der kompletten Serverlandschaft und verfahren aus diesem Grund nach dem Motto “Never change a running System” – eben auch aus dem Aspekt heraus das (fast alle) Websites noch für den IE6 optimiert werden.

Fazit

Der IE6 ist ein Browser, welchen niemand haben möchte – aber welcher auch auf absehbarer Zeit nicht so schnell vom Bildschirm verschwinden wird. Man kann den Vorgang als Webdesigner nur damit beschleunigen, indem man die Optimierung (sofern möglich) für den IE6 fallen lässt. Umso mehr Seiten es im Web gibt, die keine Optimierung mehr bieten, desto schwerer wird das arbeiten mit dem IE6 und die Administratoren bzw. Firmen sind irgendwann dazu gezwungen diesen Schritt zu machen.

Ähnliche Beiträge:

1. Update to IE8: Essen für Obdachlose

Zum Glück hat sich dieses Problem durch Breitband-Anschlüsse etwas verringert, trotzdem ist eine Optimierung der Website Geschwindigkeit nicht zu unterschätzen. Angriffspunkte um die Geschwindigkeit zu verbessern sind die Bilder, die CSS & Javascript Dateien und die gZip Komprimierung der Seite mittels PHP und Apache.

Bilder

Heutzutage ist es normal große, aufwändige Bilder zu nutzen um die Website optisch aufzuwerten. Die Möglichkeit hier: Abspecken der Bilder – entweder durch Photoshop oder Fireworks selber oder durch spezielle Komprimierungstools. Ein Online-Anbieter, welche die Dateien komprimiert ist Smush.it.

Hier können entweder Links zu den Bildern angegeben werden, welche Stapelweise verarbeitet werden – oder aber die andere Möglichkeit: Die Dateien werden nacheinander vom Desktop aus hochgeladen. Alle Bilder werden anschliessend in einer .zip Datei archiviert und können dann heruntergeladen werden.

CSS & Javascript

Ein wichtiger Punkt sind die CSS & Javascript Dateien – diese sollten nach Möglichkeiten ausgelagert werden, denn somit werden sie vom Browser zwischengespeichert und im Cache aufbewahrt. Sollte ein User nun die folgenden Seiten besuchen müssen diese Informationen nicht erneut geladen werden. Auch die CSS & Javascript Dateien sollten komprimiert werden, dafür gibt es eine Reihe von Online-Anbietern die dieses ermöglichen.

U.a. sind dies Javascriptcompressor.com, CSSDrive.com und Ebiene.de. Weitere sind leicht bei Google zu finden. Trotzdem ist beim komprimieren Vorsicht geboten, denn ab und an funktionieren anschliessend einige JS Funktionen nicht mehr. Hier sollte die eigene Website also anschliessend nochmals getestet werden. Um die Dateien weiter programmierfähig zu halten sollten 2 Versionen angelegt werden – eine komprimierte und eine lesbare an der weiterentwickelt werden kann.

gZip komprimierung

Eine oftmals unterschätzte Möglichkeit der komprimierung ist die “on-the-fly” Möglichkeit mittels PHP & Apache. Seit PHP4 gibt es die Möglichkeit durch einen Aufruf der Funktion ob_start(); die gZip komprimierung anzuschmeissen. Dafür muss lediglich folgender Code am Anfang der Seite plaziert werden:

<?php
     ob_start('ob_gzhandler');
?>

Dadurch wird die Seite zu lasten des Servers vor Ausgabe komprimiert und an den Browser gesendet. Die modernen Browser unterstützen dies Problemlos. Die älteren können durch eine Abfrage davon ausgenommen werden:

<?php
    if( strpos( @getenv ("HTTP_ACCEPT_ENCODING"),"gzip") !== FALSE)
        ob_start("ob_gzhandler");
?>

Eine weiter Möglichkeit ist das Apache Modul mod_gzip – Dazu sollte eine info.php mit der Funktion

<?php
    phpinfo();
?>

erstellt werden. Diese anschließend aufrufen und nachprüfen ob das Apache Modul vorhanden ist. Wenn dies der Fall ist eine .htaccess Datei erstellen und mit dem einfachen Befehl

SetOutputFilter DEFLATE

die gzip komprimierung aktivieren.

Abschluss

Es gibt noch ein paar weitere Möglichkeiten die Geschwindigkeit der Seite zu verbessern. Ein paar gute Anhaltspunkte hierfür gibt YSlow – ein Firefox-Plugin von Yahoo, welches die Website untersucht und weitere Verbesserungsvorschläge gibt.

Ähnliche Beiträge:

1. Fading Opacity mit Mootools
2. jQuery Tools – Teil 3: Scrollable
3. jQuery Tutorial: mitskalierende Hintergrundbilder

Die Neuerungen:

• Plugin-Schnittstelle integriert
• Rechtschreibprüfung
• Quick-Open (Schnelles öffnen von Dateien mit CMD+Q
• Syntax-Highlightning für Cappuccino (Objective-J)

Die Liste der Verbesserungen gestaltet sich auch dementsprechend lang. Die komplette Liste der Änderungen ist hier einzusehen.

Mithilfe der Plugin-Schnittstelle können Entwickler über den Coda Plugin Creator Arbeitsschritte vordefinieren oder aber auch z.B. selektierte Wörter – ähnlich einem WYSIWYG Editor – mit HTML Tags umschließen.

Für alle die Coda noch nicht kennen: Coda ist eine Entwicklungsumgebung für den Mac, die sich dadurch auszeichnet, dass alles in einem Programm steckt. Seiten können in verschiedenen Sprachen entwickelt werden, CSS kann innerhalb einer Benutzeroberfläche “zusammengeklickt” werden und der integrierte FTP-Client lädt alles anschließend durch das Klicken auf “Speichern” (CMD+S) automatisch hoch.

Die integrierten Bücher für PHP, Javascript, CSS und HTML sowie eine Terminal Session, eine Versionsverwaltung und die Preview zur sofortigen Darstellung der Seite runden das ganze ab.

Ähnliche Beiträge:

1. Wordpress Funktionssuche im Codex