HTML

Einleitung

HTML ist DIE Sprache des World Wide Web, denn jede der aktuell ca. 1,7 Milliarden Internetseiten weltweit mit ihren fast unzähligen Unterseiten besteht letztlich aus HTML. HTML hat dadurch als Dokumentenformat natürlich eine enorme Bedeutung. Auch im Bereich der Übersetzung spielt HTML – im viel zitierten Zeitalter der Globalisierung – eine wichtige Rolle. HTML findet sich aber nicht nur in Webseiten. Häufig bestehen z. B. auch die Online-Dokumentationen von Software aus HTML.

Früher wurden Webseiten am häufigsten mit HTML-Editoren erstellt. Heutzutage erfolgt die Erstellung von Webseiten oft mithilfe so genannter Content-Management-Systeme (kurz CMS). Diese arbeiten häufig webbasiert: Der Zugriff auf diese Systeme – und somit auch die Erstellung und Bearbeitung der Webseiten – erfolgt über einen herkömmlichen Webbrowser. Relativ weit verbreitet sind z. B. WordPress, Joomla!, Drupal und TYPO3. Neben diesen auf dem Markt etablierten Systemen kommen aber auch CMS-Eigenentwicklungen von Unternehmen und Agenturen zum Einsatz.

Im Zusammenhang mit der Übersetzung von Webseiten spricht man übrigens häufig nicht von Übersetzung, sondern von Lokalisierung. Unter Lokalisierung versteht man im Allgemeinen die technische, sprachliche und kulturelle Anpassung eines Produkts an einen regionalen Markt. Die Lokalisierung umfasst also mehr als die reine Übersetzung!

Übrigens, es besteht keinerlei inhaltlicher oder technischer Unterschied zwischen Dateien mit der Endung .html und .htm. Die Endung .htm stammt lediglich noch aus einer Zeit, in der Dateinamen aus max. 8 Zeichen für den Dateinamen und 3 Zeichen für die Dateiendung bestehen durften.

HTML – eine kurze Einführung

Das Akronym HTML steht für Hypertext Markup Language. HTML ist also eine Auszeichnungssprache, d. h. eine Sprache, die mithilfe von Auszeichnungselementen – den so genannten Tags – den Inhalt einer Webseite „strukturiert“.

Eine HTML-Datei besteht also aus dem Inhalt einer Webseite – normalerweise ein Text – und zusätzlich aus Tags. Ein Tag besteht dabei jeweils aus zwei spitzen Klammern (< und >), zwischen denen der Name des Tags steht, wie z. B. <strong>. Tags treten dabei meist paarweise auf, und zwar in Form eines Start-Tags (z. B. <strong>) und eines End-Tags (z. B. </strong>). Start-Tag und End-Tag bilden zusammen mit dem Inhalt des Tags, also dem, was zwischen diesen beiden Tags steht, ein so genanntes HTML-Element.

Einige Tags sind einer bestimmten Funktion oder semantischen Auszeichnung vorbehalten. Der oben genannte Tag <strong> steht allgemeingültig für eine Hervorhebung, die im Webbrowser beispielsweise durch Fettdruck abgebildet werden kann. Der Tag <h1> (von engl. Heading 1) etwa steht für eine Überschrift der ersten bzw. obersten Ebene.

Viele Tags können durch Attribute (und den dazugehörigen Attributwerten) ergänzt werden, wie z. B. beim Tag <img />, mit dem eine Abbildung in eine Webseite eingefügt wird. In diesem Fall muss zusätzlich zum Tag mindestens die Quelle der Abbildung angegeben werden (z. B. <img src="/media/foto.jpg" />).

Vor dem Projektstart

Neben normalem Text enthalten HTML-Dateien naturgemäß Tags, können darüber hinaus aber auch spezifischere Elemente wie z. B. Skriptinhalte enthalten.

