Der Firefox ist schon ein bisschen in die Jahre gekommen und muss sich inzwischen dem Problem stellen erfolgreich zu sein. So erfolgreich, das der Glaubenskrieg schon lange voll ausgebrochen ist.
Ich will gar nicht über die absolute Geschwindigkeit reden. Klar. Da gibt es die WebKit-basierten Browser, die hier sicher die Nase vorne haben. Oder den Opera, der unberechtigter Weise immer am Rand steht.

Für mich als Entwickler ist der Firefox schlichtweg unersetzlich. Und da spielt die Zeit für den Seitenaufbau eher eine untergeordnete Rolle. Es geht um die Zeit, die man braucht einen (Hinweis auf einen) Bug zu finden.
Die Add-ons des Firefox sind die wahren Gewinner. Man muss immer aufpassen nicht zu viele zu installieren/ aktivieren – anderfalls kann es schon ziemlich unerträglich langsam werden ;)

Meine TOP-Add-ons:

1. Firebug
   Der Safari hat auch eine schöne Debug-Console. Aber der Firebug ist ein Quäntchen besser. Das mag die Gewöhnung sein, aber es ist alles da, wo es sein muss.
   Als Add-on im Add-on ist da noch Firecookie zu empfehlen – tut genau das was der Name vermuten lässt.
2. Web Developer
   Man könnte meinen das man durch den Firebug die Web Developer-Toolbar weglassen könnte. Man könnte es meinen.
   Aber mit “Disable” und “CSS” habe ich da die sicher am meisten geklickten Menüs unterhalb dessen ich Dinge wie den Cache bis hin zu selektiven Stylesheets alles ein- und ausschalten kann. Nur wenige Klicks oder gemerkte Shortcuts entfernt.
3. FoxyProxy Standard
   Eine elegante Verwaltungsmöglichkeit von Proxy-Servern. Inkl. Nutzung verschiedener Proxies anhand von URL-Patterns. Ein absolutes Muss im Zusammenhang mit ssh-SOCKS “-D” oder paros-proxy.
4. Screengrab
   Screenshots auf Basis von Systemtools sind heute jedem geläufig. Aber sobald man eine ganze Website haben will, die nicht komplett auf den Monitor passt, dann wird es lästig. Screengrab ist einfach zu bedienen (nur wenige, leicht verständliche Optionen) und liefert ein wunderbares PNG der aktuellen Seite.
5. JSONView
   Ein XML-File schnell im Browser öffnen und ein wenig “durchblättern” – kein Problem.
   Mit JSONView geht das auch wunderbar bei JSON-formatierten Daten.

Es gibt dann noch eine Menge mehr an Add-ons die mehr oder weniger regelmäßig aktiv nutze oder phasenweise disabled belasse. Da gehören z.B. der “DNS Flusher“, das “Adblock Plus” oder “Greasemonkey” dazu.

Für die Gestaltung von Subnav-Boxen einer Kundenwebsite, wollten wir  Schatteneffekte mit reinem CSS erstellen – ohne die Verwendung von background-images.

Das gelingt mit der CSS3 Eigenschaft”box-shadow” sehr schön, die Styledefinition lautet dann z.B. für den Firefox (Gecko) so:
-moz-box-shadow: 8px 8px 18px #6f7072;

Diese CSS-Eigenschaft benötigt folgende Angaben:

Der 1. Wert: “x-Abstand”
Er verschiebt  den Schattens horizontal. Ein positiver Wert verschiebt den Schatten nachch rechts, ein negativer nach links.

Der 2. Wert:  “y-Abstand”
Er verschiebt  den Schattens vertikal.  Ein positiver Wert positioniert den Schatten unten, ein negativer oben.

Der 3. Wert : “Blur-Radius” (optional)
Die Größe des Weichzeichnereffektes.
Je größer der Wert, desto größer und transparenter wird der Schatten. Wenn kein Wert angegeben wird, wird der Wert auf 0 gesetzt.

Der 4. Wert  hier definiert die Schattefarbe.

Es ist noch ein  weitere Wertangabe, vor der Farbdefinition, möglich:
“Spread-Radius” (optional)
Der “Überfüllungs-Radius”, er vergrößert bei positivem Wert den Schatten und weitet ihn aus – und umgekehrt.
Wenn kein Wert angegeben wird, wird der der Wert auf 0 gesetzt.

