PSD-Tutorials.de
Forum für Design, Fotografie & Bildbearbeitung
Tutkit
Agentur
Hilfe
Kontakt
Start
Forum
Aktuelles
Besonderer Inhalt
Foren durchsuchen
Tutorials
News
Anmelden
Kostenlos registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Menü
Anmelden
Kostenlos registrieren
App installieren
Installieren
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Antworten auf deine Fragen:
Neues Thema erstellen
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
Schriftgröße und Art was ist Standard
Beitrag
<blockquote data-quote="jackprince" data-source="post: 1764243" data-attributes="member: 108135"><p><strong>AW: Schriftgröße und Art was ist Standard</strong></p><p></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><u><strong>Schriftgröße</strong></u></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><u><span style="font-size: 12px"></span></u></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><u><span style="font-size: 12px"></span></u><span style="font-size: 10px"><span style="font-size: 12px">empfehle ich etwas nach folgendem Muster:</span></span></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><span style="font-size: 10px"><span style="font-size: 12px">Die Grundschriftgröße der Seite auf "<strong>10px</strong>".</span></span></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><span style="font-size: 10px"><span style="font-size: 12px"></span></span></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><span style="font-size: 10px"><span style="font-size: 12px"></span></span></span></span>[HTML]</p><p>html, body {</p><p> font-size: 10px;</p><p>}</p><p>[/HTML]<span style="font-size: 15px"><span style="font-family: 'Arial Black'"><span style="font-size: 10px"></span></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><span style="font-size: 10px"></span></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><span style="font-size: 10px"></span> </span><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">Damit hast du eine gute Basis für relative Größenangaben.</span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">Das bedeutet wenn du ein relativ Flexibles Layout baust,</span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">was sich z.B. in Relation zur vom Benutzer gewählten Schriftgröße</span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">verändert, so kannst du beim Umsetzen besser Rechnen.</span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'"></span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">Sowohl beim layouten der Groben Struktur als auch bei Zeilenhöhen,</span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">Abständen etc.</span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'"></span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">Bsp.</span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">Du möchtest einen Textabsatz möglichst gut per CSS lesbar machen etc.</span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">Ausgehend von den <strong>10px </strong>laut der Angabe oben und angenommen es wird</span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">an keiner Stelle überschrieben.</span></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"></span></span></p><p><span style="font-size: 15px"><span style="font-size: 12px"></span></span>[HTML]</p><p>p {</p><p> font-size: 1.2em;</p><p> line-height: 1.4em; </p><p> /* 120% der Schriftgröße ist meist ein guter Wert für die Zeilenhöhe im Fließtext.</p><p> Das variiert je nach Schriftart. </p><p>*/</p><p>}</p><p>[/HTML]<span style="font-family: 'Times New Roman'"><span style="font-size: 12px">Für die Absatzbreite muss man auch wiederum probieren, je nach Schriftart. Aber gut Lesbar sind Absätze mit ca. bis zu 90 Zeichen pro Zeile. Absatzlänge variiert.</span></span></p><p></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><u><strong>Schriftart</strong></u></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><u><strong></strong></u></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><u><strong></strong></u><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">Auch das variiert wieder je nach Länge des Textabsatzes, Position, Schriftgröße etc.</span></span></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><span style="font-size: 12px"><span style="font-family: 'Times New Roman'">Grob gesagt gibt es zwei Varianten zwischen denen du dich entscheiden kannst.</span></span></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><span style="font-size: 12px"></span></span></span></p><p><span style="font-size: 15px"><span style="font-family: 'Arial Black'"><span style="font-size: 12px"></span></span></span></p><ul> <li data-xf-list-type="ul"><span style="font-family: 'Times New Roman'"><span style="font-size: 15px">Schriften mit Serifen (sowie die schriftart für diesen Text)</span></span></li> </ul><p><span style="font-family: 'Times New Roman'"><span style="font-size: 15px"></span></span></p><p><span style="font-family: 'Times New Roman'"><span style="font-size: 15px"></span></span></p><ul> <li data-xf-list-type="ul"><span style="font-family: 'Arial'"><span style="font-size: 12px">Schriften ohne Serifen (so wie die Schriftart für diesen Text)</span></span></li> </ul><p><span style="font-family: 'Times New Roman'"><span style="font-size: 12px"></span></span></p><p><span style="font-family: 'Times New Roman'"><span style="font-size: 12px"><span style="font-size: 12px">Und auch hier variiert es wieder je nach Einsatz</span></span><span style="font-size: 12px">, welche Schrift die bessere Wahl ist.</span></span></p><p><span style="font-family: 'Times New Roman'"><span style="font-size: 12px">Serifen-Schriften, liest man zumeist langsamer als serifenlose Schriften.</span></span></p><p><span style="font-family: 'Times New Roman'"><span style="font-size: 12px">Möchte man also bewusst das ein Text mit mehr Aufmerksamkeit (da langsamer) gelesen wird, kann man z.B. bewusst eine Schrift mit Serifen einsetzen.</span></span></p><p></p><p><span style="font-family: 'Times New Roman'"><span style="font-size: 12px">Serifenlose (sans-serif) Schriften hingegen sind auch in kleineren Schnitten oft noch besser lesbar als Schriften mit Serifen.</span></span></p><p><span style="font-family: 'Times New Roman'"><span style="font-size: 12px"></span></span></p><p><span style="font-family: 'Times New Roman'"><span style="font-size: 12px">Auch ist die Zielgruppe der Seite bzw. der Zweck der Seite nicht ohne Belang.</span></span><span style="font-family: 'Times New Roman'"><span style="font-size: 12px"></span></span></p><p><span style="font-family: 'Times New Roman'"><span style="font-size: 12px">Überschriften mit Serifen wirken natürlich nicht so Modern wie serifenlose Schriften die vielleicht noch schmal geschnitten sind.</span></span></p><p></p><p>Bsp.:</p><p></p><p><span style="font-size: 18px"><span style="font-family: 'Palatino Linotype'"><span style="color: DimGray">Modern</span></span><span style="color: DarkSlateGray"><strong><span style="font-family: 'Palatino Linotype'">Company</span></strong></span></span></p><p></p><p>oder doch </p><p></p><p><span style="font-family: 'Arial'"><span style="font-size: 18px"><span style="color: DimGray">Modern</span><span style="color: DarkSlateGray"><strong>Company</strong></span></span></span></p><p></p><p>____________________________</p><p></p><p>Ich hoffe ich konnte ein paar Ansätze vermitteln. Falls ich was durcheinander</p><p>gebracht habe, darf man mich gern korrigieren. Aber dann bitte nicht mit </p><p>persönlichen Eindrücken sondern Belegen. <img src="/styles/default/xenforo/smilies/zwinker.gif" class="smilie" loading="lazy" alt=";)" title="Wink ;)" data-shortname=";)" /></p><p></p><p>Edith: entschuldige das Schriften durcheinadner, der Editor scheint nicht ganz rund zu laufen. :/</p></blockquote><p></p>
[QUOTE="jackprince, post: 1764243, member: 108135"] [b]AW: Schriftgröße und Art was ist Standard[/b] [SIZE=4][FONT=Arial Black][U][B]Schriftgröße[/B] [SIZE=3] [/SIZE][/U][SIZE=2][SIZE=3]empfehle ich etwas nach folgendem Muster: Die Grundschriftgröße der Seite auf "[B]10px[/B]". [/SIZE][/SIZE][/FONT][/SIZE][HTML] html, body { font-size: 10px; } [/HTML][SIZE=4][FONT=Arial Black][SIZE=2] [/SIZE] [/FONT][SIZE=3][FONT=Times New Roman]Damit hast du eine gute Basis für relative Größenangaben. Das bedeutet wenn du ein relativ Flexibles Layout baust, was sich z.B. in Relation zur vom Benutzer gewählten Schriftgröße verändert, so kannst du beim Umsetzen besser Rechnen. Sowohl beim layouten der Groben Struktur als auch bei Zeilenhöhen, Abständen etc. Bsp. Du möchtest einen Textabsatz möglichst gut per CSS lesbar machen etc. Ausgehend von den [B]10px [/B]laut der Angabe oben und angenommen es wird an keiner Stelle überschrieben.[/FONT] [/SIZE][/SIZE][HTML] p { font-size: 1.2em; line-height: 1.4em; /* 120% der Schriftgröße ist meist ein guter Wert für die Zeilenhöhe im Fließtext. Das variiert je nach Schriftart. */ } [/HTML][FONT=Times New Roman][SIZE=3]Für die Absatzbreite muss man auch wiederum probieren, je nach Schriftart. Aber gut Lesbar sind Absätze mit ca. bis zu 90 Zeichen pro Zeile. Absatzlänge variiert.[/SIZE][/FONT] [SIZE=4][FONT=Arial Black][U][B]Schriftart [/B][/U][SIZE=3][FONT=Times New Roman]Auch das variiert wieder je nach Länge des Textabsatzes, Position, Schriftgröße etc. Grob gesagt gibt es zwei Varianten zwischen denen du dich entscheiden kannst.[/FONT] [/SIZE][/FONT][/SIZE] [LIST] [*][FONT=Times New Roman][SIZE=4]Schriften mit Serifen (sowie die schriftart für diesen Text)[/SIZE][/FONT] [/LIST] [FONT=Times New Roman][SIZE=4] [/SIZE][/FONT] [LIST] [*][FONT=Arial][SIZE=3]Schriften ohne Serifen (so wie die Schriftart für diesen Text)[/SIZE][/FONT] [/LIST] [FONT=Times New Roman][SIZE=3] [SIZE=3]Und auch hier variiert es wieder je nach Einsatz[/SIZE][/SIZE][SIZE=3], welche Schrift die bessere Wahl ist. Serifen-Schriften, liest man zumeist langsamer als serifenlose Schriften. Möchte man also bewusst das ein Text mit mehr Aufmerksamkeit (da langsamer) gelesen wird, kann man z.B. bewusst eine Schrift mit Serifen einsetzen.[/SIZE][/FONT] [FONT=Times New Roman][SIZE=3]Serifenlose (sans-serif) Schriften hingegen sind auch in kleineren Schnitten oft noch besser lesbar als Schriften mit Serifen. Auch ist die Zielgruppe der Seite bzw. der Zweck der Seite nicht ohne Belang.[/SIZE][/FONT][FONT=Times New Roman][SIZE=3] Überschriften mit Serifen wirken natürlich nicht so Modern wie serifenlose Schriften die vielleicht noch schmal geschnitten sind.[/SIZE][/FONT] Bsp.: [SIZE=5][FONT=Palatino Linotype][COLOR=DimGray]Modern[/COLOR][/FONT][COLOR=DarkSlateGray][B][FONT=Palatino Linotype]Company[/FONT][/B][/COLOR][/SIZE] oder doch [FONT=Arial][SIZE=5][COLOR=DimGray]Modern[/COLOR][COLOR=DarkSlateGray][B]Company[/B][/COLOR][/SIZE][/FONT] ____________________________ Ich hoffe ich konnte ein paar Ansätze vermitteln. Falls ich was durcheinander gebracht habe, darf man mich gern korrigieren. Aber dann bitte nicht mit persönlichen Eindrücken sondern Belegen. ;) Edith: entschuldige das Schriften durcheinadner, der Editor scheint nicht ganz rund zu laufen. :/ [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?
Antworten
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
Schriftgröße und Art was ist Standard
Oben