Webseite auf UTF-8 umstellen

Zu den großen Herausforderungen in der ewigen Baustelle Internet gehört es, das Encoding richtig einzustellen. Die Geschichte der Zeichensatzcodierung ist lang und hat aufgrund der Eigenarten der einzelnen Sprachen und der bis dato begrenzten Speichermöglichkeit für Zeichensätze zu allerhand Problemen geführt. Unicode ist der Versuch dieses Problem zu beheben und hat sich zum Ziel gesetzt, alle Schrift- und Zeichensysteme zu vereinen.

In Unicode sind heute etwa 100 000 Zeichen definiert, von denen aktuelle Schriftdateiformate maximal 65 536 aufnehmen könnten, denn tatsächlich existiert keine Schrift, die alle Zeichen enthält. Die Schrift mit den meisten Zeichen ist die Code2000 mit knapp 26 000 Zeichen. Ein wesentliches Problem bei Unicode ist die Abwärtskompatibilität, die sicherstellen soll, dass auch ältere Systeme mit den Zeichensätzen funktionieren und, dass einmal aufgenommene Zeichen nicht wieder entfernt werden dürfen. Was z.B. zur Folge hat, dass es diverse Leerzeichen gibt.

Die am häufigsten benutzte Unicode-Codierung ist dabei UTF-8. Es treten immer wieder Probleme bei der Erstellung oder Umstellung einer Seite auf UTF-8 auf, deshalb hier eine Aufstellung der Dinge, auf die zu achten ist.

Grundsätzlich gilt: Immer alles mit derselben Zeichensatzcodierung machen, dann gibt es die wenigsten Probleme.

Editor:
Der häufigste Fehler ist wohl, dass die erstellten Dateien im verkehrten Format abgespeichert sind. Sie müssen als UTF-8 (no BOM) gesichert werden, was man bei halbwegs professionellen Editoren einstellen kann. Das BOM gibt dabei an, in welcher Reihenfolge die Bytes zu lesen sind. Da es bei UTF-8 nicht nötig ist und nicht jede Software, wie z.B. Browser, das verstehen, ’no BOM‘ beim Speichern auswählen. Wichtig ist, dass wirklich ALLE Dateien, egal ob HTML, CSS, JS, … als UTF-8 abgespeichert werden.

Datenbank:
Schon oft habe ich gehört: ‚Es ist egal, wie die Datenbank eingestellt ist, man muss nur nach derselben Methode die Daten speichern und auslesen.‘. Das ist Unsinn, denn die Codierung ist entscheidend bei der Frage, wie die Datenbank intern mit den Daten umgeht, wie sie sie z.B. sortiert. Da eine Datenbank nicht von alleine wissen kann, um welche Sprache es sich handelt, Bytes sind nunmal Bytes, egal in welcher Sprache, müssen Sie die Codierung angeben.

Bei einer MySQL dürfte meistens ‚utf8_unicode_ci‘ für die Kollation die richtige Wahl sein. Das ‚ci‘ bedeutet, dass Groß- und Kleinschreibung unterstützt wird. ‚utf8_general_ci‘ ist die schnellere Variante, die allerdings keine Unterscheidung bei Umlauten vornimmt. Die Sprachvarianten der Kollation sollten nur dann verwendet werden, wenn es wirklich wichtig ist, dass eine ganz exakte Sortierung nach der gewünschten Sprache erfolgen soll/muss. Das hat dann natürlich zur Folge, dass andere Spracheinträge unter Umständen nicht mehr so sortiert werden, wie es eigentlich sein sollte.

Die Kollation der Tabellen sollte entsprechend der DB eingestellt sein. Hier kann man natürlich auch individuelle Kollationen einstellen, das bedingt aber, dass man bei der Verarbeitung der Daten das eben auch berücksichtigt.

Wenn Daten im- oder exportiert werden, stellen Sie das Format auf UTF-8 ein.

Auch die Kommunikation zur Datenbank muss richtig eingestellt sein, direkt nach dem Verbindungsaufbau mit der DB muss der Zeichensatz deklariert werden. In PHP:

Browser:
Auch der Browser sollte mitbekommen, dass er UTF-8 zu verarbeiten hat. Also vor dem Senden irgendwelcher Daten an den Browser einen passenden Header absetzen:

HTML-Kopf:
Im Kopf der HTML-Datei muss dem Browser als Meta-Tag mitgeteilt werden, wie das HTML-Dokument codiert ist. Der Meta-Tag sollte als erster Eintrag direkt unter der Kopf-Deklaration stehen:

CSS:
Die HTTP-Header Codierung ist zwar die vorrangige Codierungs-Deklaration, trotzdem sollten Sie in externen Stylesheets in der ersten Zeile die Codierung der Datei angeben:

Formulare:
Formulare sind der klassische Eintrittspunkt für frische Daten, deshalb auch hier angeben, in welcher Codierung die Daten vorliegen.

Javascript:
Bei externen Javascript-Dateien wird im HTML-Dokument wie folgt codiert:

Und in eingebundenem Javascript:

PHP:
Wenn Sie in PHP eine Multibyte String Funktion benutzen, müssen Sie PHP vor dem Einsatz einer MB-Funktion die Codierung mitteilen:

Und in eingebundenem Javascript:

Wenn Sie alle Punkte berücksichtigt haben, sollten die Daten überall richtig erscheinen. Prüfen Sie, BEVOR ihr Projekt wächst, ob auch alles so ist, wie es sein sollte. Ein Codierungs-Durcheinander ist nicht nur lästig und meistens viel Arbeit, es wieder zu lösen, es kann auch zur völligen Unbrauchbarkeit der Daten führen.

Falls sie weiterhin Schwierigkeiten haben, prüfen Sie, ob der Server die Daten auch korrekt ausliefert und passen Sie gegebenenfalls die .htaccess Datei an, z.B. so:

Einen weiterführenden Artikel finden Sie beim W3C auf der Seite Einstellung der Zeichencodierungsangabe (‚charset‘) in .htaccess.

Es kann vorkommen, dass es Schwierigkeiten gibt, wenn ein Link auf eine Seite verweist, die eine andere Codierung als die Ausgangsseite hat. Mit einer Codierung im Link können Sie den Browser auf diese Situation hinweisen.

Beachten Sie auch immer die Namenkonventionen bei HTML, PHP, MYSQL, CSS, Javascript, … das Nichtbeachten führt schnell zu Problemen.

Coding, CSS, jQuery, MySQL, PHP, Webapplication, Webentwicklung