websichere schriftarten - Homepage FAQs

Websichere Schriften / Schriftarten, alternative Schriftarten, schön gestaltete Texte in Textform und Text in Headergrafik als unsichtbarer H1-Tag

A) Liste mit weitverbreiteten Schriftarten

http://www.webmasterpro.de/design/news/2009/02/02/verbreitung-von-schriftarten-im-web.html

Zitat:

...wer seine Website in Arial, Verdana, Trebuchet oder Georgia gestaltet ist auch weiterhin auf der sicheren Seite.

B) Alternative Schriftarten angeben

Einfaches Prinzip - bei der CSS-Angabe font-family drei oder mehr Schriftarten angeben, wobei...

die 1.Angabe die gewünschte Schriftart ist,...
die 2.Angabe ist eine sehr ähnliche, aber noch weitverbreitete Schriftart...
und zuletzt eine generische Schriftfamilie (korrigiert nach Hinweis von Ingo)

Beispielzeile in der CSS-Datei

font-family:Arial, Verdana, sans-serif;

Infos zu font-family >> http://de.selfhtml.org/css/eigenschaften/schrift.htm#font_family

Auszug:

Folgende generische Schriftfamilien sind fest vordefiniert - diese Angaben können Sie also neben Schriftartnamen benutzen:

serif = eine Schriftart mit Serifen,
sans-serif = eine Schriftart ohne Serifen,
cursive = eine Schriftart für Schreibschrift,
fantasy = eine Schriftart für ungewöhnliche Schrift,
monospace = eine Schriftart mit dicktengleichen Zeichen.

Es empfiehlt sich, solche generische Schriftarten als letzte Angabe einer Wertzuweisung an font-family zu notieren...

C) Schöne gestaltete Texte in Textform

Um der Schrift mehr grafische Effekte zu verleihen muss es keine Grafik sein, einfach mal mit fett und/oder kursiv sowie Grösse und Farbe versuchen.

Beispiel

Herzlich Willkommen
(Schriftart Georgia, fett, kursiv, farbig, verschiedene Schriftgrösse)

D) Text in Grafik maschinenlesbar machen

1) Texte in Grafiken im Alt-Attribut angeben, siehe

http://de.selfhtml.org/html/grafiken/einbinden.htm#referenz

Auszug von SELFHTML:

Das Attribut alt ist Pflichtangabe für jede Grafikeinbindung. Geben Sie darin einen Alternativtext an für den Fall, dass die Grafik nicht angezeigt werden kann. Das sollte bei rein illustrierenden Schmuckgrafiken in der Form alt="" geschehen, um die Grafik als inhaltslos zu kennzeichnen. Vermeiden Sie es in solchen Fällen, die alt-Attribute von Grafiken mit unsinnigen Inhalten wie "spacer.gif" o.ä. zu befüllen.
...
Grafiken, welche Text enthalten, sollten beispielsweise als Alternativtext auf jeden Fall diesen Text erhalten.

2) Bei Headergrafiken wird der Text oft als H1-Tag (wichtig für Suchmaschinen) in den Quelltext gesetzt und für Besucher mit der CSS-Angabe display:none ausgeblendet, siehe

http://de.selfhtml.org/css/eigenschaften/positionierung.htm#display

Eigenwerbung

Gute Websites finden und weitersagen (neuer Webkatalog)