Wie zeigen Browser Webseiten an und warum sehen sie nicht immer gleich aus?

Beim Surfen im Internet ist es nicht ungewöhnlich, auf Websites zu stoßen, die von Gerät zu Gerät unterschiedlich aussehen. Möglicherweise funktionieren einige Funktionen überhaupt nicht.

Dies ist oft kein Problem mit der Website. Es ist dein Browser. Die fünf wichtigsten Desktop-Browser verwenden vier verschiedene “Rendering-Engines” So zeigen Sie eine Webseite an - den neuen Microsoft Edge-Browser Microsoft erhält den Edge, 1 Milliarde Geräte mit Windows 10 und mehr… [Tech News Digest] Microsoft erhält den Edge, 1 Milliarde Geräte mit Windows 10 und mehr… [Tech News Digest ] Microsoft hat den Rand, Windows 10 ist riesig, Secret wird geschlossen, MS-DOS-Spiele in Tweets eingebettet, mit Silent Hills Geld verdient und Michael Bay wird von einem Amateur-Filmemacher beobachtet. Lesen Sie mehr für Windows 10 wird ein fünftes eingeführt - und jedes funktioniert anders.

Dies bedeutet, dass sich Ihre Web-Erfahrung ändern kann, je nachdem, welchen Browser Sie verwenden und sogar welche Version dieses Browsers.

Was ist eine Rendering Engine??

Eine Webseite ist keine einzelne Entität, die heruntergeladen und Pixel für Pixel auf dem Bildschirm angezeigt wird. Stattdessen handelt es sich im Wesentlichen um eine Reihe von Anweisungen, die in verschiedenen Arten von Code geschrieben sind - HTML, CSS, JavaScript. Was ist JavaScript und kann das Internet ohne es existieren? Was ist JavaScript und kann das Internet ohne es existieren? JavaScript ist eines der Dinge, die viele als selbstverständlich betrachten. Jeder nutzt es. Lesen Sie mehr, PHP und andere - das sagt dem Browser, was zu tun ist, wo und wie.

Jeder Browser verwendet eine Rendering-Engine, die manchmal auch als Layout-Engine bezeichnet wird, um die im Code enthaltenen Inhalte und Stilinformationen zu übernehmen und in vollständig formatierter Form auf dem Bildschirm anzuzeigen.

Das Problem ist, dass nicht in jedem Browser eine einzige Rendering-Engine verwendet wird. Während jede Sprache durch eine detaillierte Spezifikation definiert ist, kann die Engine nur eine Interpretation dieser Spezifikation anbieten.

Insbesondere mit CSS (dem Code, der die Styling-Informationen bereitstellt. CSSmatic: CSS3-Stylesheets schnell und bequem über mehrere Online-Tools erstellen: CSSmatic: CSS3-Stylesheets über mehrere Online-Tools schnell und bequem erstellen), führt keine Engine genau zu denselben Ergebnissen. Manchmal können sich die Unterschiede hier oder dort nur auf das ungerade falsch ausgerichtete Pixel belaufen, manchmal sind sie jedoch radikal anders.

Welche Browser verwenden welche Engines

Es gibt vier Haupt-Rendering-Engines, die von den beliebtesten Browsern verwendet werden.

• WebKit: eine Open-Source-Engine, die von Safari unter OS X verwendet wird Der ultimative Leitfaden zum Anpassen von Safari auf dem Mac Der ultimative Leitfaden zum Anpassen von Safari auf dem Mac Anpassen von Safari. Mit dem Hinzufügen von Favoriten zu Ihren Registerkarten und dem Ändern des Lesemodus ist der Webbrowser von Apple flexibler als Sie denken. Read More und iOS sowie viele andere Browser auf mobilen Geräten, einschließlich des nativen Android-Browsers;
• Blinken: eine Open-Source-Engine auf Basis von WebKit, die Chrome, Opera, Amazon Silk und Android WebView (den Browser, der in Apps geöffnet wird) unterstützt;
• Gecko: eine von der Mozilla Foundation entwickelte Open-Source-Engine, die von Firefox verwendet wird;
• Dreizack: eine von Microsoft entwickelte und in Internet Explorer verwendete proprietäre Engine. Der Microsoft Edge-Browser verwendet eine neuere Version namens EdgeHTML.

Webstandards

Die Kluft zwischen den verschiedenen Rendering-Engines ist viel geringer als damals, als der Internet Explorer der dominierende Browser war. Macht Internet Explorer 2015 einen großen Gewinn? Macht Internet Explorer 2015 einen großen Gewinn? Microsoft muss EU-Windows-Benutzern nicht länger eine Auswahl an Browsern anbieten. Darüber hinaus arbeitet Microsoft an einem neuen Browser. Trotzdem zeigen wir Ihnen, wie Sie Ihren Lieblingsbrowser installieren, ohne den IE zu berühren. Weiterlesen .

Tests wie acid3 zeigen, wie genau ein Browser eine Seite darstellt, und die meisten modernen Browser erzielen ein hohes Ergebnis. Normkonform ist jedoch eine immens komplexe Aufgabe.

