Verwendung des translate-Attributs in HTML

Frage

Wozu dient das translate-Attribut und wie ist es zu verwenden?

Kurze Antwort

Das translate-Attribut in HTML5 gibt an, ob der Inhalt des Elements übersetzt werden soll oder nicht. Es hat keinen Einfluss auf die Darstellung der Seite (obwohl man es natürlich stylen könnte, wenn es dafür einen guten Grund gibt). Beispiel:

<h1>Verwendung des <span class="kw" translate="no">translate</span>-Attributs in HTML</h1>

Das Attribut kann bei jedem Element vorkommen, und es kann nur zwei Werte annehmen: yes oder no. Beim Wert no sollten Übersetzungswerkzeuge den Text im Element nicht übersetzen. Ein Übersetzungswerkzeug kann ein automatisches Übersetzungsprogramm sein, wie es in den Online-Services von Google, Microsoft und Yandex verwendetet wird. Oder es kann ein Arbeitsmittel eines (menschlichen) Übersetzers sein, das den Übersetzer davon abhält, den Text unbeabsichtigt zu übertragen.

Wenn das translate-Attribut für ein Element gesetzt wird, dann gilt es für den gesamten darin enthaltenen Inhalt. HTML5 hat eine Liste von Attributen, die standardmäßig übersetzt werden. Diese Attribute sollten jedoch nicht übersetzt werden, wenn für das betreffende Element translate auf no gesetzt ist. Andere Attribute sollten nie übersetzt werden.

Wenn eine Seite kein translate-Attribut hat, kann ein Übersetzungsprogramm oder ein Übersetzer davon ausgehen, dass der gesamte Text übersetzt werden soll. Der Wert yes wird deshalb kaum Verwendung finden. Er ist aber nützlich, um die Angabe eines Vorfahrenelements zu überschreiben und Textteile zu markieren, die doch übersetzt werden sollen. Man könnte bspw. natürlichsprachigen Text in Codebeispielen übersetzen wollen, den eigentlichen Code jedoch unverändert lassen.

Details

Warum ist es notwendig?

Wenn Sie auf Ihren Webseiten translate-Attribute hinzufügen, kann das den Lesern helfen, den Inhalt besser zu verstehen, wenn sie diesen automatisch übersetzen lassen. Es kann auch viele Kosten und Ärger für Anbieter von Übersetzungen mit großem Durchsatz in vielen Sprachen ersparen.

Sie werden das des öfteren benötigen. In der HTML5-Spezifikation gibt es das Beispiel mit dem Bienenspiel. Hier kommt ein wirklichkeitsnäheres Beispiel einer zu übersetzenden Beschreibung eines Geräts, wobei der Text auf der Steuerung am Gerät nicht übersetzt werden soll.

<p>Click the Resume button on the Status Display or the
<span class="panelmsg" translate="no">CONTINUE</span> button
on the printer panel.</p>

In der Übersetzung wird daraus:

<p>Drücken Sie Fortsetzen in der Statusanzeige oder die
Taste <span class="panelmsg" translate="no">CONTINUE</span>
an Ihrem Drucker.</p>

Es folgen weitere Beispiele von Inhalten, bei denen das translate-Attribut vorteilhaft ist. Das erste ist aus einem Buch, worin der Titel einer Arbeit angeführt wird.

<p>The question in the title <cite translate="no">How Far Can You Go?</cite> applies to both the undermining of traditional religious belief by radical theology and the undermining of literary convention by the device of "breaking frame"...</p>

Das nächste Beispiel ist von einer Seite über französisches Brot – Brot heißt auf französisch „pain“.

<p>Welcome to <strong translate="no">french pain</strong> on Facebook. Join now to write reviews and connect with <strong translate="no">french pain</strong>. Help your friends discover great places to visit by recommending <strong translate="no">french pain</strong>.</p>

Sie werden auch dafür sorgen wollen, dass Schlüsselwörter, Programmcode oder Beispiele nicht übersetzt werden.

<p>Here is an example of the <span class="kw" translate="no">label<span> element using the <span class="kw" translate="no">for</span> attribute:</p>

<code translate="no">&lt;label for="postcode"&gt;Enter your postcode to find the nearest store:&lt;/label&gt; &lt;input id="postcode" type="text"&gt;</code>

Wann translate="yes" zu verwenden ist

