Warum sieht meine Website in verschiedenen Browsern unterschiedlich aus?
Dass eine Website auf verschiedenen Browsern gleich aussieht, ist ein anhaltendes Problem für Webdesigner auf der ganzen Welt. Der Grund ist einfach- die Visualisierung einer Website hängt von vielen verschiedenen Variablen ab, wie:
- Wie der Browser die Seite interpretiert
Eine Website ist nur eine Reihe von Anweisungen, die beschreiben, wie eine Website aussehen sollte. Es liegt an dem Browser, es zu rendern, indem er den gesamten Code Ihrer Website liest und eine bestimmte Ausgabe erzeugt. Es gibt jedoch Unterschiede in der Code-Interpretation und verschiedene Browser werden dieselbe Seite leicht unterschiedlich darstellen. Deshalb sollten Sie während der Entwicklung Ihrer Website das Aussehen Ihrer Website auf verschiedenen Betriebssystemen und Browsern überprüfen. Sie können das folgende Online-Tool verwenden, um zu sehen, wie Ihre Seiten in mehreren Browsern aussehen:
Eine gute Website sollte gleich aussehen und alle ihre Funktionen sollten in jedem Browser funktionieren.
Leider gibt es dafür keine einfache Lösung. Sie sollten die Besonderheiten jedes Browsers überprüfen, der Ihre Website nicht richtig anzeigt und die notwendigen Anpassungen an Ihrem Code vornehmen. Solche Kompatibilitätsprobleme können nicht nur in verschiedenen Browsern auftreten, sondern auch aufgrund einer alten Browserversion, die die neuesten Standards nicht vollständig unterstützt.
- Betriebssystem des Besuchers
Wenn Ihre Website Submit-Buttons, Radioknöpfe, Kontrollkästchen und Eingabefelder verwendet, werden alle abhängig vom Betriebssystem und dem Stil des Besuchers visualisiert. Browser-Schriften neigen auch dazu, etwas anders auszusehen, wenn sie auf einem PC, Mac oder einem Linux-Computer gerendert werden.
Ein Bereich, in dem Websites fast immer anders aussehen, sind Seiten mit Formularen. Verschiedene Betriebssysteme und Browser machen die Schaltflächen auf Formularen und Textfeldern völlig unterschiedlich. Auf einem PC sind die Standard-Submit-Schaltflächen quadratisch und ziemlich flach, auf einem Mac sind die Standard-Submit-Buttons schön schattierte Ovale mit einem Farbverlauf. Zum Beispiel kann eine Submit-Schaltfläche in Ihrem Windows Classic Theme wie ein graues Rechteck aussehen, und wie ein Oval, wenn Sie den XP-Stil verwenden. Um dieses Problem zu umgehen, können Sie benutzerdefinierte Schaltflächen für Ihre Website erstellen.
Der Code eines normalen Submit-Buttons sieht wie folgt aus:
<input type="submit" />Sie können es durch den folgenden Code ersetzen, um das Bild der Submit-Schaltfläche anzugeben:
<button name="submit" type="submit" value="Submit"><img alt="" src="submitimg.gif" />Submit</button>- Bildschirmauflösung des Besuchers
Die Bildschirmauflösung beeinflusst ziemlich viel, wie eine Website angezeigt wird. Zum Beispiel, wenn Sie Ihre Seiten mit 1024×768 erstellen, passen sie nicht in den Bildschirm eines Besuchers mit einer Bildschirmauflösung von 800×600.
Um dies zu beheben, sollten Sie keine statischen Dimensionen für Ihre Website verwenden, dh anstelle von width = 1024px können Sie width = 100%verwenden. Dies wird nicht alle Probleme beheben, aber zumindest wird die Seite in den Bildschirm passen.