IE8: Werden Überschiften proportional zur normalen Schrift?

[Mike]

Hi,

wenn ich im "normalen" Modus vom IE8 eine Seite darstelle, die eine <h5> Überschrift hat(aber keine CSS Angabe dafür), wird diese proportional zur normalen festegelegten Textgrösse gezeigt. Also immer ein wenig kleiner.

Lediglich das nutze ich:
<style type="text/css">
html,body{font-size:12px;}
</style>

Angeblich soll doch diese IE-Version sich streng an W3C halten, also muss ich davon ausgehen das Verhalten ist richtig?

Mike

[Thomas Luethi]

Hallo,

wenn ich im "normalen" Modus vom IE8 eine Seite darstelle, die eine <h5> Überschrift hat(aber keine CSS Angabe dafür), wird diese proportional zur normalen festegelegten Textgrösse gezeigt. Also immer ein wenig kleiner.

Diese Unsitte, Überschriften (H5, H6) kleiner darzustellen als den
eigentlichen Fliesstext, hat leider eine lange Tradition bei den Browsern.
Schon Netscape 4 selig hatte diese leidige Angewohnheit, und die
übrigen Browser haben es nachgeäfft.

Lediglich das nutze ich:
<style type="text/css">
html,body{font-size:12px;}
</style>

D.h. Du definierst nicht spezifisch, wie gross ein H5 dargestellt werden soll.

Für Benutzer mit MS IE bis und mit 6.0 sind übrigens solche
Schriftgrössen-Angaben mit px sehr schlecht, denn diese
armen Leute haben dann keine Chance, die Schriftgrösse
anzupassen.

Angeblich soll doch diese IE-Version sich streng an W3C halten, also muss ich davon ausgehen das Verhalten ist richtig?

Jeder (grafische) Browser, so auch der MS IE 8, hat ein eigenes,
eingebautes "Default"-Stylesheet. Dieses kommt z.B. dann zum Einsatz
wenn sonst nichts definiert ist, z.B. bei reinen HTML-Seiten ohne CSS.

Das ist auch so vorgesehen in der CSS Specification.
Spontan finde ich gerade das hier:
http://www.w3.org/TR/CSS21/cascade.html#cascading-order
  "2. Sort according to importance (normal or important) and origin
     (author, user, or user agent). In ascending order of precendence:
     1. user agent declarations
     2. user normal declarations
     3. author normal declarations
     4. author important declarations
     5. user important declarations "

Zur Erklärung:
1. ist das Default-Stylesheet des Browsers.
2. wären Angaben ohne !important im Stylesheet des Users.
   (Ein solches User-Stylesheet haben wohl nur ein paar Geeks,
    allenfalls noch Menschen mit Sehbehinderungen, keine Ahnung.)
3. sind Angaben ohne !important im Stylesheet, welches Du
   als Autor der Seite machst.
4. sind Angaben mit !important, die Du machst.
5. wären Angaben mit !important im User-Stylesheet

Wenn also z.B. im Default-Stylesheet des Browsers definiert ist,
dass eine H5-Überschrift 0.9em gross sein soll, und sonst nirgends
(weder in "Deinem" Autoren-Stylesheet noch in einem User-Stylesheet)
eine Grössenangabe steht, dann handelt der Browser IMHO "richtig",
d.h. gemäss der Spec., wenn er die H5-Überschrift etwas kleiner als
den übrigen BODY-Text, also mit 0.9*12px = 10.8px darstellt.

Das heisst: Wenn es Dir wichtig ist, wie etwas dargestellt wird,
dann musst Du es explizit im (Autoren-)Stylesheet definieren.
Sonst musst Du damit rechnen, dass das Default-Stylesheet des
Browsers zum Einsatz kommt.

HTH, mfg Thomas

[Mike]

Hi Thomas,

schöne ausführlich Antwort, danke.

Diese Unsitte, Überschriften (H5, H6) kleiner darzustellen als den
eigentlichen Fliesstext, hat leider eine lange Tradition bei den Browsern.

