Jeder der mit der Webprogrammierung zu tun hat, steht immer wieder vor dem Problem, dass die Seiten in einem anderen Browser oder auf einer anderen Plattform (Mac, Windows, Linux, Android usw.) anders gerendert werden (in Bildpunkte umgesetzt), und damit ein anders Aussehen haben. In Handbüchern und auf Webseiten über die HTML- und CSS-Programmierung sind unzählige «Hack's» beschrieben, welche Abhilfe bieten können. Alles recht kompliziert und schwierig zu handhaben.
Die einfachste und praktikabelste Lösung bietet Rafael Lima auf seiner Website. Mittels eines Java-Script wird festgestellt, welcher Browser und welches Betriebssystem der User hat. Bei Abruf der CSS-Anweisungen werden diese mit den spezifischen Definitionen für den Browser und das Betriebssystem überschrieben. Funktioniert wunderbar und problemlos! – bis auf wenige Ausnahmen.
Firefox auf Mac
Firefox auf Windows – gratuliere!
Internet-Explorer 9 oder 10
Internet-Explorer 5 – veraltet!
Android
Google Chrome
Opera auf Mac
Opera auf Windows
Safari auf Mac – super!
Safari auf Windows
i-Pad
i-Phone
Selten oder veraltet
Firefox | Internet-Explorer | Android | Chrome | Opera | Safari | i-Pad | i-Phone | anderer |
Internet-Explorer 6 – veraltet!
Firefox | Internet-Explorer | Android | Chrome | Opera | Safari | i-Pad | i-Phone | anderer |
Internet-Explorer 8
Firefox | Internet-Explorer | Android | Chrome | Opera | Safari | i-Pad | i-Phone | anderer |
Internet-Explorer 7
Firefox | Internet-Explorer | Android | Chrome | Opera | Safari | i-Pad | i-Phone | anderer |
Internet-Explorer 6 und 7 auf Windows XP und Internet-Explorer 8 auf Windows 7 sollten diesen Browsertest ebenfalls korrekt darstellen. Trotzdem die Empfehlung: Laden Sie sich Google-Chrome oder Firefox herunter. Diese stellen Webseiten perfekt dar und sollten auf Ihrem Betriebsystem perfekt laufen. Die oben beschriebene Lösung ist für die veralteten Versionen des Internet-Explorers sehr aufwendig zu realisieren.
Normalerweise werden Websites, die für Firefox oder Safari (WebKit-Engine) programmiert werden, auf allen anderen Browsern mehr oder weniger gleich dargestellt. Probleme machen Internet-Explorer 6 und 7, die aber glücklicherweise immer weniger zum Einsatz kommen. Das iPhone stellt mit seinem Safari-Browser die Webseiten perfekt dar. Für spezielle Anwendungen ist es allerdings ratsam, eine spezielle Programmierung für Smartphones zu machen. Was das Richtige ist, ergibt sich erst nach einer Diskussion über Ziele des Website-Betreibers und die User-Bedürfnisse. Mit diesen Browsern rufen User Schweizer Websites auf.
Wie es der Name sagt, kann man auch E-Mails mit HTML- und CSS-Anweisungen benutzerfreundlich gestalten. Da E-Mails oft auch auf Smartphones gelesen werden, braucht es für diese Geräte eine spezielle Programmierung. Die Hersteller haben dies berücksichtigt und spezielle CSS-Klassen geschaffen, mit denen man sauber programmieren kann.
Realisiert mit einer reinen HTML- und CSS-Programmierung. Der Test demonstriert, dass dies möglich ist. Auf die gleiche Art kann – was immer wichtiger wird – auch eine saubere Darstellung für Tablets, Handhelds und Smartphones gemacht werden.
Mit einem Java-Script wäre dieser Browser-Detector auch realisierbar, wobei dazu braucht es immer auch CSS-Anweisungen.
Der Browser-Detector als alleinstehende Seite.
So sieht meine Website in einem anderen Webrowser aus. Browser Stack