Der Wert yes für das translate-Attribut wird meist verwendet, um den Effekt eines auf no gesetzten translate-Attributs zu überschreiben. Sie könnten bspw. wollen, dass der natürlichsprachige Text im obigen Beispielcode übersetzt wird, während der Code selbst (d.h. Schlüsselwörter wie label, for, postcode, input usw.) unverändert bleibt. Das lässt sich erreichen, indem der natürlichsprachige Text in Elemente mit translate-Attribut eingeschlossen wird.

<p>Here is an example of the <span class="kw" translate="no">label<span> element using the <span class="kw" translate="no">for</span> attribute:</p>

<code translate="no">&lt;label for="postcode"&gt;<span translate="yes">Enter your postcode to find the nearest store</span>:&lt;/label&gt; &lt;input id="postcode" type="text"&gt;</code>

Behandlung von Attributen

Attributwerte können bei der Übersetzung problematisch sein. Allgemein gesagt sind Attributwerte Teil der Markup-Syntax der Seite und sollten demzufolge nicht übersetzt werden. Wenn sie übersetzt werden, ist die Seite fehlerhaft. In manchen Fällen allerdings enthalten Attributwerte menschenlesbaren Text (z.B. Werte der Attribute title, alt und placeholder in HTML), wenngleich das nicht empfohlen ist.*

Man kann bspw. kein Markup verwenden, um bidirektionalem Text in Sprachen wie Arabisch oder Hebräisch zu behandeln oder um anzugeben, wenn die Sprache wechselt. Und es kann natürlich schwer zu entscheiden sein, welche Attributwerte übersetzt werden sollen und welche nicht. Es ist auch schwierig, einen Teil eines Attributwerts zu kennzeichnen, der nicht übersetzt werden soll; oder einen Attributwert, der nicht übersetzt werden soll, obwohl der Elementinhalt übersetzt wird.

Die HTML-Spezifikation listet Attribute auf, die als übersetzbar gelten. Werte von Attributen, die nicht auf der Liste stehen, dürfen nicht übersetzt werden.

Wenn ein „übersetzbarer“ Attributwert bei einem Element vorkommt, für das translate auf no gesetzt ist, dann sollte der Attributwert auch nicht übersetzt werden.

Das ist natürlich problematisch, wenn man den Attributwert übersetzt haben möchte, den Elementinhalt jedoch nicht, oder andersherum. In einigen Fällen kann man das durch verschachteltes Markup beheben. Sie könnten bspw. ein äußeres span-Element haben, für das translate auf yes gesetzt ist und welches das title-Attribut trägt, das übersetzt werden soll. Innerhalb dieses span könnten Sie ein weiteres span haben, für das translate auf no gesetzt ist und welches den Elementinhalt enthält. So werden bei den Artikeln wie diesem hier Links zu übersetzten Versionen umgesetzt: Das title-Attribut des äußeren Elements enthält den Namen der Zielsprache in der Sprache der aktuellen Seite, das innere Element enthält den Namen der Zielsprache in der Zielsprache selbst (und sollte nicht geändert werden). Letzteres dient auch dazu, die Sprache mit dem lang-Attribut zu kennzeichnen.

Das folgende Beispiel zeigt, wie man verhindern kann, dass das Wort „English“ übersetzt wird, wenn es ein Link zur englischen Version des Dokuments ist und die Seite aus dem Deutschen in eine andere Sprache übersetzt wird. Das informative title-Attribut würde übersetzt werden. Ohne translate-Attribut würden Online-Services das Wort „English“ in die Zielsprache oder zu „Deutsch“ übersetzen.

<span title="Englisch"><a href="article.en.html" translate="no" lang="en">English</a></span>

Weil es sich um Attributwerte handelt, ist es immer noch unmöglich anzugeben, ob ein Teil des Texts im Attributwert nicht übersetzt werden soll.

(Beachten Sie, dass die HTML5-Spezifikation noch nicht völlig stabil ist und dass noch nicht alle Implementierungen der Spezifikation folgen.)

Dieser Ansatz unterscheidet sich von dem generellen Ansatz, wie er von der ITS-Spezifikation für XML-basierte Sprachen empfohlen wird. ITS (siehe unten) empfiehlt, dass Attributwerte standardmäßig nicht übersetzt werden. Es bietet aber auch die Möglichkeit, spezielle Attribute anzugeben, die unabhängig von ihrem Kontext übersetzt werden sollen.

translate-Attribute zu einer Seite hinzufügen