Schon Netscape 4 selig hatte diese leidige Angewohnheit, und die
übrigen Browser haben es nachgeäfft.

Aber erst jetzt Einzug im IE eingehalten ;-)

Für Benutzer mit MS IE bis und mit 6.0 sind übrigens solche
Schriftgrössen-Angaben mit px sehr schlecht, denn diese
armen Leute haben dann keine Chance, die Schriftgrösse
anzupassen.

Stimmt, schlechte Angewohnheit. Hatte mich irgendwann mal, nach vielen Versuchen mit % und em, aus irgendeinem Grund dazu entschlossen es bei Pixel zu belassen.

»» Angeblich soll doch diese IE-Version sich streng an W3C halten, also muss ich davon ausgehen das Verhalten ist richtig?

Jeder (grafische) Browser, so auch der MS IE 8, hat ein eigenes,
eingebautes "Default"-Stylesheet. Dieses kommt z.B. dann zum Einsatz
wenn sonst nichts definiert ist, z.B. bei reinen HTML-Seiten ohne CSS.

Also gibt es dazu wohl gar keine Richtlinie.

Das ist auch so vorgesehen in der CSS Specification.
Spontan finde ich gerade das hier:
http://www.w3.org/TR/CSS21/cascade.html#cascading-order
  "2. Sort according to importance (normal or important) and origin
  .....»»

Zur Erklärung:

1. ist das Default-Stylesheet des Browsers.
2. wären ....

Das finde ich richtig gut was du hier machst. Die meissten hier verlinken mit Vorliebe auf englische Texte, die schon auf deutsch schwer zu verstehen sind.

Das heisst: Wenn es Dir wichtig ist, wie etwas dargestellt wird,
dann musst Du es explizit im (Autoren-)Stylesheet definieren.
Sonst musst Du damit rechnen, dass das Default-Stylesheet des
Browsers zum Einsatz kommt.

Ja das ist soweit klar, mache ich auch im Regelfall. Bei Quick&Dirty Testscripten aber nicht, daher fiel es mir auch auf, denn im IE6 war <h5> immer grösser als der restliche Text, auch ohne CSS-Deklaration.

Gruss
Mike

[Thomas Luethi]

Hallo Mike,

schöne ausführlich Antwort, danke.

Bitteschön! ;-)

»» Diese Unsitte, Überschriften (H5, H6) kleiner darzustellen als den
»» eigentlichen Fliesstext, hat leider eine lange Tradition bei den Browsern. [...]

Aber erst jetzt Einzug im IE eingehalten ;-)

Nein. Bei der folgenden Seite ist der Link "Zurück" ganz normaler
Text (P), der Rest sind Überschriften (H1-H6). Es gibt kein CSS.
http://de.selfhtml.org/html/text/anzeige/h1_6.htm

Hier im MS IE 7 sieht es so aus, dass wohl H4 = P,
H5 scheint mir etwas kleiner, H6 deutlich kleiner als P.

»» Für Benutzer mit MS IE bis und mit 6.0 sind übrigens solche
»» Schriftgrössen-Angaben mit px sehr schlecht, denn diese
»» armen Leute haben dann keine Chance, die Schriftgrösse
»» anzupassen.

Stimmt, schlechte Angewohnheit. Hatte mich irgendwann mal, nach vielen Versuchen mit % und em, aus irgendeinem Grund dazu entschlossen es bei Pixel zu belassen.

Gegen einige Bugs von (älteren?) MS IE Versionen hilft schon:
body { font-size:100%; }
und dann relative Grössen in % angeben, z.B.
h1 { font-size:240%; }

Das Problem ist in MS IE ab 7.0 insofern entschärft, als dass
der Browser jetzt alles zoomen lässt, Text und Bilder.
Aber eben, die armen DAUs mit MS IE bis 6.0 - und davon gibt
es noch viele - sind aufgeschmissen und müssen die (oft
winzigen, z.B. 10px) Texte mühsam entziffern. Darum lieber em oder %.

