Zapps Blog

Da ich mich partout nicht entscheiden kann, ob die Schrift hier im Blog zu gross, zu klein, oder angemessen ist, habe ich einfach mal eine Umfrage gestartet.

Da ich schon so viel an meinen Browsern herumgedreht habe, traue ich mir einfach keine unvoreingenommene Meinung mehr zu. ;-)

Ich habe momentan ein leichtes Déjà-vu-Erlebnis, das mich ein paar Jahre zurückwirft.

Als ich damals begann mich für HTML und CSS zu interessieren, fand ich die Möglichkeiten beider Sprachen faszinierend und das Konzept der Trennung von Inhalt und Layout einleuchtend. Der erste Tatendrang wurde zeitweise nur durch eine Software aus dem fernen Redmond gebremst: den Internet Explorer.

Version sechs verhielt sich oft anders, als man das angesichts des Codes erwarten sollte. Schnell war klar, dass das nicht nur am anfängerhaften Code sondern auch und vor allem am veralteten Browser lag und mit der Zeit und einigen Internetrecherchen lernte ich manche Eigenheiten des IE kennen. Begriffe wie „Star-HTML-Hack“ und „hasLayout“ verloren ihre Schrecken und so wurden Layouts möglich, die auch im im IE 6 und seinem grossen Bruder IE 7 akzeptabel aussehen.

Nun stehe ich mit JavaScript wieder am Anfang einer neuen Websprache und was soll ich sagen: Die Probleme sind ähnlich. Es gibt recht klare und einleuchtende Konzepte, die in der Praxis am IE scheitern.

So gibt es etwa die setAttribute-Methode, die einem Knoten ein Attribut zuweisen kann. Einem Link kann beispielsweise mit linkknoten.setAttribute("class","externer"); die Klasse „externer“ zugeteilt werden, die man mit der komplementären getAttribute-Methode auch wieder auslesen kann. Mit der gleichen Syntax könnte der Link auch noch href- und title-Attribute bekommen, bevor er schliesslich in den Dokumentenbaum eingehängt wird. setAttribute ist universell einsetzbar und hat eine leicht zu merkende Syntax, warum sollte man sich für das Setzen und Auslesen von Klassen noch mit dem Wissen um die vergleichsweise spezielle className-Eigenschaft eines Knotens belasten müssen?

Ganz einfach: Weil der Internet Explorer in seinen beiden am weitesten verbreiteten Inkarnationen nicht zuverlässig damit klar kommt.

Durch setAttribute gesetzte Klassen, die der IE-DOM-Inspektor auch sieht, werden dann auf einmal vom CSS nicht beachtet oder Klassennamen werden nicht korrekt ausgelesen, weshalb das betreffende Script dann natürlich nicht im IE funktioniert.

Genau das gleiche Problem existiert im IE bei der Behandlung des onclick-Attribut, auf das man verzichten und stattdessen knotenname.onclick = function(){}; einsetzen sollte.

Dummerweise stand das nicht in meinem ansonsten wirklich genialen Lehrbuch, was mir einige Stunden Gefluche mit meinem Lieblingsbrowser eingebracht hat. Bei einem so diffusen Problembild war meine Webrecherche erfolglos, und auf die Idee, bei SELFHTML ausgerechnet bei setAttribute nachzuschlagen um dort eine eindringliche Warnung inklusive Erklärung des Phänomens zu finden, bin ich leider nicht gekommen. So brachte erst ein beiläufiger Hinweis in einem JavaScript-Cheatsheet die Erleuchtung.

Und damit Google in Zukunft eine Stelle mehr im Web findet, die von Anfängerproblemen mit JavaScript, Klassen, Event-Handlern und dem Internet Explorer berichtet, habe ich diesen kleinen Beitrag verfasst.

Und zwar beim CERN, wo heute morgen die ersten Protonenstrahlen im LHC zirkulieren.

Der Start scheint rundum geglückt zu sein, zumindest wenn man sich angesichts des zusammengebrochenen Live-Webcasts auf einen Augenzeugen verlassen kann:

Es läuft alles viel besser als geplant. Die Physiker sind alle ganz aus dem Häuschen (und die Ingenieure wohl auch).

Ali Arbia

