Macht eure Website kompatibel für alle Browser!

Montag, 8. September 2008

Seit seinem Erscheinen ist Google Chrome für viele Websurfer ein schneller, aufregender neuer Browser . Ein guter Zeitpunkt, um euch als Webmaster daran zu erinnern, dass Browser-Kompatibilität eine hohe Priorität hat, egal mit welchem Browser die User eure Website besuchen – Firefox, Internet Explorer, Google Chrome, Safari etc. Wenn eure Site schlecht dargestellt wird oder in vielen Browsern schwierig zu verwenden ist, riskiert ihr, das Interesse eurer Besucher zu verlieren, und, falls ihr eine kommerzielle Website betreibt, vielleicht potenzielle Kunden. Hier ist eine kurze Liste mit den wichtigsten Grundlagen für eine browser-kompatible Website:

Schritt 1: Browser-Kompatibilität durch gute Accessibilty erreichen
Dieselben Techniken, die dafür sorgen, dass eure Website zugänglich für Suchmaschinen ist, z. B. statisches HTML im Gegensatz zu aufwendigen Funktionalitäten wie AJAX, fördern meistens auch die Kompatibilität eurer Website mit verschiedenen Browsern und zahlreichen Browser-Versionen. Einfacheres HTML ist häufig eher cross-browser-kompatibel als die neueste Technik.

Schritt 2: Zieht es in Betracht, euren Code zu validieren
Wenn euer Code valide ist, habt ihr einen möglichen störenden Faktor für die Browser-Kompatibilität beseitigt. Mit validiertem Code braucht ihr euch nicht mehr auf die Art der Fehlerbehandlung der verschiedenen Browser zu verlassen, und es ist einfacher, weitere potenzielle Fehler zu beheben.

Schritt 3: Überprüft, ob eure Website nutzbar ist (und nicht nur vernünftig dargestellt wird)
Es ist wichtig, dass eure Website gut angezeigt wird, doch genauso wichtig ist es, sicherzustellen, dass die User die Funktionen eurer Website in ihrem Browser auch nutzen können. Anstatt einfach nur einen Ausschnitt eurer Website anzusehen, wäre es besser, wenn ihr euch außerdem durch eure Website in verschiedenen Browsern navigiert oder Artikel zu eurem Einkaufswagen hinzuzufügt etc. Es ist möglich, dass die klickbare Fläche eines verlinkten Bildes oder eines Buttons von Browser zu Browser variiert. Falls ihr darüber hinaus etwa JavaScript für Komponenten wie den Einkaufswagen einsetzt, kann es sein, dass dies in einem Browser funktioniert, in einem anderen jedoch nicht.

Schritt 4: Fehler ausbügeln
Dieser Schritt erfordert etwas Herumprobieren, allerdings gibt es verschiedene gute Websites, die euch dabei helfen, die Anzahl der Versuche zu reduzieren, während ihr eure Website cross-browser-kompatibel macht. Doctype ist eine Open Source-Referenz mit Testfällen für Cross-Browser-Kompatibilität sowie mit Tipps und Tricks für CSS.

Fragt ihr euch beispielsweise, wie ihr den Offset für ein Element eurer Website finden könnt? Funktioniert euer Code problemlos in Internet Explorer, aber nicht in Firefox und Safari? Es hat sich gezeigt, dass gewisse Browser ein bisschen sensibel reagieren, wenn es darum geht, den Offset zu finden – zum Glück stellen die Helfer des Doctype-Projektes Code zur Verfügung , um dies zu vermeiden.

Schritt 5: Was sind eure Tipps und Quellen zur Browser-Kompatibilität?
Wir fänden es super, von euch zu hören, welche Schritte ihr unternehmt, um sicherzustellen, dass eure Seite für die meisten Besucher funktioniert. Wir haben einen tiefergehenden Artikel in der Hilfe für Webmaster geschrieben, der sich mit Themen wie Zeichenkodierung auseinandersetzt. Falls ihr zusätzliche Tipps zu Browser-Kompatibilität habt, teilt sie uns gerne mit! Und falls ihr Fragen habt, speziell die Suche betreffend, wendet euch einfach an uns!

Workin' it on all browsers (English version)

Post von Maile Ohye, Developer Programs Tech Lead (Übersetzung von Anna-Julia Danisch, Search Quality)