»» Jeder (grafische) Browser, so auch der MS IE 8, hat ein eigenes,
»» eingebautes "Default"-Stylesheet.

Also gibt es dazu wohl gar keine Richtlinie.

Äh, doch, es gibt einen _unverbindlichen_ Vorschlag des W3C,
im Anhang der CSS-Spezifikation:
http://www.w3.org/TR/CSS/sample.html

Und was muss ich dort sehen:
h4, p /*...*/ { margin: 1.12em 0 }
h5 { font-size: .83em; margin: 1.5em 0 }
h6 { font-size: .75em; margin: 1.67em 0 }

:-/

D.h. auch das W3C schlägt vor, H4=P und H5/H6 kleiner!
(Das soll mir einmal einer schlüssig erklären, warum eine
Überschrift kleiner - und somit "weniger wichtig" - sein
soll als der Fliesstext...)

Die Browser-Hersteller sind aber frei, eigene Default-Stylesheets
zu definieren.
Wobei sich die meisten wohl grundsätzlich am W3C-Vorschlag orientieren.

Das finde ich richtig gut was du hier machst. Die meissten hier verlinken mit Vorliebe auf englische Texte, die schon auf deutsch schwer zu verstehen sind.

Danke für die Blumen! ;-)
Ich verlinke auch lieber auf englische Original-Texte,
da nur diese verbindlich und aktuell sind, aber wenn
nötig und möglich gebe ich (wie vorhin) gerne meine
Interpretation oder ergänzende Infos ab.

Die (existierenden) Übersetzungen haben mich nie überzeugt.

[...] denn im IE6 war <h5> immer grösser als der restliche Text, auch ohne CSS-Deklaration.

Das glaube ich nicht, bis ich einen Screenshot sehe, z.B. eben von
http://de.selfhtml.org/html/text/anzeige/h1_6.htm

mfg, der ungläubige Thomas

[Mike]

Hi Thomas,

»» [...] denn im IE6 war <h5> immer grösser als der restliche Text, auch ohne CSS-Deklaration.

Das glaube ich nicht, bis ich einen Screenshot sehe, z.B. eben von
http://de.selfhtml.org/html/text/anzeige/h1_6.htm

dort existiert ja auch kein body{font-size:12px;}

Ich bin mur aber sehr sicher, weil ich das oft so nutze bei Testscripten oder kleinen Adminbereichen. Leider war ich gezwungen auf IE8 umzusteigen, morgen mache ich aber mit einem IE6 einen Screenshot dazu, wenn bis dahin kein anderer das bestätigt.

Gruss
Mike

[Vinzenz Mai]

Hallo,

» [...] denn im IE6 war <h5> immer grösser als der restliche Text, auch ohne CSS-Deklaration.

Das glaube ich nicht, bis ich einen Screenshot sehe, z.B. eben von
http://de.selfhtml.org/html/text/anzeige/h1_6.htm

brauchst Du auch nicht zu glauben. Schon im IE 4 waren h5 und h6 kleiner als normaler Fließtext.

Freundliche Grüße

Vinzenz

[Mike]

Hi,

brauchst Du auch nicht zu glauben. Schon im IE 4 waren h5 und h6 kleiner als normaler Fließtext.

nicht wenn das Dokument body{font-size:12px;} enthält. Oder muss ich wirklich erst einen Screenshot reinstellen?

Mike

[Der Martin]

Hallo,

»» brauchst Du auch nicht zu glauben. Schon im IE 4 waren h5 und h6 kleiner als normaler Fließtext.

kommt drauf an ...

nicht wenn das Dokument body{font-size:12px;} enthält. Oder muss ich wirklich erst einen Screenshot reinstellen?