Die ersten Umläufe knapp unterhalb der Lichtgeschwindigkeit sind geschafft, man kann also mit Spannung auf die ersten Kollisionsexperimente in einigen Wochen warten.

Das CERN liefert mit seinem neuen Superbeschleuniger ein schönes Beispiel dafür, dass ein milliardenschweres und über Jahrzehnte international geplantes Grossprojekt auch auf Anhieb funktionieren kann. Ob's wohl daran liegt, dass hier Forschungs- und nicht ausschliesslich Wirtschaftsinteressen im Vordergrund standen?

So ganz bin ich noch nicht zufrieden und an manchen Stellen lugt noch das alte Layout hervor, aber um es leichter Testen zu können, stelle ich jetzt einfach mal das überarbeitete Layout online.

Das Rot konnte ich langsam nicht mehr sehen. ;-)

Momentan schreibt ja jeder was zu Googles neuem Browser, erstaunlich viele Kommentare sind sogar schon vor seiner Veröffentlichung erschienen. Die Marketingmasche des Suchmaschinengiganten scheint also voll aufzugehen, ähnlichen Wirbel machen sonst nur Produktankündigungen aus dem Hause Apple.

Da ich meine Gedanken zur neusten IE-Alternative für eine andere Seite schon mal zusammengefasst habe, hier nun auch mein Beitrag zum Chrome-Hype.

Erster Eindruck

Chrome wirkt aufgeräumt, die nur bei Bedarf eingeblendete Statusleiste spart Platz. Dafür lässt sich sein Layout momentan überhaupt nicht an eigene Wünsche anpassen. Wenn ich wollte, könnte ich z.B. Firefox auch entsprechend abrüsten, aber Chrome kann ich nicht aufrüsten.

Dass sich Chrome ungefragt und ohne dass man Einfluss darauf nehmen könnte unter

C:\Dokumente und Einstellungen\Benutzername\Lokale Einstellungen\ Anwendungsdaten\Google\Chrome\

installiert und damit geschickt die Benutzerrechte zur Installation neuer Programme aushebelt, passt ins unflexible Bild.

Der Google-Browser startet sauschnell, was ich aber nicht überbewerten mag. Der Browser wird schliesslich nur einmal gestartet und läuft dann stundenlang, da kommt es IMHO beim Start nicht auf jede Sekunde an. Ähnliches gilt für die Surfgeschwindigkeit, Chrome ist zweifellos schnell, aber mir sind bislang die anderen Browser auch nicht als übermässig langsam aufgefallen. Das WOW-Erlebnis ist bei mir jedenfalls ausgeblieben. Aber das war es auch schon, als Steve Jobs damals Safari zur Rakete unter den Browsern erklärte. ;-)

Schön ist, dass er wegen des WebKit-Unterbaus erwartungsgemäss solide arbeitet. Keine Probleme mit Seiten bislang und die Standardkonformität scheint in Ordnung zu sein. Ich wundere mich allerdings, dass Google die Marketinggelegenheit eines bestandenen Acid3-Tests ausgelassen hat. Da sind seine nahen Verwandten Safari 4 und WebKit Nightly schon weiter. Aber jeder weitere standardkonforme Browser, der vielleicht dem IE 6 (und 7) Marktanteile wegnehmen kann, ist schon mal positiv. Konzeptionell ist die Abschottung der Tabs voneinander eine gute Idee, auf die Microsoft im IE 8 ja auch schon gekommen ist. So reisst ein mieses Javascript nicht mehr den ganzen Browser in den Tod.

Schwächen sehe ich bei der Personalisierung. Ich finde die Tabs ganz oben ungünstig, da ich eher zwischen Tabs umschalte, als etwas in die Adresszeile eingebe. Chrome gibt mir keine Möglichkeit ihre Position zu ändern. Natürlich fehlen auch die ganzen Erweiterungen, die z.B. Firefox bietet und für mich unverzichtbar sind: AdBlock, Greasemonkey, NoScript, WebDeveloper etc.

Auch die individuelle Anpassung von Webseiten scheint Chrome (noch?) nicht zu unterstützen. Kein User-JavaScript oder User-Stylesheet, wie es Firefox oder Opera kennen, und die es mit etwas Hintergrundwissen ermöglichen, sich seine Stammseiten den eigenen Wünschen gemäss zu gestalten.

