Professionelle Textgestaltung

Browser-Bugs und Inkompatibiliäten, CSS3

Außerdem könnten Sie die Zeichengröße im Dokument in der Einheit ex angeben. Diese Einheit entspricht der x-Größe der verwendeten Schrift (in der Regel ist es die Höhe des Kleinbuchstaben x). Doch Vorsicht, manche Browser verwenden einfach einen arbiträren Wert von 0.5em, insofern sind Sie mit em besser bedient.

Relative Einheiten wie em oder Prozente sollten nicht auf generische HTML-Elemente angewendet werden (außer html und body). Wird Text in zwei oder mehr Spalten am Grundlinienrast1er ausgerichtet und kommen dabei verschiedene Zeichensätze zum Einsatz, können je nach verwendeter Einheit nicht zu übersehende Fehler auftreten.

Browser-Bugs und Inkompatibilitäten

Webdesigner mussten bisher einen aufwendigen Spagat hinlegen, um Webseiten sowohl mit standardkonformen Browsern als auch mit dem Internet Explorer korrekt angezeigt zu bekommen.

Den Durchbruch für browserübergreifende Seitengestaltung brachte erst CSS 2.1 und die W3C-Konformität kam erst mit dem Acid2-Test in Mode.

Seit Webbrowser wie Mozilla Firefox 3.5.x, Google Chrome 3.x/4.x und Apple Safari 4 den Acid2- und Acid3-Test mit Leichtigkeit bestehen und zudem auch noch CSS3 und HTML5 unterstützen, ist plötzlich das bisher Undenkbare geschehen: Microsoft beteiligt sich zusammen mit dem Apple-Webkit-Team und der Mozilla-Stiftung an der HTML5-Standardisierung.Seit sich viele Web-Designer "IE6 must die" auf ihre Fahnen geschrieben haben, ist Microsoft wieder ernsthaft an der Mitgestaltung von Standards interessiert.

Die Ausdauer und das Beharren auf die konsequente Einhaltung von Standards hat sich für Webdesigner endlich ausgezahlt, da immer mehr fortgeschrittene Layouttechniken verfügbar geworden sind, die vorher im Web unerreichbar erschienen.

Damit sind Probleme mit der browserübergreifenden Kompatibilität von Webseiten zwar noch lange nicht völlig aus der Welt geschafft, aber das ist schon mal der erste Schritt auf dem Weg dorthin.

Unterschiedliche Rundungsgenauigkeiten führen in den verschiedenen Browsern zu unterschiedlichen Resultaten, aber wenn Sie sich dessen bewusst sind, können Sie vorab Gegenmaßnahmen treffen.

Wenn Sie etwa die Textgröße im Dokument in Prozent definieren, bekommen Sie in Internet Explorer bis einschließlich Version 7 immer dann falsche Werte bei untergeordneten Textelementen, die ihre Größen- und Positionseigenschaften vom Vaterelement erben, wenn der Text im Browser vergrößert wird.

Es handelt sich um einen Bug, den Microsoft im Internet Explorer behoben hat. Wenn Sie auch Internet Explorer bis einschließlich Version 7 unterstützen müssen, sollten Sie die Textgröße für das html-Element mittels

h1 {
font-size: 100%;
}

festlegen; alle Änderungen der Zeichengröße bei untergeordneten Textelementen können Sie dann in em angeben.

Ausblick auf CSS3

Das Textmodul in CSS3 führt unter anderem eine neue Einheit namens gd und die Eigenschaft layout-grid ein. Mittels layout-grid können Sie im Dokument ein Layoutraster anlegen und Elemente wie Text an diesem Raster ausrichten, zum Beispiel:

p {
layout-grid: strict both 6pt
10pt; margin: 1gd 3gd 1gd 2gd }

Mehr zum Thema

Youtube Sperre umgehen GEMA
Videos freischalten

So umgehen Sie die GEMA-Sperre bei Youtube. Was Sie dazu brauchen, und wie es am einfachsten geht.
Neue Fritzboxen unterstützen den AC-Standard.
WLAN-Geschwindigkeit verdoppeln

Mehr WLAN-Geschwindigkeit: Mit dem WLAN-Standard 802.11ac und den richtigen Geräten und Einstellungen verdoppeln Sie den Datendurchsatz.
Netflix auf dem TV
Programm in der Übersicht

Welche Filme und Serien gibt es bei Netflix eigentlich zu sehen? Was ist neu im Streaming-Angebot? Diese Antworten helfen weiter.
Netflix
Streaming

Preise, kompatible Geräte, Datenrate, Serien- und Filmangebot von Netflix: Wir beantworten die wichtigsten Fragen rund um den Streaming-Dienst.
E.T. – Der Außerirdische
Vorschau auf Film- und Serien-Highlights

Amazon Prime Instant Video lockt im Dezember 2016 mit Film-Highlights wie "E.T.", "Fast & Furious 7" und der Serie "Ku’damm 56​".