Anmerkung:
Wenn “inset” (optional)  als keyword angegeben ist, wird der Schatten nicht außen, sondern innerhalb des Rahmens gezeichnet.
Inset Schatten werden über dem Hintergrund, aber unter Rahmen und Inhalt dargestellt.

(more…)

On wednesday we’ve relaunched deam.org. The content-block is encased with a nice, white glow-effect. Of yourse not for all you IE-users out there ;-)
We’ve used the two “box-shadow”-attributes. The “-moz-box-shadow” for Firefox and the “-webkit-box-shadow” for Safari (and them derivates).

Thats what we’ve used: -webkit-box-shadow: 0 0 200px #fff;
And that “killed” my mobile safari. It has been unresponsive for several seconds. And after one interaction again unresponsive… and so on.

After stopping and starting Safari it went blank. No more interaction. Only thing that worked: Reset the cache in the prefs.

I should add that it’s a 3G iPhone (no “S”).
There are definitly some memory-issues here :-)

Now we use “-webkit-box-shadow: 0 0 20px #fff;” – doesn’t look that “smooth”, but it’s ok.

Wie gerne vergesse ich, das dieses Blog ja auch geeignet ist über die eigenen Kundenprojekte zu sprechen. Es gibt so einige Dinge über die ich nicht sprechen darf, oder nur sehr vage Aussagen möglich sind. Es gibt aber auch Projekte bei denen ich keinen Maulkorb auf habe.

Im Juli 2005 ging die erste Version der kloster-ensdorf.de online. Bis zum Ende des Jahres 2005 wurden noch diverse Erweiterungen vorgenommen und dann gab es im Grunde ein lange Pause für uns – die Seite lief einfach gut und das ist in meinen Augen ein wichtiges Ergebnis.
Bereits 2008 wurde mit Jürgen Zach über eine optische und funktionale Änderung nachgedacht. Im März diesen Jahres fand dann unser Kick-Off statt.

Die optische Gestaltung wurde diesmal nicht von uns gemacht, sondern von Michael Brandel (grafikbuero-brandel.de). Den Hauptteil der Abstimmung und der Umsetzung in HTML hat meine Kollegin Stefanie Graf übernommen. Dabei war unser Fokus auf zwei Bereichen:

1. nicht alles neu schreiben, was nicht unbedingt sein muss
2. sich – wo nur möglich – von dem Ballast des HTML-Table-Aufbaus trennen

Bei all den Wünschen und unseren Ansprüchen hat sich gezeigt, das Punkt (1) nicht so wirklich gut einzuhalten war – es ist wie mit den guten Vorsätzen zum Jahreswechsel ;-)
Punkt (2) haben wir zu 90% erreicht. Auf der öffentlichen Seite würde ich sogar von 95% sprechen.

Wir haben nicht so viele sichtbar neue Funktionen integriert (RSS-Feed für die Newsmeldungen, Pressespiegel, Galerie aufgepeppt, …), sondern mehr “unter der Haube” gearbeitet. Ganz “nebenbei” wurden u.a. folgende Änderungen durchgeführt:

• Umstellung von ISO auf UTF-8
• Suche mit einer sphinx-Konstruktion mit sematischem Charakter
• bessere HTML-Auszeichnung (label-Tag, title-Attribute, li, etc.)
• verbesserter Mailversand

Der Schwerpunkt lag also ganz eindeutig in der Optik und der Überarbeitung der inhaltlichen Struktur.
Es wird noch einige Iterationen der www.kloster-ensdorf.de geben. Einige davon wird der Besucher dann noch merken, aber die meisten beziehen sich dann doch darauf die Arbeitsprozesse für die Administratoren des Klosters zu vereinfachen. In jedem Fall hoffen wir das die neue Seite gut ankommt.

Achja: Wir verwenden unser eigenes framework. Kein bloat-code wie Typo3 oder Drupal. Nicht das ich ein Problem mit Typo3 und Konsorten habe, aber nur weil man “damit alles machen kann” muss man es ja nicht gleich blind einsetzen. Ich persönlich bin immer noch nicht davon überzeugt das solch generische Werkzeuge (und dazu gehört für mich auch CackePHP) für jeden Einsatz geeignet sind. Meine Erfahrung bislang: Je größer das framework, je größer die Hardware. Und bei den Mittelstandsprojekten an denen ich bislang beteiligt war, gab es immer irgendwo eine Budget-Grenze (für Hardware)…