Wichtig: Die Form, in der Webseiten für die Lokalisierung vorliegen, hängt auch von der Software ab, mit der diese erstellt wurden (siehe oben). So ist es z. B. von Bedeutung, ob ein eingesetztes CMS über Export- und Importfunktionen verfügt, um den Austausch der Webinhalte technisch zu unterstützen. Auch ist es möglich, dass die zu lokalisierenden Webinhalte gar nicht im HTML-Format ausgespielt werden, sondern in einem anderen Format wie XML oder XLIFF.

Wichtig: Im Falle einer vollständigen Lokalisierung einer Website ist es wichtig, dass alle relevanten Dateien vorliegen. Neben den zu lokalisierenden Webseiten zählen hierzu auch Bilder und sonstige Grafiken sowie ggf. auch Multimediadateien, falls diese ebenfalls lokalisiert werden sollen.

Tipp: Es empfiehlt sich, für das aktuelle Lokalisierungsprojekt eine neue Dokumenteneinstellungsvorlage anzulegen, um diese anschließend individuell anzupassen. Hierzu in den Bereich „Tagged HTML“ der Systemeinstellungen wechseln (über >>Tools >>Systemeinstellungen ... >>Dokumenteneinstellungen >>Tagged HTML), über Neu eine neue Einstellungsvorlage anlegen und anschließend einen Namen vergeben. Die neue Vorlage ist standardmäßig bereits mit den gängigsten HTML-Elementen und -Attributen befüllt und auch schon entsprechend konfiguriert. Anschließend kann es sinnvoll sein, eine zu lokalisierende HTML-Datei über die Schaltfläche Laden ... auszulesen. Dadurch wird die aktuelle Einstellungsvorlage um HTML-Elemente und -Attribute ergänzt, die u. U. noch nicht in der Vorlage enthalten sind.

Vor der Projektanlage ist zunächst zu prüfen, welche spezifischen Inhalte die HTML-Dateien haben und wie mit ihnen im Rahmen der Lokalisierung vorzugehen ist:

Anpassung von Hyperlinks

Bei Hyperlinks ist zu klären, ob diese an die jeweilige Zielsprache angepasst werden sollen (z. B. im Falle von www.my-across.net in einem deutschen Text im Vergleich zu www.my-across.net/en/ in einem englischen Text).

Tipp: Die Standardeinstellungen der Across Translator Edition sehen vor, dass Hyperlinks nicht angepasst werden können. Um dies zu ändern, muss die entsprechende Option in den Einstellungen der Einstellungsvorlage von Tagged HTML unter >>Tools >>Systemeinstellungen ... >>Dokumenteneinstellungen >>Tagged HTML angepasst werden. Hierzu in der entsprechenden Einstellungsvorlage das Element für Hyperlinks „A“ auswählen (hierzu am besten auf den Spaltenkopf „Name“ klicken, um die Liste der Elemente alphabetisch zu sortieren) und auf Bearbeiten … klicken. Anschließend in die Registerkarte „Attribute“ wechseln, das Attribut „href“ auswählen (das das Ziel des Hyperlinks definiert) und über die Dropdown-Liste in der Spalte „Modus“ die Aktion „Übersetzbar“ festlegen. Abschließend die Änderung mit OK bestätigen.)

Lokalisierung von Meta-Tags