Die RSS-Unterstützung ist ebenfalls momentan sehr rudimentär bis nicht vorhanden. Chrome fragt ja nicht mal nach, was er machen soll, wenn er auf einen RSS-Feed trifft, Google sollte/wird hier sicher eine direkte Verbindung zum Google-Reader schaffen.

Ganz negativ ist natürlich die Tatsache, dass in Chrome eine individuelle Benutzer-ID steckt (daher wohl auch die individuelle Installation für jeden Benutzer), die es Google ermöglicht, die Surfgewohnheiten noch besser zu erforschen. Die Datenschutzerklärung überzeugt mich auch nicht richtig und es stellt sich schon die Frage, ob man einer Firma wirklich sein gesamtes Netznutzungsverhalten hinterherwerfen sollte. Das muss aber jeder für sich entscheiden.

Fazit

Chrome sieht nett und schnell aus, hat aber zumindest in der aktuellen Beta Schwächen im Detail und auch bei der Sicherheit.

Für mich ist er schon allein wegen der mangelnden Anpassungsfähigkeit und ganz abgesehen von eventuellen Datenschutzbedenken momentan keine Alternative zu Firefox und Opera.

• kann nicht mehr per

  html/*\*/>/*/*/body {} head/*\*/+/*/*/body {} html/*/*/>/*/*/body {} head/*/*/+/*/*/body {} html>/**/body {}

  von CSS ausgeschlossen werden.

  Zwischen Beta 1 und Beta 2 hat es hier wohl massive Änderungen in Richtung Standardkonformität gegeben, bei einer zugegebenermassen ziemlich kurzen Suche habe ich noch keinen funktionierenden Hack gefunden.

• versteht nun auch

  @import url(style.css) all;