Die translate-Attribute können selbstverständlich von Seitenautoren hinzugefügt werden, die sich darüber Gedanken machen, wie sich der Seiteninhalt bei einer Übersetzung verhalten soll. Das ist besonders hilfreich dafür, bestimmte Inhalte von der Übersetzung auszunehmen, wenn der Nutzer die Seite von einem Service, wie ihn Google, Microsoft und Yandex anbieten, automatisch übersetzen lässt.

Bei gewerblichen Übersetzungen könnten Lokalisierer in der Vorbereitungsphase Attribute hinzufügen, um multiplikativen Effekten durch fehlerhafte Übersetzungen in eine größere Anzahl von Sprachen entgegenzuwirken. Das kann durch einen automatisierten Prozess geschehen, bspw. durch Worterkennungswerkzeuge, die automatisch bestimmte Substantive erkennen.

Es ist auch möglich, externe Dateien zu verwenden, um u.a. Markup anzugeben, das nicht übersetzt werden soll. Sie könnten bspw. angeben wollen, dass alle span-Elemente einer bestimmten Klasse nicht übersetzt werden sollen. Ein Weg, das zu erreichen, wird von der Spezifikation Internationalization Tag Set (ITS) beschrieben. Eine solche Regelmenge kann für eine einzelne Seite oder für viele Seiten gleichzeitig gelten. Inhaltsautoren und Lokalisierer sollten dabei eng zusammen arbeiten, diese Regeln zu erstellen, damit ein schnellerer und besserer Lokalisierungsprozess erreicht wird.

Unterstützung des translate-Attributs in Implementierungen

Der Code translate="no" wird gegenwärtig von den Online-Übersetzungs-Services von Google, Microsoft und Yandex unterstützt. Die Verwendung von translate="yes" wird nicht von Microsoft, aber von den beiden anderen Services unterstützt, um die Übersetzung von Teilen innerhalb eines Dokuments zu erlauben, für das als Ganzes die Übersetzung verhindert wird.

Siehe die neusten Testergebnisse.

Die Arbeitsgruppe MultilingualWeb-LT, von der die Spezifikation Internationalization Tag Set erarbeitet wurde, hat ein Dokument Metadata for the Multilingual Web – Usage Scenarios and Implementations zusammengestellt, das weitere Anwendungen und Fälle beschreibt, in denen das translate-Attribut Beachtung findet.

Frühere Ansätze von Online-Übersetzungs-Services

Bevor das translate-Attribut spezifiziert wurde, verwendeten die Übersetzungs-Services sowohl von Google als auch von Microsoft eine Reihe anderer, nicht standardisierter Mittel für denselben Gedanken.

Sowohl Google als auch Microsoft unterstützen class="notranslate". Anstelle eines class-Attributwerts ein Attribut zu verwenden, das formaler Bestandteil der Sprache ist, erhöht aber die Zuverlässigkeit dieses Features, besonders in größeren Kontexten. So kann sich ein Übersetzungswerkzeug darauf verlassen, dass die Bedeutung des translate-Attributs das erwartete Verhalten widergibt. Das macht es auch einfacher, das Konzept auf andere Anwendungen zu portieren, z.B. auf Übersetzungs-APIs oder Lokalisierungsstandards wie XLIFF.

Microsoft unterstützt offenbar style="notranslate". Das gehört nicht zu den Optionen, die Google bei seinen Online-Service vorsieht. Aber andererseits gibt es dort Dinge, die es beim Service von Microsoft nicht gibt.

Wenn bspw. eine ganze Seite nicht übersetzt werden soll, können Sie <meta name="google" value="notranslate"> ins head-Element schreiben, und Google wird keinen Seiteninhalt übersetzen. (Auch <meta name="google" content="notranslate"> wird unterstützt.) Diese Angabe sollte aber nicht Google-spezifisch sein; eine einzige Angabe für alle Services, eben translate="no" im html-Tag, ist weitaus besser.

Die Übersetzungs-Services von Microsoft und Google übersetzen keinen Inhalt in code-Elementen. Darauf haben Sie anscheinend keinen Einfluss – es gibt keine Anweisungen, das zu ändern, wenn Sie den Inhalt eines code-Elements übersetzt haben möchten.

Wie bereits gesagt, bietet das HTML5-Attribut translate ein einfaches und standardisiertes Feature in HTML, das all diese verschiedenen Ansätze ersetzen und vereinfachen kann und Autoren hilft, Inhalte zu erstellen, die auch mit anderen Systemen funktionieren.