Im Bereich der Suchmaschinenoptimierung (engl. Search Engine Optimization, kurz SEO) spielt der Inhalt der so genannten Meta-Tags eine besondere Rolle. Exkurs zu Head, Body & Meta-Tags: Meta-Tags sind Bestandteil des so genannten Kopfes (engl. head) einer HTML-Datei. Anders als die Inhalte des HTML-Körpers (engl. body), die den sichtbaren Teil einer Webseite umfassen, sind die Inhalte des Heads nicht auf der Webseite sichtbar. Denn sie enthalten Informationen über die Webseite, wie z. B. Informationen zur Kodierung der Webseite, zum Autoren oder auch zum Inhalt der Webseite. Meta-Tags können dabei mehrfach vergeben werden, und zwar mit jeweils unterschiedlichen Attributen. So spielt im SEO-Bereich z. B. der Meta-Tag mit dem Attribut „description“ eine wichtige Rolle, da die darin hinterlegten Informationen normalerweise in den Trefferlisten der Suchmaschinen angezeigt werden. (Die Angabe von Schlüsselwörtern über das Attribut „keywords“ ist heutzutage eher zu vernachlässigen, da diese von den meisten Suchmaschinen ohnehin ignoriert werden.) Es ist hinsichtlich der Meta-Tags zu prüfen, ob die HTML-Dateien SEO-relevante Meta-Tags enthalten. Anschließend ist ggf. mit dem Auftraggeber zu klären, ob diese lokalisiert werden sollen. (Tipp: Die Standardeinstellungen der Across Translator Edition sehen vor, dass die Inhalte von Meta-Tags nicht lokalisiert werden. Um dies zu ändern, muss das Element „META“ in der entsprechenden Dokumenteneinstellungsvorlage ausgewählt und für das Attribut „content“ die Aktion „Übersetzbar“ festgelegt werden (vgl. oben die Beschreibung zur Anpassung des Attributs „href“ bei Hyperlinks).

Skriptinhalte

Um bestimmte Funktionen wie z. B. dynamische Inhalte in eine HTML-Datei einzufügen, werden so genannte Skriptsprachen (z. B. JavaScript) verwendet. Der entsprechende Code wird in aller Regel nicht übersetzt, dieser kann allerdings auch zu lokalisierende Strings enthalten. (Tipp: Die Standardeinstellungen der Across Translator Edition sehen vor, dass Strings von Skriptinhalten übersetzbar sind. Um dies zu ändern, muss die entsprechende Option in den erweiterten Einstellungen der Einstellungsvorlage von Tagged HTML über >>Konfigurieren ... >>Erweitert ... angepasst werden.)

Längenbeschränkungen

In bestimmten Fällen kann es nötig sein, dass ein Element eine bestimmte Anzahl an Zeichen nicht überschreitet, z. B. um zu gewährleisten, dass der entsprechende Inhalt vollständig angezeigt wird (wie etwa beim title-Tag, für den Titel einer Webseite). Mit dem Auftraggeber ist im Vorfeld zu klären, ob Längenbeschränkungen für bestimmte Elemente bestehen. (Tipp: Um für ein Element eine Längenbeschränkung festzulegen, das entsprechende Element in der Einstellungsvorlage von Tagged HTML auswählen und auf Bearbeiten ... klicken. Anschließend die Option „Max. Länge“ aktivieren und die maximale Zeichenzahl eingeben.)

Lokalisierung von HTML-Dateien mit der Across Translator Edition

Bei der Lokalisierung von HTML-Dateien gibt es – neben der Übersetzung des „normalen“ Textes – HTML-spezifische Dinge zu beachten. Hierzu zählen u. a.:

Tags in die Übersetzung übernehmen

Bei der Lokalisierung von HTML-Dateien müssen die HTML-Tags, die im Quelldokument enthalten sind, in die Übersetzung eingefügt werden. Hierbei ist auf die richtige Position der Tags wie auch auf deren korrekte Reihenfolge zu achten (z. B. immer zuerst den Start- und dann den End-Tag). Hierzu am einfachsten den Cursor an die Position setzen, an der der Tag eingefügt werden soll, und anschließend einen Doppelklick auf den entsprechenden Tag im Quellsegment machen. Oder alternativ per Tastenkombination: Mit Strg+Umschalt+1 wird z. B. der erste Tag des aktuellen Quellsegments in die Übersetzung eingefügt, mit Strg+Umschalt+2 der zweite Tag usw. Mit Strg+Umschalt+0 wird zudem der jeweils aktuelle Tag in die Übersetzung übernommen. (Tipp: Die Qualitätsmanagementkriterien „Placeables-Verwendung“ und „Placeables-Reihenfolge“ helfen, Fehler beim korrekten Einfügen von Tags in die Übersetzung zu vermeiden.)

Zusätzliche Tags einfügen

Es kann nötig sein, zusätzlich zu den Tags, die in einem Quellsegment enthalten sind, weitere Tags in die Übersetzung einzufügen, z. B. um ein zusätzliches Wort in der Übersetzung hervorzuheben oder um einen zusätzlichen Hyperlink hinzuzufügen. Hierzu an der Position, an die der zusätzliche Tag in die Übersetzung eingefügt werden soll, mit einem Klick auf die rechte Maustaste das Kontextmenü öffnen und den Befehl Inline Tags einfügen wählen. Anschließend den gewünschten Tag aus der Liste auswählen, ggf. Attributwerte hinzufügen und mit OK bestätigen. Daraufhin wird an der aktuellen Cursor-Position das entsprechende Tag-Paar in die Übersetzung eingefügt.

Lokalisierung von Hyperlinks

Insofern die Lokalisierung von Hyperlinks an die jeweilige Zielsprache vorgesehen ist (siehe oben), ist der entsprechende Attributwert des Attributs „href“ während der Übersetzung anpassbar. Hierzu einfach anstelle der quellsprachlichen URL die zielsprachliche URL in die Übersetzung einfügen.

Tipps & Tricks

Finale Prüfung der lokalisierten Webseiten im Browser

Nachdem die Lokalisierung fertiggestellt und die HTML-Dateien aus der Across Translator Edition ausgecheckt sind, gebietet es die Sorgfaltspflicht, die lokalisierten Webseiten in einem Webbrowser zu öffnen, um diese final zu prüfen, insbesondere im Hinblick auf die korrekte und vollständige Darstellung der Inhalte, aber auch was z. B. das korrekte Funktionieren von Hyperlinks anbelangt. (Anmerkung: Anstelle der Abbildungen werden in den lokalisierten Webseiten häufig lediglich Rahmen in der Größe der Abbildungen angezeigt. Dies ist technisch bedingt, da die Abbildungen häufig über so genannte relative Links in die Webseiten eingefügt werden und ohne weitere Anpassungen daher kein Zugriff auf die Abbildungen möglich ist.)

Einstellungen der Dokumenteneinstellungsvorlage prüfen

Über eine integrierte Vorschaufunktion lassen sich auf übersichtliche Weise die aktuellen Einstellungen einer Dokumenteneinstellungsvorlage prüfen. Hierzu über >>Konfigurieren ... >>Vorschau ... den Vorschaudialog öffnen, über Durchsuchen ... eine zu lokalisierende HTML-Datei auswählen und anschließend die Vorschau über OK erstellen. Daraufhin wird im Quellcode der HTML-Datei anhand von unterschiedlichen Farben angezeigt, welche Teile der HTML-Datei während der Übersetzung z. B. übersetzbar sein werden und welche hingegen ausgeblendet oder gesperrt dargestellt werden.

Bedingtes HTML

Es kann vorkommen, dass der Inhalt eines HTML-Elements nicht in jedem Fall, sondern nur in bestimmten Fällen lokalisiert werden muss, und zwar in Abhängigkeit von einem anderen über- oder untergeordneten Element oder auch in Abhängigkeit vom Attributwert eines Elements. In diesen Fällen besteht die Möglichkeit, die Dokumenteneinstellungsvorlage von Tagged HTML entsprechend zu konfigurieren.

Erweiterte Einstellungen von Tagged HTML

Einstellungen zur Verarbeitung von HTML-Dateien, die etwas mehr ins Detail gehen, wie z. B. Einstellungen zu Zeichen-Entitäten oder zur Behandlung ungültiger wie auch undefinierter Elemente sind in den erweiterten Einstellungen zusammengefasst. Diese finden sich in der entsprechenden Dokumenteneinstellungsvorlage von Tagged HTML unter >>Konfigurieren ... >>Erweitert ...