• interpretiert manche CSS-Angaben aber immer noch so saudumm wie seine Vorgänger.

  Die Unterstützung von @font-face kann man nicht unbedingt erwarten, aber warum produziert das Ding bei

  @font-face { font-family: GraublauWeb; src: url(../fonts/GraublauWeb.otf) format(truetype); /* www.fonts.info */ }

  eine Anfrage nach

  GraublauWebBold.otf)format(truetype

  und damit unweigerlich einen 404?

Grumpf!

Um nicht aus dem Training zu kommen, stand am Samstag eine Tour auf dem Programm, die ich meiner Begleiterin als „klein und flach” verkauft habe.

Es ging mal wieder nicht in die Berge, sondern in das mit der S-Bahn nur eine halbe Stunde von Bern entfernte Schwarzenburg. Von dort aus wanderten wir teilweise auf dem Jakobsweg und schliesslich den Schwarzwasser- und Sensegraben entlang nach Thörishaus.

Die Schwarzwasser hat sich im Laufe der Zeit tief in die Landschaft eingeschnitten. Ihr oberer Flusslauf ist nur an einigen Stellen zugänglich, während im Bereich der Schwarzwasserbrücke der Wanderweg direkt entlang des Flusses führt. Hier kann man sich dann auch der Nase nach leiten lassen und kommt so problemlos von Grillstelle zu Grillstelle bis zur Bahnstation.

Eine der von Microsoft gross beworbenen Neuerungen des Internet Explorer 8 wird die Unterstützung von Webslices sein.

Webslices ähneln einem RSS-Feed darin, dass sie dem IE-Benutzer erlauben, Inhalte aus einer Internetseite herauszulösen und sie bequem über die Lesezeichenliste zugänglich zu machen. Das entsprechende „Bookmark” erscheint ausserdem fett gedruckt, wenn sich der Inhalt des Webslice geändert hat.

Konzeptionell ist das nichts besonders neues, der Grundgedanke ähnelt RSS-Feeds und die Umsetzung entspricht letztlich einem von Microsoft definierten Microformat mit den drei Bezeichnungen hslice, entry-title und entry-content.

<div class="hslice"> <h2 class="entry-title">Aktuelle Meldungen</h2> <ul class="entry-content"> <li></li> <li></li> </ul> </div>

Beispiel 1: Der Inhalt der gesamten Liste kann in einem Webslice mit dem Titel „Aktuelle Meldungen” dargestellt werden.

<div class="hslice"> <h2 class="entry-title">Aktuelle Meldungen</h2> <h3 class="entry-content"></h3> <p><p> <h3 class="entry-content"></h3> <p></p> </div>

Beispiel 2: Hier werden nur die Artikelüberschriften, nicht jedoch die Artikeltexte im Webslice auftauchen.

Allerdings ist die Integration der Inhalte im IE 8 deutlich hübscher lösbar, als mit der rudimentären RSS-Unterstützung, die etwa Live-Bookmarks bieten. Somit könnten sich neue Anwendungsgebiete eröffnen, von Microsoft wird gerne die Verfolgung von Auktionen bei eBay als Beispiel angegeben.

Das klingt alles ganz einfach, hat aber einen kleinen Nachteil: Erstellt man Webslices mit dieser simplen Methode, gestaltet sich ihr Layout einigermassen schwierig. Im Vorschaufenster wird um die entry-content-Elemente einfach ein <body></body> gelegt, auf den die gleichen CSS-Selektoren zutreffen, wie auf den eigentlichen Body der Ursprungswebsite. Ist dort beispielsweise eine Hintergrundfarbe angeben, die der Farbe der h3-Ãœberschriften im Webslice-Container entspricht, hat man das klassische Problem des schwarzen Adlers auf schwarzem Grund.

Aber Microsoft wäre nicht Microsoft, wenn sie dafür nicht eine typische Lösung parat hätten: Man möge seinem „richtigen” Body doch bitte eine ID oder Klasse zuweisen und ihn dann darüber ansprechen â€¦

Das halte ich aus semantischen Gründen nur für begrenzt sinnvoll und so habe ich mich bei meinen Experimenten mit einem Selektor, der die ID eines übergeordneten ausserhalb des Webslice liegenden Containers enthält, beholfen. So ist nun die Rubrik „Aktuelles” aus der Navigationsspalte auch als Webslice zu haben.

Wer sich das Ganze mal anschauen mag, braucht aber nicht unbedingt den IE 8 zu installieren, die Webchunks-Erweiterung rüstet eine Websliceunterstützung für den Firefox nach. Die Erweiterung ist noch nicht ganz ausgreift, inkompatibel zur All-in-One-Sidebar-Erweiterung und legt die Slice-Links in einer separaten Toolbar statt zu den Lesezeichen ab, aber für einen ersten Eindruck der Möglichkeiten reicht’s.

Mit einem selbst zu schreibenden Greasemonkey-Script ist es ausserdem möglich, von jeder beliebige Seite Webslices für den Firefox zu erstellen.

Update (02.09.2008):

Webchunks scheint mit der Angabe einer spezifischen Vorschauseite nicht klarzukommen. Daher benutzt Webchunks hier im Blog die wie oben beschrieben eingebetteten Webslice-Informationen, während der IE 8 im Vorschaufenster richtigerweise die per

eingebundene Alternativseite zeigt.

Durch die Angabe einer Alternativseite eröffnet sich die komplette Palette an CSS-Gestaltungsmöglichkeiten für die Webslice-Vorschau, worauf Firefox-Benutzer momentan wohl leider verzichten müssen.

Nachdem der letzte Ausflug zum Creux du Van zwar sehr stimmungsvoll aber aussichtstechnisch nicht wirklich überzeugend war, bot sich beim diesjährigen Laborausflug die Möglichkeit einen zweiten Anlauf zu nehmen.

Tatsächlich hatten die Wolken ein Einsehen und verzogen sind während unseres Aufstieges in höhere Atmosphärenschichten. So kann ich nun einige Bilder des grossen Felsenrundes nachliefern.

Am letzten Wochenende stand eine kleine aber sehr schöne Wanderung im Baltschiedertal auf dem Programm.

Nach der Postautofahrt von Visp nach Eggerberg, Eggen ging es entlang der alten Gorperi-Suone  das Tal hinauf. Teils durch Wälder, teils an steilen Abhängen entlang, gelangten wir zur Brücke über den Baltschiederbach, die den Beginn des Abstieges nach Eggerberg markierte.