Posts Tagged ‘standards’

Google Wave and IE-Support

Friday, September 25th, 2009

So after all Google has developed its Chrome Frame plugin for Internet Explorer for a good reason: enabling the majority of users – which are unfortunately still using Internet Explorer (6,7 AND 8) to have a better experience with HTML5-based websites.

Lars Rasmussen posted on the Google Wave Developer Blog that Wave will inform Internet Explorer users to install Chrome Frame for a better user experience. Reason being that Internet Explorer is just too slow at interpreting JavaScript and DOM Manipulations – features Wave heavily relies on. IE’s support of modern web standards such as HTML5 is pretty poor, too.

I’ve been experiencing the same issues with IE over and over for myself – yet in a smaller dimension: Every hour (and it have been many hours) a developer spends on the specific quirks on IE (which of course are different per each version) and to fix them for their application is not spent on adding cool new features or bug fixes which affect general issues.

Since this has been a problem for so a long time I hope this finally helps to fix this issue.

Introducing Jacqueline: unused CSS Selectors in Java

Monday, June 15th, 2009

Back in 2008 I wrote some articles about the proposed Selectors API for the DOM. Now, in 2009, it’s still “only” a working draft of the W3C. I’ve been exploring this topic for a long time, now I will finally have time to write about what I’ve been working on for several months.

Jacqueline is a library which will help you to find unused CSS Selectors in multiple HTML documents. This is a very important feature when you want to check a complete website: it will be almost certain that you have some CSS selectors used on page “A” but not on page “B” whereas “B” uses some CSS selectors which “A” doesn’t use.

Jacqueline is completely written in Java – this was necessary because we wanted to run it in our Java based infrastructure. This brings some other problems Jacqueline has to face: the DOM implementation in Java doesn’t feature the Selectors API. So I wrote a CSS-to-XPath engine – inspired by DOMAssistant. What this basically does is: it transforms CSS2.1 selectors into XPath queries which can then be used for node tests (since XPath support is included in the JDK) on the DOM tree of the HTML document.

Because our documents are still using HTML 4.0 (due to several problems when switching to XHTML 1.0) I had to use JTidy for building DOMs.

Jacqueline also uses Apache Batik to retrieve all the CSS rules and CSS selectors from a document – it was the only implementation of the SAC (Simple API for CSS) I got to run – and which had some special features. These include locator information of the found tokens for example.

At the moment Jacqueline only works single-threaded, but because this includes many cpu-intensive operations which could definitely be fastened by using the power of multiple cores I’m also dreaming of a multi-threaded version. Since most operations of Jacqueline could be executed in a parallel fashion this could bring a major speed-up.

The main thing of Jacqueline is that it’s one of the first pieces to the lately mentioned Project Mess Tool. We’ll be using the power of Jacqueline to detect unused CSS selectors in our web projects.

Finally, that stupid name: Jacqueline is named after Jacqueline Bouvier from my favorite TV show the Simpsons. See this poster in our office:

Jacqueline - Poster

Jacqueline - Poster

Visible Skip Menus bei 1&1

Monday, July 7th, 2008

Nach Anleitung von Nico Steiner habe ich für die Produktbereiche DSL und Mobiles Internet auf den Seiten von 1&1 sogenannte Visible Skip Menus umgesetzt.

Dabei handelt es sich um Sprunglinks zu den wesentlichen Inhaltsbereichen wie Navigation, Subnavigation und Seiteninhalt. Mittels dieser Technik können Nutzer die die Seite z.B. mit einem Screenreader betrachten schnell über unnötigen Content hinwegspringen.

Dazu werden die Links direkt im Document-Body platziert. Sie sollen für normale Betrachter nicht sichtbar sein, deshalb werden sie mittels CSS aus dem Dokument verschoben.

Doch auch “normale” Nutzer können einen Nutzen von diesen Links haben – sie sind ebenfalls über Tabstopps erreichbar. Und so sieht es aus:

Auf ähnliche Weise habe ich diese Links für dieses Blog gebaut. Man kann sie sehr einfach sehen indem man (Web Developer für Firefox vorausgesetzt) alle Styles deaktiviert. Oder einfach mal probeweise mittels Tab durchschalten. Hier sieht es dann so aus:

Apple “erweitert” Funktionsumfang von CSS

Monday, July 7th, 2008

Für alle die es noch nicht wissen: mit der neuen iPhone 2.0 Software nehmen laut Entwickler-Tutorials von Apple auch ein paar neuere CSS-Regeln Einzug – diese werden aus dem bestehenden Webkit-Zweig mit in den mobilen Safari des iPhones übernommen.

So hatte Apple einige Webkit-eigene Techniken für den mobilen Safari entwickelt mit Hilfe derer sich Elemente mittels CSS animieren und transformieren lassen sollen. Es gibt Eigenschaften für Rotate/Skew, aber auch z.B. um Elemente an einem Pfad entlangzuführen.

Vorteil laut Apple dabei: Der Frontend-Entwickler muss kein JavaScript-Coding mehr schreiben um Elemente mittels setTimeOut/setInterval zu animieren. Er gibt nur noch die Animationsparameter über CSS an und für die Anzahl der Zwischenschritte und eine flüssige Animation soll dann der Browser sorgen. Netter Nebeneffekt: aufgrund der Architektur des mobilen Safari (oder genauer: von OS X) kann dies dann sehr einfach von der Grafik-Hardware beschleunigt werden (oder wird es bereits?).

Laut Mark Malone – Apple’s iPhone & Internet Technologies Evangelist, der diese und weitere neue Features vorstellt – sind diese Eigenschaften zur Aufnahme in den offiziellen CSS-Standard beim W3C eingereicht worden.

Es bleibt zu hoffen, dass Apple auf diesem Weg sich trotzdem weiterhin an Standards halten wird. Irgendwie fühle ich mich bei derartigen CSS-Eigenschaften an gewisse mittels CSS einfärbbare Scrollleisten in einem gewissen Internet Explorer erinnert. Natürlich wurde auch damals niemand gezwungen dieses Feature zu verwenden.

Näheres wird sich zeigen wenn in 4 Tagen das iPhone 3G mit der neuen iPhone 2.0 Software erscheint.

Was spricht gegen diese CSS-basierten Animationen? Nun, vom momentanen Standpunkt gehören Animationen dieser Art eher mehr zum “Verhalten” statt zur “Darstellung” eines Elements. CSS ist jedoch eigentlich nur zur Manipulation der Darstellung gedacht, um Verhalten zu beeinflussen gibt es JavaScript.

Ein Vorteil ergibt sich jedoch zwangsweise daraus, und dieser dürfte vielen Entwicklern im ersten Moment sehr gut schmecken: die lästigen JavaScript-Schleifen zum Animieren der Inhalte fallen weg. Die Idee, diese Interpolation den Browser übernehmen zu lassen ist also sicherlich nicht schlecht. Und wenn es nur einmal mehr die “Designfehler” der Plattform namens Web zeigt, für die wir täglich entwickeln.

Auch vor diesem Hintergrund ist es immer ratsam, sich an Standards zu halten und Entwicklungen mit einer gewissen Weitsicht einfließen zu lassen.