nicht angemeldet
font-size in CSS in Prozent definieren. Hat das Nachteile?
Hallo,
es gab jetzt einige Klagen von Besuchern unserer Website, dass die Schrift zu klein sei. Bislang war die Schriftgröße auf der Seite in px definiert.
Da ich schon seit langem Firefox als Browser benutze, bei dem man ja trotz CSS und Schriftgrössen-Definition in Pixel die Schriftgrösse individuell anpassen kann (STRG+ oder STRG-) war ich davon ausgegangen, dass die meisten Browser das können. Daher dachte ich, das Problem der Schriftgröße erledigt sich von selbst, wenn man nur auf diese Möglichkeit hinweist. Bis ich merkte: MSIE6 kann das nicht, wenn die Schriftgröße in px festgelegt wird. Und MSIE6 dürfte leider noch der am meisten benutzte Browser sein.
Ich hab mir nun mal die Stylesheets einiger größerer Websites angeschaut und gesehen, dass einige die Standardschriftart nicht in px, sondern in % definieren, z.B. Telepolis:
.fliess { font-size: 90%; line-height: 120%; margin-top: 8px;
margin-bottom: 10px; color: #000000}
Das hat den Vorteil, dass jetzt auch mit MSIE6 die Schriftgrösse im Browser individuell vergrößert oder verkleinert werden kann, wie ich mich überzeugt habe.
Ich frage mich allerdings:
a) Hat das möglicherweise irgendwelche Nachteile für die Darstellung?
und b) Wovon geht der Browser denn bei dieser Angabe aus, 100 Prozent von was?
Charles
-
es gab jetzt einige Klagen von Besuchern unserer Website, dass die Schrift zu klein sei. Bislang war die Schriftgröße auf der Seite in px definiert.
Das allerallermindeste Minimum an Schriftgröße würde ich mit 12px definieren, je mehr, desto besser. Was ist auf deiner Webseite benutzt?
Ich frage mich allerdings:
a) Hat das möglicherweise irgendwelche Nachteile für die Darstellung?Relative Größenangaben wirken sich unerwartet aus, wenn Tags verschachtelt werden. Angenommen, ein <li> soll 90% Größe haben. Dann hätte ein <li> im <li> nur noch 90% von 90% = 81% Größe. Dem kann man entgegenwirken, wenn man eine weitere Regel für solche Verschachtelungen definiert - aber dazu muß man sowas natürlich auch bemerken oder vorhersehen.
und b) Wovon geht der Browser denn bei dieser Angabe aus, 100 Prozent von was?
100% von der eingestellten Schriftgröße.
Es gibt Schlauberger, die glauben, dass die eingestellte Schriftgröße so etwa bei 16px liegt, was ihnen zu groß ist, weshalb dann eben mit relativen Angaben die Darstellungsgröße des Textes auf designerkompatible 11-12px heruntergeschraubt wird. Völliger Schwachsinn, IMO.
Es gibt eigentlich nur zwei sinnvolle Ansätze, browserübergreifend, kompatibel und handhabbar Schriftgrößen anzugeben: In px oder gar nicht.
Die px-Angabe krankt daran, dass der IE (bis Version 6) sie nicht ändern kann, also sollte man hinreichend große Schrift wählen. Der "gar nicht"-Ansatz ist dagegen vollständig kompatibel zu jedem Besucher.
-
Hallo,
In px oder gar nicht.
DAS ist IMHO ziemlicher Schwachsinn:
1. Es kommt auf die Schriftart an, wie groß diese sein muss. Times sieht bei 12px einfach sch**** aus, während Verdana mit 16px nicht das Gelbe vom Ei ist, deshalb bin ich nicht der Meinung, dass man die generelle Angabe der Schriftgröße verteufeln muss.
2. Man verwendet nicht überall die gleiche Schriftgröße und genau hierfür sind die relativen Einheiten auch gedacht. So kann man eine Überschrift z.B. 1.5x so groß darstellen, ohne dass diese bei Resizing nicht mitwächst und zu klein wirken könnte.
mfg. Daniel
-
In px oder gar nicht.
DAS ist IMHO ziemlicher Schwachsinn:
- Es kommt auf die Schriftart an, wie groß diese sein muss. Times sieht bei 12px einfach sch**** aus, während Verdana mit 16px nicht das Gelbe vom Ei ist, deshalb bin ich nicht der Meinung, dass man die generelle Angabe der Schriftgröße verteufeln muss.
Habe ich ja auch nirgends gesagt, oder? Wie groß "groß genug" oder "zu groß" ist, wird von Menschen höchst unterschiedlich definiert.
- Man verwendet nicht überall die gleiche Schriftgröße und genau hierfür sind die relativen Einheiten auch gedacht. So kann man eine Überschrift z.B. 1.5x so groß darstellen, ohne dass diese bei Resizing nicht mitwächst und zu klein wirken könnte.
Das kann ich nun gar nicht nachvollziehen. Wenn eine Schriftgröße im Verhältnis zu einer anderen Schriftgröße steht, ändert irgendein Zoom-Mechanismus nichts an dem Verhältnis. Vielleicht mit Ausnahme des IE, der px-Schriften nicht mit "Schriftgrad" vergrößern kann, relative Schriftangaben aber schon - was eigentlich deiner Aussage sogar widerspricht. Wenn schon ein Schema für Schriftgrößenangaben, dann überall das gleiche. Wenn px, dann immer px (das 1,5-fache einer 12px-Schriftgröße rechnet man sich recht simpel aus). Wenn Prozent, dann immer Prozent. Wenn em, dann immer em.
-
Hallo,
[…]deshalb bin ich nicht der Meinung, dass man die generelle Angabe der Schriftgröße verteufeln muss.
Habe ich ja auch nirgends gesagt, oder?
Was meintest du dann mit:
„Es gibt Schlauberger, die glauben, dass die eingestellte Schriftgröße so etwa bei 16px liegt, was ihnen zu groß ist, weshalb dann eben mit relativen Angaben die Darstellungsgröße des Textes auf designerkompatible 11-12px heruntergeschraubt wird. Völliger Schwachsinn, IMO.“
[…] So kann man eine Überschrift z.B. 1.5x so groß darstellen, ohne dass diese bei Resizing nicht mitwächst und zu klein wirken könnte.
Das kann ich nun gar nicht nachvollziehen. Wenn eine Schriftgröße im Verhältnis zu einer anderen Schriftgröße steht, ändert irgendein Zoom-Mechanismus nichts an dem Verhältnis.
document.body.style.fontSize = "1.2em";…oder zählt das nicht als Zoom-Mechanismus?
Vielleicht mit Ausnahme des IE, der px-Schriften nicht mit "Schriftgrad" vergrößern kann, relative Schriftangaben aber schon
Was IMHO sogar die richtige Verhaltensweise ist. Warum sollte eine fixe Schriftgröße zoombar sein? Mozilla hat das nur gemacht, damit man auch die weit verbreiteten px-Seiten noch lesen kann.
…was eigentlich deiner Aussage sogar widerspricht. Wenn schon ein Schema für Schriftgrößenangaben, dann überall das gleiche.
Ich habe aber keine Lust, für jedes Element einzeln eine Schriftart anzugeben ;-)
Womit wir wieder bei der Frage nach dem „was ist komplizierter“ wären.Wenn px, dann immer px (das 1,5-fache einer 12px-Schriftgröße rechnet man sich recht simpel aus). Wenn Prozent, dann immer Prozent. Wenn em, dann immer em.
Klar, wenn man's auf Kosten der Usability möglichst einfach haben möchte, kann man das so machen.
IMHO gilt:
Wenn design dann immer em, außer (wegen der derzeit noch geringen Verbreitung von Cairo) bei Bildern (hier eignet sich px) und bei Stylesheets, die für den Ausdruck gedacht sind (hier eigenen sich die absoluten Einheiten wie pt, cm, pc,…).mfg. Daniel
-
[…]deshalb bin ich nicht der Meinung, dass man die generelle Angabe der Schriftgröße verteufeln muss.
Habe ich ja auch nirgends gesagt, oder?
Was meintest du dann mit:
„Es gibt Schlauberger, die glauben, dass die eingestellte Schriftgröße so etwa bei 16px liegt, was ihnen zu groß ist, weshalb dann eben mit relativen Angaben die Darstellungsgröße des Textes auf designerkompatible 11-12px heruntergeschraubt wird. Völliger Schwachsinn, IMO.“
Damit meine ich Dinge wie
p {font-size:0.7em}für Standard-Fließtext. Die vom Benutzer eingestellte Schriftgröße ist die, die er gut lesen kann. Warum denkt der Designer, dass 70% dieser Größe auch noch "gut lesbar" wären?Und im IE kann man Schrift ja auch nur sehr begrenzt wieder größer machen, selbst wenn sie relativ angegeben und damit das Feature technisch tatsächlich verfügbar wäre.
[…] So kann man eine Überschrift z.B. 1.5x so groß darstellen, ohne dass diese bei Resizing nicht mitwächst und zu klein wirken könnte.
Das kann ich nun gar nicht nachvollziehen. Wenn eine Schriftgröße im Verhältnis zu einer anderen Schriftgröße steht, ändert irgendein Zoom-Mechanismus nichts an dem Verhältnis.
document.body.style.fontSize = "1.2em";…oder zählt das nicht als Zoom-Mechanismus?
Nein, tut es nicht. Das ist eine Änderung einer konkreten Schriftgröße, kein Zoom.
Zoom im Verständnis der Browserhersteller und -nutzer ist die gleichmäßig auf alles wirkende Vergrößerung. Wenn ich den Zoomfaktor "200%" wähle, sind alle Größenangaben einfach und schlicht verdoppelt. 12px werden wie 24px dargestellt, und 1.2em werden wie 2.4em dargestellt (wahlweise wird die Basisschriftgröße verdoppelt). Auch Grafiken werden vergrößert.
Vielleicht mit Ausnahme des IE, der px-Schriften nicht mit "Schriftgrad" vergrößern kann, relative Schriftangaben aber schon
Was IMHO sogar die richtige Verhaltensweise ist. Warum sollte eine fixe Schriftgröße zoombar sein? Mozilla hat das nur gemacht, damit man auch die weit verbreiteten px-Seiten noch lesen kann.
Das User-Interface eines Browsers und dessen Möglichkeiten, die Darstellung der Webseite zu beeinflussen, gehören nicht zu den Dingen, die der Seitenautor berücksichtigen oder gar beeinflussen sollte.
Und auch die Umsetzung von Features wie "Zoom" liegen komplett in der Verantwortung der Browserhersteller. Und das ist auch gut so, denn dadurch kann man sich in Sachen Nutzerfreundlichkeit ja durch gute, durchdachte Features von der Konkurrenz absetzen.
Dieses verkrüppelte "Ich mach nur die Schrift größer"-Gefrickel im Mozilla gefällt mir beispielsweise mindestens genausowenig, wie die unbrauchbare Schriftgrad-Änderung im IE bei px-Angaben.
…was eigentlich deiner Aussage sogar widerspricht. Wenn schon ein Schema für Schriftgrößenangaben, dann überall das gleiche.
Ich habe aber keine Lust, für jedes Element einzeln eine Schriftart anzugeben ;-)
Ja, eben drum. Warum für den Body-Text (und vererbt auch für P) eine Pixelangabe machen, und dann relativ dazu für Überschriften em nehmen? Was würde dadurch bewirkt, wenn ein Browser mit amputiertem "Zoom" benutzt würde? Da würden doch die Größenrelationen auch aus dem Gleichgewicht kommen.
Womit wir wieder bei der Frage nach dem „was ist komplizierter“ wären.
Komplizierter ist, die aufgrund von mehrstufiger Vererbung auftretenden Schriftgrößenabweichungen zu kompensieren. Das wird nämlich relativ rasch sehr komplex, und führt letztendlich auch zu unvermeidbaren Rundungsfehlern:
Der Kehrwert von 0,7em ist periodisch: 1,428571 428571 428571 428571...em, um nur ein Beispiel zu nennen.
Wenn px, dann immer px (das 1,5-fache einer 12px-Schriftgröße rechnet man sich recht simpel aus). Wenn Prozent, dann immer Prozent. Wenn em, dann immer em.
Klar, wenn man's auf Kosten der Usability möglichst einfach haben möchte, kann man das so machen.
Wer Wert auf Usability legt, der nutzt passende Browser, die ihm ermöglichen, zu kleine Schriften zu zoomen. Oder er hat eine Bildschirmauflösung und Monitorgröße, die ihm die genutzen Webseiten ausreichend lesbar darstellen.
IMHO gilt:
Wenn design dann immer em, außer (wegen der derzeit noch geringen Verbreitung von Cairo) bei Bildern (hier eignet sich px) und bei Stylesheets, die für den Ausdruck gedacht sind (hier eigenen sich die absoluten Einheiten wie pt, cm, pc,…).Und IMHO gilt:
Bei Design sind immer Grafiken im Spiel, bei denen es zwangsläufig auch immer Pixelmaße gibt, die zwingend einzuhalten sind. Ergo sind beispielsweise die Breiten und Höhen von Menüboxen auch in Pixeln anzugeben. Warum dann bei Schriften noch eine Ausnahme machen? Die in Browsern übliche Zoomfunktion funktioniert doch.Dass der IE 6 sowie Mozilla da noch nichts vernünftiges bieten, kann man den Programmierern vorwerfen. IE 7 und Opera haben vernünftige Zoom-Funktionen.
-
Hallo,
Damit meine ich Dinge wie
p {font-size:0.7em}für Standard-Fließtext. Die vom Benutzer eingestellte Schriftgröße ist die, die er gut lesen kann. Warum denkt der Designer, dass 70% dieser Größe auch noch "gut lesbar" wären?Wie gesagt: Für Times sind 16px optimal. Verdana sieht dagegen nur bei 12px gut aus. Es kommt also letztlich auch auf die Schriftart an.
Und im IE kann man Schrift ja auch nur sehr begrenzt wieder größer machen, selbst wenn sie relativ angegeben und damit das Feature technisch tatsächlich verfügbar wäre.
Das ist aber nun wirklich nicht mein Problem. Aber zumindest kann man ein wenig zoomen. Wie ausgereift das ist, kann dem Webdesigner doch egal sein.
document.body.style.fontSize = "1.2em";…oder zählt das nicht als Zoom-Mechanismus?
Nein, tut es nicht. Das ist eine Änderung einer konkreten Schriftgröße, kein Zoom.
Wenn du meinst… Ich sehe das anders.
Vielleicht mit Ausnahme des IE, der px-Schriften nicht mit "Schriftgrad" vergrößern kann, relative Schriftangaben aber schon
Was IMHO sogar die richtige Verhaltensweise ist. Warum sollte eine fixe Schriftgröße zoombar sein? Mozilla hat das nur gemacht, damit man auch die weit verbreiteten px-Seiten noch lesen kann.
Das User-Interface eines Browsers und dessen Möglichkeiten, die Darstellung der Webseite zu beeinflussen, gehören nicht zu den Dingen, die der Seitenautor berücksichtigen oder gar beeinflussen sollte.
Warum muss man den Browsern immer Barrieren in den Weg legen?
…was eigentlich deiner Aussage sogar widerspricht. Wenn schon ein Schema für Schriftgrößenangaben, dann überall das gleiche.
Ich habe aber keine Lust, für jedes Element einzeln eine Schriftart anzugeben ;-)
Ja, eben drum. Warum für den Body-Text (und vererbt auch für P) eine Pixelangabe machen, und dann relativ dazu für Überschriften em nehmen?
Ersteres: nein
Zweiteres: JaWas spricht dagegen, einfach mal *keine* Angabe zu machen.
Was würde dadurch bewirkt, wenn ein Browser mit amputiertem "Zoom" benutzt würde? Da würden doch die Größenrelationen auch aus dem Gleichgewicht kommen.
Nö, wenn man sich ein wenig anstrengt und davon ausgeht, dass der Browser wenigstens min-/max-Width/Height kann, geht das ohne Probleme.
Womit wir wieder bei der Frage nach dem „was ist komplizierter“ wären.
Komplizierter ist, die aufgrund von mehrstufiger Vererbung auftretenden Schriftgrößenabweichungen zu kompensieren. Das wird nämlich relativ rasch sehr komplex, und führt letztendlich auch zu unvermeidbaren Rundungsfehlern:
Komisch. Ich war noch nie in einer solchen Situation. IMHO ist das ziemlich weit hergeholt.
Wenn px, dann immer px (das 1,5-fache einer 12px-Schriftgröße rechnet man sich recht simpel aus). Wenn Prozent, dann immer Prozent. Wenn em, dann immer em.
Klar, wenn man's auf Kosten der Usability möglichst einfach haben möchte, kann man das so machen.
Wer Wert auf Usability legt, der nutzt passende Browser, die ihm ermöglichen, zu kleine Schriften zu zoomen.
Was aber nicht im Sinne der px-Angaben ist. px ist eine unveränderbare Größe.
IMHO gilt:
Wenn design dann immer em, außer (wegen der derzeit noch geringen Verbreitung von Cairo) bei Bildern (hier eignet sich px) und bei Stylesheets, die für den Ausdruck gedacht sind (hier eigenen sich die absoluten Einheiten wie pt, cm, pc,…).Und IMHO gilt:
Bei Design sind immer Grafiken im Spiel, bei denen es zwangsläufig auch immer Pixelmaße gibt, die zwingend einzuhalten sind.Ja und? Wo ist da das Problem?
Ergo sind beispielsweise die Breiten und Höhen von Menüboxen auch in Pixeln anzugeben.
Warum sollte man das tun? Was spricht gegen em in Verbindung mit min-max-Angaben in px?
IE 7 und Opera haben vernünftige Zoom-Funktionen.
IE7 und vernünftige Zoom-Funktion? Hast du die denn schonmal selbst ausprobiert? Ich finde die alles andere als vernünftig. Lediglich Opera kann sinnvoll zoomen.
mfg. Daniel
-
-
-
-
-
Hallo Charles,
Ich frage mich allerdings:
a) Hat das möglicherweise irgendwelche Nachteile für die Darstellung?
und b) Wovon geht der Browser denn bei dieser Angabe aus, 100 Prozent von was?es gab da einen ausführlichen Artikel im hiesigen Weblog, der Dich evtl. weiterbringt.
Gruß aus Köln-Ehrenfeld,
Elya
--
