Schnellnavigation:

Kategorien

« Oktober 2010»
S M T W T F S
          1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31            

Kopieren Sie diesen Link in Ihren RSS-Reader

RSS 0.91Nachrichten
RSS 2.0Nachrichten

In eigener Sache

Peter Linzenkirchner, Lisardo EDV Beratung in Augsburg. Freelance und Partner für Design- und Webagenturen in Augsburg und München. Pixelgenaue Templates, valides HTML, barrierearm. TYPO3-Projekte, Extension-Programmierung und mehr ... 

Die fehlende Silbentrennung in den Browsern ist ein leidiges Problem, da der dadurch entstehende Rauhsatz vor allem bei kurzen Zeilen sehr unschön wirkt. Wenn sich Redakteure dadurch verleiten lassen, Zeilenumbrüche mit festen Trennzeichen vorzunehmen, wird ein echtes Problem daraus, da der Inhalt nicht mehr gezoomt werden kann und vor allem nicht mehr in anderen Zusammenhängen funktioniert, z. B. in einem RSS-Feed. 

Vor kurzem bin ich auf ein JavaScript gestoßen, das diese Funktion zumindest in Ansäzten nachrüsten kann – auf Clientseite, so dass die Datenbank sauber bleibt: Hyphenator aus den Google-Labs. 

Das Skript ist Open Source und besteht aus einer zentralen JavaScript-Datei sowie einer ganzen Reihe von Sprachbibliotheken. Es ist einfach zu installieren: 

Dieses JavaScript muss eingebunden werden: 

  1. <script src="http://yourdomain.com/path/Hyphenator.js" type="text/javascript"></script>
  2. <script type="text/javascript">
  3.       Hyphenator.run();
  4. </script>

Die Sprachbibliotheken im Ordner »patterns« müssen ebenfalls auf den Server kopiert werden, in den gleichen Ordner wie »Hyphenator.js«. Empfohlen wird, die Seite in UTF-8 auszuliefern. Die Sprachumschaltung funktioniert über die Sprachangabe im HTML-Tag. Das kann in TYPO3 so eingestellt werden: 

  1. htmlTag_setParams = xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de"

Zusätzlich müssen die HTML-Conteiner mit den Inhalten, die eine Trennung erhalten sollen mit dieser Klasse ausgezeichnet werden: 

  1. class="hyphenate"

Das Skript ist gewichtig: mit der deutschen Sprachbibliothek müssen 140 KB geladen werden. Ausserdem wird wohl eine Menge Rechenleistung vom Browser gefordert. Ich habe es mal hier installiert und werde testen, wie es sich auf Dauer auswirkt. Prinzipiell funktioniert es in den modernen Browsern, in den IEs allerdings nicht ganz klaglos. Im IE7 gibt es ein kleiners Flackern im Seitenaufbau, im IE 6 sogar eine Denkpause von ca. 1 Sekunde, bis der neu umbrochene Text erscheint. Ich denke, meine Leser hier kommen eher selten mit IE 6, so dass es nichts ausmacht. Auf Seiten, die stark auf IE 6 und 7 setzen würde ich es wohl nicht einsetzen. 

Mehr Informationen: 

[Update]

Sven hat mich in einem Kommentar darauf hingewiesen (siehe unten), dass der hyphenator eine unangenehme Nebenwirkung hat. Da er in alle Wörter per JavaScript bedingte Trennzeichen einfügt, lesen viele Screenreader (und leider auch VoiceOver) den Text nicht mehr wort- sondern silbenweise. Klingt ziemlich schräg ... Näher erläutert und mit anschaulichen Soundbeispielen versehen wird das Problem im quickblog. Dort findet sich auch eine Diskussion mit dem Autor des Hyphenator, Mathias Nater. 

Ich bin jetzt noch am Schwanken: eigentlich möchte ich meine Seite einigermaßen zugänglich gestalten, andererseits – na ja, die Trennungen gefallen mir natürlich. Bleibt die Hoffnung, dass die Browserhersteller und die Hersteller von Screenreadern das Problem irgendwann lösen (in Firefox scheints bereits jetzt zu funktionieren). Immerhin sollten Trennungen generell nicht »vorgelesen« werden; ich halte das schon auch für einen Fehler der Reader. 

Kategorien: Redaktionelles/Sonstiges  
Links:
Trackback-Link  (Bitte kopieren)
 
| Mehr
  •  
  • Kommentare
  •  
Gravatar: Sven Wolfermann
Sven Wolfermann am
21Oktober2010
Hyphenator

Leider macht die Hyphenator.js dem IE Probleme bei der Ausgabe für Screenreader, wie Fritz Weisshart auf quickblog.weisshart.info/blocksatz-silbentrennung-und-screen-reader festgestellt hat.

Mein Kommentar

Benachrichtige mich, wenn jemand einen Kommentar zu dieser Nachricht schreibt.

Besuchen Sie mich auf Google+