Automatische Silbentrennung im Internet? Dank Hyphenator kein Problem!
Haben Sie es bemerkt? Auch unser Blog arbeitet mit einer automatischen der deutschen Sprache angepassten Silbentrennung. Nein, per Hand wurden alle Trennungen gewiss nicht gesetzt. Hierbei setzen wir auf „Hyphenator“, einer Javascript-Anwendung, die browserübergreifend Silben sauber trennt.
Schielten Webautoren noch vor wenigen Jahren neidisch auf Print-Designer, die problemlos – ja sogar gezwungenermaßen – zur Silbentrennung griffen, ist eine Trennung der Silben im Web weiterhin eine Seltenheit. Vorallem die deutsche Rechtschreibung stellt oftmals eine Hürde dar. Sauber zu trennen ist eine Kunst für sich.
Ist Hyphenator als Javascript nicht problematisch?
Nein. Der Vorteil der eingebundenen „hypenator.js“-Datei bzw. deren Funktionsweise ist, dass der Quellcode unberührt bleibt. So bleibt die Barrierefreiheit gewahrt und auch Suchmaschinen können den Quellcode problemlos durchforsten und Inhalte indexieren.
Vorteile und Nachteile von Hyphenator
Eigentliche Nachteile sind in diesem Zusammenhang nicht zu nennen. Ausser, dass wirklich typographische Sonderfälle nicht berücksichtigt werden können und ganz alte Browser die Silben nicht trennen. Aus der Not macht Hyphenator in diesem Falle eine Tugend: Es ist schlichtweg egal! Wer einen alten Browser einsetzt, bekommt die Website ganz normal ohne Silbentrennung angezeigt. Punkt. Und dank der stetigen Weiterentwicklung, profitieren ganz moderne Browser zudem von der zukunftsträchtigen CSS3-Silbentrennung, die in ein paar Jahren Einzug finden soll.
Ein weiteres Plus ist die quelloffene LGPL-Lizenz: Dadurch ist es jedem Webdesigner möglich, Hyphenator selber auf seiner Website einzusetzen.
Sie fanden diesen Beitrag nützlich? Ich freue mich über Kritik, Anregungen und Kommentare und über einen Direkt-Link zu meinem Beitrag.
Hyphenator-Website: http://code.google.com/p/hyphenator/
Wer sich für das Thema „Typographie im Web“ interessiert, kann folgenden Blogbeitrag konsultieren: http://www.elmastudio.de/webdesign/lange-texte-mit-typografischen-tricks-auflockern/
Hallo, Gino – habe deinen Link bei Elmastudio gesehen ist recht interessant – da ich selber auch eher auf mediaquerries gehe. Bisher zumindest
Ps.: der link zur Hyphenator-Website: nicht correkt
grüsse nach Eupen
Hallo Cythux! Vielen Dank für dein positives Feedback. Toll, dass du dem Link gefolgt bist. Ich habe den Link soeben korrigiert, danke für den Hinweis. Ich denke beide Ansätze haben Ihre Vor- und Nachteile, da muss man von Fall zu Fall entscheiden. Es ist klar, dass eine reine Javascript Lösung mit Restriktionen verbunden ist. Allerdings ist selber eine CSS-Lösung mit Nachteilen verbunden. Früher oder später wird sich natürlich reines CSS durchsetzen (Wink mit dem Zaunpfahl nach Redmond).
Hallo, eine Frage hast Du das google Skript benutzt oder Deine WordPress Seite mittels Plugin auf Blocksatz umgestellt?
Hallo Hody, in dem Fall reicht es das Google Script zu nutzen. Möchte man die Typographie noch weiter verbessern, würde ich zum Einsatz des WP-Typography Plugin raten (http://wordpress.org/extend/plugins/wp-typography/) Allerdings sollte darauf geachtet werden, dass das Plugin lange nicht aktualisiert worden ist.
Cool. Das war das, was uns für eng laufende Texte fehlte. Der performanchunger ist ausreichend gering.
Hallo Klaus, danke für dein Feedback. Das Script ist in der Tat recht klein und kann daher durchaus verwendet werden, zumal es nicht aktiv auf den Quellcode Einfluss nimmt und diesen „verschandelt“. Viel Erfolg, vielleicht kannst du beizeiten deine Erfahrungen schildern.
Hallo, wir bekommen Probleme mit der Anzeige auf http://www.tribe-online.de wenn wir das Hypenator Plugin aktivieren. Wir lief einige Zeit aber nun müssten wir es abschalten, weil sons die Seite nicht ganz geladen wird.
Hallo Hody, ich denke da müsstest Du dich schon an den Entwickler selber wenden. Schau mal ob JavaScript-Fehler ausgegeben werden wenn das Plugin im Einsatz ist. Idealerweise sollte das JavaScript im Footer der Seite(ganz unten) geladen werden, um nicht den Ladevorgang der Seite unnötig zu verlangsamen. Vielleicht daher auch mal prüfen wo das JavaScript ausgeführt wird im Quellcode…
Wichtig ist auch dass ganz oben das „Language Attribut“ im HTML-Start Tag angegeben worden ist, zb , ansonsten kann es sein dass Hyphenator die Sprache der Seite nicht korrekt erkennt und ins „Stottern“ gerät (sollte dann zwar einen Fehler ausgeben aber kann auch sein dass das Script dann streikt). Ansonsten effektiv direkt an den Entwickler wenden…
Hmm wird man wohl warten müssen bis ein Plugin Update kommt, aktuell haben wir es deaktiviert.
Hallo Hody, danke für dein Feedback. Also Hyphenator ist auch super einfach ohne Plugin zu implementieren. Im Prinzip besteht das ja nur aus einer Javascript-Datei, die eingebunden werden muss. Ruft man beim Seitenaufruf das Script auf, kümmert sich das Hyphenator-Javascript um alles andere. Würde daher manuell ohne Plugin einbinden und gar nicht erst auf ein Plugin-Update warten.
Danke Gino, welches Script muss ich denn dann benutzen?
Hallo Hody, unter http://code.google.com/p/hyphenator/ findest du das entsprechende Javascript. Der genaue Download-Link lautet: http://code.google.com/p/hyphenator/downloads/list
Hier kannst du ein Beispiel von den Entwicklern sehen und anhand des Quellcodes nachvollziehen wie es eingebunden wird: http://hyphenator.googlecode.com/svn/tags/Version%204.0.0/WorkingExample.html
Im Prinzip ist es einfach. Zuerst muss das Javascript eingebunden und aufgerufen werden und anschließend den jeweiligen HTML-Elementen die Class „hyphenate“ zugewiesen werden. Fertig.
PS: Immer dem HTML-Tag oben in deiner Seite ein Sprachenattribut mitteilen, z.B.