Naja, die Schriftgröße von <hX> im Default-Stylesheet richtet sich offensichtlich nur nach der Standard-Schriftgröße im Browser, die üblicherweise größer als 12px ist. Machst du nun die Schriftgröße für body absichtlich kleiner, als sie von Natur aus ist, ohne die Schriftgrößen für die hX ebenfalls anzupassen, dann ändern sich die Größenverhältnisse natürlich.
Mit den vordefinierten Standard-Schriftgrößen stelle ich jedenfalls auch fest, dass h4 etwa der Schriftgröße des Fließtexts entspricht, h5 und h6 deutlich kleiner sind. Zwinge ich mit font-size:12px im body die Fließtext-Größe kleiner, dann verkleinert er sich etwa auf die Größe von h5, während h6 immer noch kleiner ist.

Übrigens alles im IE5.5, aber Vinzenz wies ja schon darauf hin, dass diese Konstellation bereits ab IE4 gilt.

So long,
 Martin

[Mike]

Hi Martin,

»» nicht wenn das Dokument body{font-size:12px;} enthält. Oder muss ich wirklich erst einen Screenshot reinstellen?

Naja, die Schriftgröße von <hX> im Default-Stylesheet richtet sich offensichtlich nur nach der Standard-Schriftgröße im Browser, die üblicherweise größer als 12px ist. Machst du nun die Schriftgröße für body absichtlich kleiner, als sie von Natur aus ist, ohne die Schriftgrößen für die hX ebenfalls anzupassen, dann ändern sich die Größenverhältnisse natürlich.

Genau, so war es bisher. Der IE8 allerdings richtet sich nach dem was ich im Body festlege, also <h5>immer etwas kleiner, wie Thomas schon schreibt, als der normale Fliesstext. Gut das zeigt eben, dass IE sich wirklich an W3C hält auch wenn der Sinn der dortigen Festlegung zu <h5>  nicht plausibel erscheint.

Damit dürfte dann der IE jetzt ein gutes Werkzeug sein. Ich persönlich finde ihn sogar sehr toll aus Usersicht, aus Entwicklersicht vermisse ich aber trotzdem den IE6.

Mike

[Gunnar Bittersmann]

@@Mike:

[…] dass IE sich wirklich an W3C hält auch wenn der Sinn der dortigen Festlegung zu <h5>  nicht plausibel erscheint.

Das W3C hat nirgendwo festgelegt, wie 'h5' dargestellt werden soll.

Live long and prosper,
Gunnar

[Mike]

Hi Gunnar,

Das W3C hat nirgendwo festgelegt, wie 'h5' dargestellt werden soll.

dann habe ich die Antwort von Thomas wohl doch falsch verstanden?

Insbesondere:

...d.h. gemäss der Spec., wenn er die H5-Überschrift etwas kleiner als

den übrigen BODY-Text, also mit 0.9*12px = 10.8px darstellt....

Dann interpretiere ich mal neu:
W3C legt lediglich fest, dass das Defaultstylesheet des Browsers aktiv wird, sofern das eigene CSS den Wert nicht hergibt. Das dabei <h5> kleiner als der normale Text ist, ist die freie Wahl des Browserproduzenten?

Mike

[ChrisB]

Hi,

Das W3C hat nirgendwo festgelegt, wie 'h5' dargestellt werden soll.

dann habe ich die Antwort von Thomas wohl doch falsch verstanden?

Du hättest vielleicht seine andere Antwort verlinken sollen ...

Insbesondere:

...d.h. gemäss der Spec., wenn er die H5-Überschrift etwas kleiner als
den übrigen BODY-Text, also mit 0.9*12px = 10.8px darstellt....

Dort sagte Thomas schon, dass es sich um einen vollkommen unverbindlichen *Vorschlag* handelt.

Dann interpretiere ich mal neu:
W3C legt lediglich fest, dass das Defaultstylesheet des Browsers aktiv wird, sofern das eigene CSS den Wert nicht hergibt.

Es sagt, dass ein Wert aus dem Default-Stylesheet des Browsers unterste Priorität hat.

Das dabei <h5> kleiner als der normale Text ist, ist die freie Wahl des Browserproduzenten?

