Tutorials
Einige nützliche Hilfen und Code-Schnipsel, die ich immer wieder benötige und deshalb hier für alle sammle.
Zurück zur Übersicht
PT (Punkt) zu PX (Pixel) und EM umrechnen
#Tutorials#CSS
Da viele Kunden immer wieder mit PT statt PX arbeiten gibt es hier eine kleine Tabelle mit der man so im Groben umrechnen kann. Natürlich ist das Ganze aber von der Schriftart und weiteren Faktoren abhängig, aber einen guten Überblick sollte man trotzdem bekommen:
| Points (pt) | Pixels (px) | Ems (em) | Percent (%) | ||
|---|---|---|---|---|---|
| 6pt | 8px | 0.5em | 50% | ||
| 7pt | 9px | 0.55em | 55% | ||
| 7.5pt | 10px | 0.625em | 62.5% | ||
| 8pt | 11px | 0.7em | 70% | ||
| 9pt | 12px | 0.75em | 75% | ||
| 10pt | 13px | 0.8em | 80% | ||
| 10.5pt | 14px | 0.875em | 87.5% | ||
| 11pt | 15px | 0.95em | 95% | ||
| 12pt | 16px | 1em | 100% | ||
| 13pt | 17px | 1.05em | 105% | ||
| 13.5pt | 18px | 1.125em | 112.5% | ||
| 14pt | 19px | 1.2em | 120% | ||
| 14.5pt | 20px | 1.25em | 125% | ||
| 15pt | 21px | 1.3em | 130% | ||
| 16pt | 22px | 1.4em | 140% | ||
| 17pt | 23px | 1.45em | 145% | ||
| 18pt | 24px | 1.5em | 150% | ||
| 20pt | 26px | 1.6em | 160% | ||
| 22pt | 29px | 1.8em | 180% | ||
| 24pt | 32px | 2em | 200% | ||
| 26pt | 35px | 2.2em | 220% | ||
| 27pt | 36px | 2.25em | 225% | ||
| 28pt | 37px | 2.3em | 230% | ||
| 29pt | 38px | 2.35em | 235% | ||
| 30pt | 40px | 2.45em | 245% | ||
| 32pt | 42px | 2.55em | 255% | ||
| 34pt | 45px | 2.75em | 275% | ||
| 36pt | 48px | 3em | 300% |
Kommentare
pt und px stehen in einem gewissen Verhältnis. Wenn ich jetzt von px ausgehe, spielt bei der Anzeige die Größe und die Auflösung des Bildschirmes eine Rolle.
Wie sind die Einflüsse. Schlechthin würde ich sagen, 10 px ist auf einem 4k-Bildschirm eine sehr kleine Schrift.
Viele Grüße
Hans
mitlerweile gibt es die Größe rem. Das bedeutet Root EM und meint so viel, dass man alle Größen im Verhältnis zur Schriftgröße am Root Node, also Body/Html Tag berechnet.
http://tools.andrerinas.de/rem_calculator Hier ein kleiner Calculator.
Wenn man nun größere und kleinere Bildschirme hat, so legt man die Schriftgröße über Media Queries auf passende Größen. Also gehen wir von 16px Normalgröße bei Full-HD aus, so könnte man sagen 90% bei < 1024px 70% bei mobilen Geräten und 150% bei > 1980px Bildschirmbreite und so weiter.
Viele Grüße André
vielen Dank für Deine Antwort. Ich möchte noch ergänzen, nach Analyse etlicher Mails und Websites habe ich festgestellt, daß in Outlook mit seinem Editor Winword
je nach Wahl der Skalierungseinheit px oder pt die Schrift unterschiedlich skaliert wird, und zwar nicht nur um den von Dir genannten Faktor. Das scheint eine Eigenheit/Unzulänglichkeit von Office/Outlook/Winword zu sein.
Wenn px als Maßeinheit verwendet wird, kann es zu erheblichen Größenunterschieden kommen (Beispiel Verdana 4,5 wird zu 12), bei pt als Maßeinheit nicht.
Ich selbst arbeite mit Office 11/Outlook/Winword 2003/2007, in meinen E-Mails wird pt verwendet. Warum, ob man das festlegen kann, weiß ich noch nicht.
Wohlgemerkt das sind Erprobungsergebnisse.
Viele Grüße
Hans
Grüße André
deshalb habe ich auch meine Frage am 19.01.17 gestellt. Hintergrund ist, daß im E-Mail-Verkehr auf einem 4k-Monitor 27 " die Schrift auf einigen ankommenden Mails extrem klein dargestellt wird. Damit die Schrift in richtiger Größe unabhängig von der Auflösung des zur Anzeige verwendeten Monitors dargestellt wird, bedarf es doch wohl einer variablen Skalierung, die beim Absender vorgenommen werden muß.
Mit einer Klärung hier wäre viel getan.
Viele Grüße
Hans
konnte ich genau JETZT richtig gebrauchen, um Epubs ohne PT zu erstellen.
Wer in Programmen nicht von Punkt auf Pixel umschalten kann, der sollte keine Online-Designs entwerfen.
Trotzdem danke für die Umrechnungstabelle - auch ich habe sie jetzt mal gebraucht ;-)
Hinterlasse einen Kommentar