Zum Inhalt springen

Dynamische Schriftersetzung auf Webseiten mit Cufon

Erstellt am 15. Mai 2009 · 9 Antworten · letzte Antwort am 22. Dezember 2014

Tags: Tipp

Sebastian Schmal ·

Heute habe ich das Javascript Tool Cufón getestet und muss sagen, es ist einfach, klein und perfekt. Habe bisher noch keine Probleme im InternetExplorer 6, 7, FireFox2, 3 oder im Safari sehen können. Demo
Ihr könnt Euch mal eine .html Datei erstellen und einen Test mit der dynamische Schriftersetzung von Cufón vorbereiten.

Das gute an dem ganzen System, der H1 oder H2 Tag wird nicht gelöscht und es wird kein „Bild“ erstellt! Der Text bleibt im Tag! Das Negative an dem JavaScript PlugIn, es werden pro Wort ein span erstellt!
Hier mal ein Beispielcode: ( mehr braucht Ihr nicht )

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="cufon-yui.js" type="text/javascript"></script>
<script src="HelveticaNeueLTPro-Roman_400.font.js" type="text/javascript"></script>
<script type="text/javascript">
Cufon.replace('h1');
</script>
</head>
<body>
<h1>This text will be shown in Frutiger LT Std.</h1>
</body>
</html>

Achtung: Da die Schrift für da Web freigegeben wird, müsst Ihr die Lizensen bei „Kauf-Schriften“ lesen!
Wiki: wiki.github.com

Ursprünglich erschienen am 15.05.2009 auf typo3-probleme.de.

Unbekannter Benutzer ·

Ein Leser schrieb:

„Das Negative an dem JavaScript PlugIn, es werden pro Wort ein span erstellt!“
Sorry, aber das geht ja mal gar nicht. Das bläht den ganzen Code unendlich auf. Vielelicht fällt den Machern noch was cleveres ein um den Code zu reduzieren.

Unbekannter Benutzer ·

Ein Leser schrieb:

Hier hat jemand ein Plugin für WordPress geschrieben, das Teil heißt DFR4WP, wirkt ausgereift und funktioniert astrein. http:www.thorstengoerke.de

Unbekannter Benutzer ·

Ein Leser schrieb:

Also die Aussage ‚es wird kein “Bild” erstellt‘ kann man so auch nicht ganz unterstützen, denn das was im Browser angezeigt wird, ist ein Bild, man kann also den eigentlichen Text auch nicht selektieren, das mag manchmal sogar von Vorteil sein, ich finde es so lala!
Klar im Code steht der Text noch drin, wenn man ihn den findet, zwischen den ganzen spans! ; )

Unbekannter Benutzer ·

Ein Leser schrieb:

Der Vorteil ist einfach das keine Bilder im Quelltext stehen, und die Überschriften somit suchmaschinentechnisch nicht verloren gehen . Wenn du die Sache mit Bildern löst dann musst du immer dafür sorgen das das h-Tag auch noch irgendwo versteckt mit dabei ist, damit die suchbots damit was anfangen können. Wenn man cufon nutzt werden für die Suchbots ganz einfach die H-Tags angezeigt da diese ja kein js verarbeiten. Das das in unübersichtliche spans umgewandelt wird ist eigendlich total egal da das ja nur im Browser passiert und die Suchmaschine davon nichts mit bekommt…. und dem user sollte das auch recht egal sein.

Greez Björn

Unbekannter Benutzer ·

Ein Leser schrieb:

Wie immer hat alles vor und nachteile. Natürlich wird der Quellcode unschön, aber dafür wird das aussehen besser.

Nun kann jeder selbst ausrechnen was ihm lieber ist für einige Seiten ist das Aussehen wichtiger als ein perfekter Quellcode füt Google. Davon abgesehen ist natürlich auch ein guter Quellcode noch lange nicht alles was zu findbarkeit beiträgt.