Ja.
Und eine, die sich zufälligerweise mit dem Vorschlag für ein Default-Stylesheet deckt - warum auch immer die das dort so definiert haben.

MfG ChrisB

[Thomas Luethi]

Hallo Mike,

»» Naja, die Schriftgröße von <hX> im Default-Stylesheet richtet sich offensichtlich nur nach der Standard-Schriftgröße im Browser, die üblicherweise größer als 12px ist. Machst du nun die Schriftgröße für body absichtlich kleiner, als sie von Natur aus ist, ohne die Schriftgrößen für die hX ebenfalls anzupassen, dann ändern sich die Größenverhältnisse natürlich.

Genau, so war es bisher. Der IE8 allerdings richtet sich nach dem was ich im Body festlege, also <h5>immer etwas kleiner, wie Thomas schon schreibt, als der normale Fliesstext. Gut das zeigt eben, dass IE sich wirklich an W3C hält auch wenn der Sinn der dortigen Festlegung zu <h5>  nicht plausibel erscheint.

Also, ich glaube Dir jetzt schon, dass in älteren MS IE (z.B. 5/6)
bei einem Autoren-Stylesheet mit der einzigen Angabe
body { font-size:12px; }
die Schriftgrösse einer H5 etwa gleich gross war wie die von P,
und dass sie jetzt im MS IE 8 kleiner ist.

<REINE SPEKULATION>
Es könnte ja sein, dass der alte MS IE (5/6) für die Einstellung
"Schriftgrad: mittel" ein Default-Stylesheet mit "absoluten"
Schriftgrössen*) in Pixel hatte, z.B. sowas:
body { font-size:14px; }
h5   { font-size:12px; }
h6   { font-size:11px; }

Dann wäre bei obigem Beispiel normaler Text 12px (wegen der
Angabe im Autoren-Stylesheet), und H5 ebenfalls 12px (wegen
der Angabe im Default-Stylesheet), sowie H6 = 11px (dito).

Und es könnte sein, dass der MS IE 8 jetzt ein neues
Default-Stylesheet hat, welches sich näher am Vorschlag
des W3C bewegt und die Schriftgrössen relativ definiert, z.B.
body { font-size:100%; }
h5   { font-size:83% }
h6   { font-size:75%; }

Wenn jetzt im Autoren-Stylesheet steht, dass body 12px sei,
dann wird konsequenterweise H5 = 0.83*12 = 9.96px und
H6 = 0.75*12 = 9px.
</REINE SPEKULATION>

Das wäre plausibel und würde die Unterschiede erklären.
(Einen Screenshot musst Du mir nicht mehr präsentieren,
es sei denn, Dir werden im genannten http://de.selfhtml.org/html/text/anzeige/h1_6.htm@title=SelfHTML-Beispiel,
welches ja kein CSS hat, die H5 und H6 grösser dargestellt als
der Fliesstext. _Das_ hätte ich nicht geglaubt ohne Screenshot.) ;-)

Wie verschiedentlich erwähnt, ist die einzige Möglichkeit,
(einigermassen) die Kontrolle über die Schriftgrössen zu haben,
dass man diese explizit im CSS festlegt. Das bedeutet: Wenn man
einmal damit anfängt, an den Schriftgrössen "herumzuschrauben",
kann es ratsam sein, sie für alle HTML-Elemente, die man
verwendet, zu definieren, da es sonst zu unvorhergesehenen
"Konflikten" mit dem Default-Stylesheet des Browsers kommen kann.

Ein anderer Ansatz wäre es, punkto Schriftgrösse gar nichts
zu definieren, und zu hoffen, dass die Browser-Defaultwerte in
etwa passen. (So mache ich es, wenn ich Zeit sparen will.)

Ich vermute, dass Leute sich die Mühe gemacht haben, die
Default-Stylesheets der verschiedenen MS IE herauszufinden.
(Es wäre ein Wunder, wenn Microsoft sie veröffentlichte.)
Und ich gehe davon aus, dass die Default-Stylesheets von
Firefox & Co. öffentlich dokumentiert sind.
Vielleicht kann ja noch jemand ein paar Links dazu beisteuern,
ich mag gerade nicht suchen... ;-)