Die Spezifikationen für HTML, CSS und andere sind enorm. Neue Elemente werden hinzugefügt. ältere, unbenutzte oder veraltete werden entfernt. Es kann lange dauern, bis die Rendering Engines diese Änderungen widerspiegeln.

Einige Elemente in den HTML5- und CSS-Spezifikationen werden immer noch nicht von allen gängigen Browsern unterstützt, andere nur teilweise, andere wiederum werden von einigen, aber nicht allen Browsern unterstützt.

Auf der Website html5test.com können Sie Ihren Browser und die von Ihnen verwendete Version testen, um zu sehen, wie gut offizielle und experimentelle Funktionen von HTML5 unterstützt werden. Zum Zeitpunkt des Schreibens zählt Chrome zu den besten Browsern. Welcher Webbrowser ist am sichersten? Welcher Webbrowser ist am sichersten? Welcher Browser ist der sicherste? Welches sollten Sie installieren, um sicherzustellen, dass Ihre Browser-Erfahrung sicher ist? Wie können Sie sicherstellen, dass Ihr vorhandener Browser so sicher wie möglich ist? Lesen Sie mehr, wobei der Internet Explorer (v11) am niedrigsten ist.

Wenn ein Webentwickler eine Funktion verwendet, die in einem Browser unterstützt wird, aber nicht in einem anderen, muss der nicht unterstützte Browser entweder ein gleichwertiges Äquivalent festlegen oder die Funktion vollständig ignorieren (eine transparente Box kann beispielsweise als nicht transparent dargestellt werden).

Dies macht das Rendern von Webseiten wesentlich komplexer, als es scheint. Ein Browser, der häufiger aktualisiert wird, ist wahrscheinlich normkonformer als ein Browser, der nicht so ist, wie die regelmäßigen automatischen Chrome-Updates im Vergleich zu den weitaus sparsameren IE-Updates zeigen.

Und es spielen auch noch andere Faktoren eine Rolle.

• Fehler im Motor: Eine Rendering-Engine ist Software, und jede Software enthält Fehler. Obwohl kritische Fehler schnell gefunden und beseitigt werden, kann nicht garantiert werden, dass eine bestimmte Kombination von Code auf einer Webseite beim Rendern nicht zu unerwarteten Ergebnissen führt
• Fehler in der Webseite: Browser verfügen über eine gewisse Fehlertoleranz, die jedoch von Engine zu Engine unterschiedlich ist. Eine Webseite mit Fehlern im Code kann zwar in einem Browser einwandfrei dargestellt werden, in einem anderen jedoch schrecklich gebrochen sein
• Schriftarten: Die Darstellung von Schriftarten wird nicht vom Browser, sondern vom Betriebssystem behandelt. Windows und OS X rendern Schriftarten anders Wie Windows-Schriftarten aussehen wie Mac-Schriftarten Wie Windows-Schriftarten aussehen wie Mac-Schriftarten Eye Candy ist kein Windows-Spezialist. Die moderne Benutzeroberfläche (auch Metro genannt) brachte Verbesserungen mit sich, weist aber immer noch einen wichtigen Bereich auf: Schriftarten. Wir zeigen Ihnen, wie Sie unter Windows schöne Schriftarten glätten können. Lesen Sie mehr, damit auch die gleiche Schriftart im selben Browser auf verschiedenen Plattformen unterschiedlich dargestellt werden kann
• Erbe: Browser übernehmen häufig neue Funktionen, insbesondere für CSS, bevor sie in die offiziellen Spezifikationen aufgenommen werden. Wenn sich die Implementierung der Funktion bei der Übernahme ändert, muss der Browserentwickler entscheiden, ob er die Änderung übernehmen und die Kompatibilität mit Tausenden von Websites, die für die alte Version entwickelt wurden, übernimmt oder die neue Version vollständig ignoriert
• Eigene Funktionen: Einige Browser verwenden möglicherweise proprietäre Technologien, die an anderer Stelle nicht verfügbar sind. Am bekanntesten war dies mit dem ActiveX-Framework von Microsoft in Internet Explorer, obwohl das Unternehmen es nicht im neuen Microsoft Edge-Browser verwenden wird

Einpacken

Bei so vielen Problemen ist es nicht überraschend, dass die Unterschiede in der Art und Weise, wie Browser mit Webseiten umgehen, bestehen bleiben.

Die Situation verbessert sich, wird aber wahrscheinlich nicht vollständig gelöst. Es wäre hilfreich, wenn alle Benutzer die neueste Version ihres gewählten Browsers verwenden würden. Da der sechs Jahre alte Internet Explorer 8 jedoch immer noch einen Marktanteil von 4,5 Prozent aufweist, ist dies ein weiter Weg.

Welchen Browser verwenden Sie und halten Sie ihn auf dem neuesten Stand? Haben Sie Websites gefunden, die in Ihrem ausgewählten Browser nicht funktionieren? Lass es uns in den Kommentaren wissen.

Bildnachweise: Geräte über Jeremy Keith, Nicht unterstützter Browser über Duncan Hill

Erfahren Sie mehr über: Google Chrome, Internet Explorer, Safari Browser, Webentwicklung.