• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Überschriften (h1, h2 etc.) ausgefranst?

alex999

Neues Mitglied
Hallo,

ich habe eine Webseite erstellt in der Überschriften verwendet werden :shock:. Die Überschriften (insb. h1 und h2) werden mit CSS formatiert, z.B
Code:
h1 { font-size: 30px; }
oder auch
Code:
h1 { font-size: 2em; }
oder auch
Code:
h1 { font-size: 250%; }
Auf meinem TFT Monitor ist eigentlich alles ok, allerdings sehen die Schriften beim Monitor meines Kollegen (und leider auch auf dem Monitor des Kunden :-() ziemlich schlecht aus. Insbesondere dann, wenn die Überschriften zusätzlich als 'italic' formatiert werden. Die Überschriften wirken total ausgefranst, teilweise meint man sogar, dass sie horizontal verschoben sind (etwa so wie bei einem Tintenstrahldrucker mit schlechter Patrone). Mir ist natürlich klar, dass eine Rundung in der Schrift nur 'simuliert' werden kann, da ein Pixel nunmal eckig ist.

Frage: ist mir das noch nie aufgefallen, oder kann man mit (fehlerhaften) CSS-Formatierungen dafür sorgen, dass eine Überschrift mal besser und mal schlechter geglättet aussieht? Was kann ich dagegen tun? Es stört den Kunden so sehr, dass er gesagt hat, er nimmt uns das Design/Layout nicht ab, wenn wir das nicht hinkriegen :-(. Als absolute Notlösung müssen wir die Überschriften als Grafiken machen (viel Arbeit, schlecht für SuMasch usw.)


Danke für Tipps,

Alex
 
Überleg mal: Welche Chance hast du die Schrift auf einem fremden System zu glätten?
Ich denke mal: keine. Das ist klar, aber die Frage war eher: Kann ich Überschriften 'kaputt'-formatieren? Ich dachte an z.B sowas:

Basisschriftgröße 16px;
h1: 113%
16px x 1,13 = 18,08px

Vielleicht kommt ja das eine oder andere OS/Browser-System mit dem ,08px nicht zurecht und verschlechtert die Darstellung oder irgend sowas. Ich kann mir das ja auch nicht vorstellen, dass sowas Probleme macht, deswegen frag ich ja hier.

Also: ist das normal und liegt das NUR an den Einstellungen bzw. Monitor des fremden Systems oder kann man bei der Formatierung etwas falsch machen?
 
Es liegt an der schlechten Kantenglättung der Schrift. Das ist eine Einstellungssache des Systems.

Pixel sind immer Ganzzahlen, da wird abgerundet auf 18px.
 
Völlig von der Hand weisen würde ich die Frage nicht. Auf die "Standard"-Eigenheiten von Browsern/Betriebssystemen beim Rendering von Schriften könnte man sich theoretisch durchaus einstellen. Ich denke an sowas wie (ausgedacht): "IE rendert Arial bis 12 pt mit einer Dicke von einem Pixel, ab dann mit zwei." Das kann visuell ein massiver Unterschied sein. Einmal ist die Überschrift so schmal wie der Fließtext, einmal deutlich hervorgehoben.

Es ist eine undankbare Aufgabe, sowas zu testen (genau wie Farben auf fremden Monitoren). Vielleicht bietet es sich an, ein unverändertes Windows XP in einer Virtual Machine zu installieren oder so.
 
Zurück
Oben