Freundliche Grüsse
Thomas

*) Jaja, ich weiss, dass in der CSS 2.1 Spec. die Pixel zu den
"relativen" Längeneinheiten gezählt werden. Es folgen dort auch
lange Erläuterungen zu Monitoren, Laserdruckern, Armlängen u.s.w. ;-)

Aber wenn es darum geht, ob die armen Benutzer mit MS IE <=6
die Schriftgrösse anpassen können, muss man eben unterscheiden
zwischen "absoluten" Schriftgrössen wie px oder pt, die fix bleiben,
und den "relativen" Schriftgrössen wie em oder %, die sich anpassen,
wenn der Benutzer die Einstellung unter Ansicht -> Schriftgrad ändert.

Weitere (z.T. sehr alte) Lektüre zum Thema gibt es in der dciwam-FAQ:
http://dciwam.de/faq/gute-websites/richtige-schriftgroesse
http://dciwam.de/faq/gute-websites/einheit-pt

[Gunnar Bittersmann]

@@Thomas Luethi:

nuqneH

Und es könnte sein, dass der MS IE 8 jetzt ein neues
Default-Stylesheet hat, welches sich näher am Vorschlag
des W3C bewegt

Die Formulierung „Vorschlag des W3C“ finde ich unglücklich; sie suggeriert, das W3C hätte einen Vorschlag für ein Default-Stylesheet gemacht. Hat es nicht, es hat lediglich _informativ_ in die CSS-2.1-Spec geschrieben, was die Browserhersteller bislang schon als Default-Stylesheet implementiert hatten und empfohlen, dass dieses weiterhin verwendet wird:

“This style sheet describes the typical formatting of all HTML 4 ([HTML4]) elements based on extensive research into current UA practice. Developers are encouraged to use it as a default style sheet in their implementations.” [CSS21 §D]

Qapla'

Gunnar

[Der Martin]

Hallo,

Das finde ich richtig gut was du hier machst. Die meissten hier verlinken mit Vorliebe auf englische Texte, die schon auf deutsch schwer zu verstehen sind.

dem stimme ich größtenteils zu: Die meisten Fachtexte in der EDV (Spezifikationen, Standards, Anleitungen) sind ursprünglich in Englisch verfasst. Meistens (nicht immer) wird ein Text bei der Übersetzung ins Deutsche irgendwie schwerfälliger und komplizierter. Der Halbsatz "schon auf deutsch schwer zu verstehen" ist daher m.E. paradox: Die deutschen Fassungen sind oft schwieriger zu verstehen als die englischen - Ausnahmen bestätigen die Regel (z.B. wenn der englische Text schon die Übersetzung aus dem Japanischen ist).

Deswegen, und auch weil die deutschen Texte meist weniger aktuell, dafür mit mehr Fehlern gesegnet sind, empfehle und verlinke ich auch bevorzugt die englischen Fassungen.

Das setzt natürlich voraus, dass man der englischen Sprache mächtig ist - aber das ist in dieser Branche sowieso sehr, sehr empfehlenswert, ja beinahe Pflicht.

Allerdings finde ich es auch vorbildlich, was Thomas macht: Er erläutert die wesentlichen Passagen kurz und prägnant mit eigenen Worten, so dass auch jemand, der in Englisch nicht so sattelfest ist, etwas davon hat.

So long,
 Martin

[Der Martin]

Hallo Thomas,

1. ist das Default-Stylesheet des Browsers.
2. wären Angaben ohne !important im Stylesheet des Users.
      (Ein solches User-Stylesheet haben wohl nur ein paar Geeks,
       allenfalls noch Menschen mit Sehbehinderungen, keine Ahnung.)

jetzt habe ich's also schriftlich: Ich bin also ein Geek!

Ciao,
 Martin