Unverständnis von CSS-Eigenschaften; Hintergrund der aktiven Navigationsauswahl ändern

[HTML_go]

Hallo Gunnar,

Experimentierfreude (ich) trifft auf Sachverstand (Du) 😁

@@HTML_go

Ich war am "Bearbeiten" des Beitrags, ... wurden die Änderungen aber nicht übernommen, mit der Meldung (so ähnlich), dass ich keine Zugriffsrechte für die Seite habe ...

Vermutlich war dein Zeitfenster, in welchem du deine Beiträge noch editieren kannst, inzwischen zu.

Ach so, nicht Häufigkeit, sondern Zeit. O.k. Weißt Du, wie groß das Zeitfenster ist?

Ich bin zu dem Schluss gekommen, dass sans-serif (serifenlose Schriftarten) für einen Webauftritt doch eher besser geeignet sind. Oder gibt es da andere Meinungen?

Ja, gibt es. ... Wenn der Charakter einer Serifenschrift besser zum Inhalt deiner Seite passt, dann nimm eine Serifenschrift. Wenn der Charakter einer Serifenlosen besser zum Inhalt deiner Seite passt, dann nimm eine Serifenlose.

Dann wähle ich doch eine serifenlose. Danke. 👍

(Man könnte auch per media query auf niedrigauflösenden Displays serifenlose Schrift darstellen und auf hochauflösenden Displays Serifenschrift: Beispiel.)

Ich mag Georgia auch, insb. die Kursive davon. Allerdings ist Georgia schon ziemlich alt und kommt deshalb ohne OpenType-Features daher. Und da stören mich dann:

1. Mediävalziffern. Ich mag Versalziffern einfach lieber.

Huch, Du schmeißt aber auch wirklich mit Fachausdrücken um Dich. Aber hab's gefunden: https://www.typolexikon.de/mediaevalziffern/; da sieht man dann auch den Unterschied zwischen Mediäval- und Versalziffern.

2. Es werden keine automatischen Ligaturen gesetzt.

Und für mich etwas verständlicher (wenn auch viel ausführlicher): https://de.wikipedia.org/wiki/Ligatur_(Typografie).

Georgia kommt damit also nicht in Frage. O.k.

Dein Code

html {
font-family: Georgia, Verdana, Helvetica, Arial, sans-serif;
}

ist aber aus anderem Grund nicht sehr sinnvoll: i.d.R. will man im font stack

(meine Einfügung / Erklärung zu "font-stack" für mich Unwissenden:): https://kulturbanause.de/faq/font-stack/; demnach ist mein Codeschnipsel aus dem standard.css ein "font-stack".

ähnliche Schriften haben. Wenn bspw. Abril Text auf einem System nicht installiert ist, dann nimm Georgia; wenn Georgia auch nicht verfügbar ist, dann nimm die Standard-Serifenschrift dieses Systems.

Verstanden! 😀

Oder man entscheidet sich für serifenlose Schriften. Aber für eine Angabe von wild gemischten serifenlosen und Serifenschriften sollte man schon einen guten Grund haben – oder es nicht tun.

das hier gefunden (ohne lang zu kucken): https://www.lukas-rudrof.de/blog/15-besten-open-source-schriftarten.

Huch, Abril Fatface soll open source sein? Ich bin ganz sicher, dass die Schriftschnitte Abril Text und Abril Display es nicht sind.

Und bei Fira Sans ist als Designer nicht Erik Spiekermann angegeben? Tss.

Tja, da habe ich einfach geglaubt, was mir vorgekaut wurde. Das jetzt alles zu recherchieren führt zu weit. Dir glaube ich, Gunnar. 😁😁

Ändere ich nun den CSS-Code so um,

html {
  line-height: 1.5;
  font-family: Arvo, Helvetica, sans-serif;
}

um die openSource-Schriftart "Arvo" zu nutzen, sehe ich (lokal) keinerlei Änderung im Schriftbild.

Hast du denn die Arvo lokal auf deinem System installiert? Wenn nicht, kein Wunder, dass du keine Änderung siehst. Wenn der Browser den Font nicht findet, kann er den Text nicht in dieser Schrift darstellen und nimmt sich halt die nächste Schrift aus dem font stack.

Ne, ich habe weder die "Arvo", noch eine der inzwischen favorisierten Schriftarten (also "IBM Plux Sans", oder die "Fira Sans") auf meinem System (openSUSE Tumbleweed) installiert. Daher sehe ich sie nicht! 🙄

Wenn du den Text in Arvo gesetzt sehen willst, installiere die Schriftart auf deinem System. Wenn alle (naja, fast alle) Besucher deiner Seite den Text in Arvo gesetzt sehen sollen, packe die Fontdateien auf deinen Webserver und binde Arvo als Webfont ein (@font-face-Regeln).

Na ja, natürlich will nicht nur ich den Text in der bevorzugten Schriftart (ist inzwischen wohl die "IBM Plex Sans", bzw. die "Fira Sans" - beides serifenlose) sehen. Vor allem die Besucher der Homepage sollen die Schrift nutzen.

Also werde ich mich bezüglich "@font-face" weiterbilden. Diese Seite hier, nicht? https://wiki.selfhtml.org/wiki/Typografie/Schriftformatierung#.40font-face

Und mich wundert auch, warum auf dieser Seite https://www.winkelb.com/css-font-family hier im CSS nicht "html", sondern "body" verwendet wird:

Solange du nicht Inhalte des head-Elements anzeigen willst, sollte es ziemlich egal sein, ob man die Brotschrift für html oder für body angibt.

O.k., dann kann ich es ja im fonst-stack bei "html" belassen.

body {
font-family: verdana, arial, helvetica, sans-serif;
font-size: 12px;
}

Abgesehen davon, dass hier auch noch "px" als Größenangabe verwendet werden ("em" ist doch sinnvoller?)

Ja, ist es. Und vor allem: eine lesbare Schriftgröße. 12px ist Unsinn. Ich nenne das: graue Linie.

Und der font stack ist auch Quatsch. Auf Systemen, wo sowohl Arial (bäh!) als auch Helvetica (weniger bäh) installiert ist, soll Arial verwendet werden anstatt Helvetica? Ernsthaft? Wirklich? Helvetica gehört vor Arial (wenn Arial da überhaupt reingehört).

kann es sein, dass die Seite nicht auf dem neuesten Stand ist?

Ja, die Verwendung von Verdana deutet darauf hin.

O.k. Danke! Immerhin habe ich einige schöne Schriftarten gefunden. Die, welche ich brauchen kann, sind offenbar tatsächlich openSource und in verschiedenen Variationen vorhanden (light, regular, italic, semibold, bold). Und das ist ja einer der Gründe, weswegen ich eine solche installieren will; die fette Hervorhebung (bold, statt semibold) in meinen h1-Überschriften der Seite "Arbeit mit Jugendlichen" https://www.kontakt-vs.de/jugend.html. Die ist derzeit ja gar nicht zu sehen ...