サイト翻訳処理の概要

本ドキュメントでは、技術的な観点からAutolingualがサイト翻訳をどのように処理しているのかを記載します。

#概要

Autolingualは対象サイトのHTMLドキュメントを抽出し、そのテキスト部分について翻訳を行い、再表示することによって、サイトを多言語化します。

翻訳アルゴリズムに関しては、Google Cloud Translation(ニューラル機械翻訳)とGemini(LLM)の2つを組み合わせて翻訳しています。 まず対象サイトのHTMLドキュメントを抽出し、そのテキスト部分をGoogle Cloud Translationが一次翻訳して、サイトに再表示します。 その後、Geminiがテキストの文脈をもとに翻訳結果を校正するバッチ処理を行います。バッチ処理は、対象サイトごとに1時間に1回行われます。

このようなアルゴリズムにより、リアルタイムでの素早い翻訳と翻訳品質の高さを同時に実現しております。

テキスト以外の各種要素(画像、ファイル、リンク、動画)については、翻訳が行われません。 これらテキスト以外の各種要素を他言語ページで置き換えを行うためには、編集機能から設定を行う必要があります。

【プロジェクト画面】2-3-1.プレビュー / 編集

画像置換機能 / AI画像翻訳機能

【プロジェクト画面】2-3-2.ライブモード(ライブプレビュー/ライブ編集機能)

#テキスト翻訳における翻訳ユニットの認識

Autolingualでは、「翻訳ユニット」と呼ばれる、HTML上のタグで区切られたテキスト単位によって翻訳を実行します。 このとき、インラインタグは区切りとみなさず無視し、ひとつの翻訳ユニットとして翻訳が行われます。 サイトの見かけ上連続する文章であっても、翻訳ユニットが異なると別単位として翻訳がされるため、より翻訳精度を向上させるには、翻訳ユニットを考慮した上でサイト設計を行う必要があります。

※インラインタグ一覧

以下のタグは”インラインタグ”として扱うため、これらのタグで区切られたテキストは一つの翻訳ユニットとして扱われます。

a ,span ,strong ,b ,em ,i ,u ,small ,mark ,sub ,sup ,s ,del ,ins ,code ,q ,cite ,time ,var ,samp ,kbd ,abbr ,bdi ,bdo ,ruby ,rt ,rp ,data ,dfn ,label ,br

#翻訳ユニットの定義

HTML上のタグで区切られた、テキストノードが一つの翻訳ユニットとなります。

<div>
	<span>こんにちは。</span>
	これはAutolingualの記事です。
	<div>
		 明日の天気は<strong>晴れ</strong>です。
	</div>
	<div>
		<p>ほんやく</p>
	</div>
	<div>
		<p>ほ</p>
		<p>ん</p>
		<p>や</p>
		<p>く</p>
	</div>
	<div>
		ほん
		<br>
		やく
	</div>
</div>

上記HTMLにおいて、翻訳ユニットとそれに対する英語翻訳は以下となります。

  • <span>こんにちは。</span>これはAutolingual記事です。”→”Hi. This is an Autolingual article.”
  • “明日の天気は<strong>晴れ</strong>です。”→”The weather will be sunny tomorrow.”
  • “ほんやく”→”translation”
  • “ほ”→”ho”
  • “ん”→”n”
  • “や”→”or”
  • “く”→”ku”
  • “ほん<br>やく”→”translation”

#適切な翻訳を実現するためのプラクティス

上記の「ほ」「ん」「や」「く」の事例のように、テキストがタグによって分断されている場合、それぞれが異なる翻訳ユニットとして認識されるため、適切な翻訳にならない場合があります。

この翻訳ユニットを把握したうえで、サイトを構成することで、翻訳精度を向上させることができます。

#翻訳ユニットの制限

1翻訳ユニットあたり6万バイト(約2万文字)が最大文字数となっております。この制限を超える場合、翻訳がされません。 その場合、テキストをタグによって分割していただくようにお願いいたします。

#LLM翻訳による翻訳品質の向上について

Autolingualでは、LLMによる翻訳修正のバッチ処理の際に、独自の取り組みを多数組み合わせることで、高い翻訳品質を実現しています。

具体的には、

1.ページ上での位置に応じた翻訳/修正 2.前後の文脈を加味した翻訳/修正

を行うことによって、翻訳品質を向上させています。

#1.ページ上での位置に応じた翻訳/修正

Autolingualではテキストを抽出する際、ページにおける位置データも紐づけて保存しています。 これによって、ページ内での同じテキストを区別できると同時に、ページ上の位置に応じた翻訳/修正が可能になります。

例えば英語で「Home」という文字があったときに、これを日本語に翻訳する際に「家」にするか、「ホーム」にするかは、同じサイトの中でもページ上の位置によって変わります。 「Home」がサイトヘッダーにある場合は、一般的には「家」は誤訳になるため、このようなページ上の位置を加味して翻訳/修正を実施することが可能です。

#2.前後の文脈を加味した翻訳/修正

Autolingualではテキストを翻訳する際、前後の文脈も見て翻訳/修正を実施します。 例えばページ内で、「月」・「火」・「水」といった単語が連続した場合、これは明らかに曜日であることがわかりますが、一般的には「Moon」・「Fire」・「Water」にそれぞれ翻訳されます。

Autolingualは翻訳する箇所の周囲のテキストを踏まえながら翻訳/修正を実施するため、これらを曜日として認識し、「Mon」・「Tue」・「Wed」と翻訳することが可能です。

#動的要素の検出と翻訳

AutolingualではJavascript等によって動的にページ内容が更新される箇所についても、翻訳がなされるような設計になっています。 Autolingualには対象サイトのHTMLドキュメントを監視し、更新を検知する仕組みが備わっています。 この仕組みにより、動的処理による追加要素の表示や、変更を検知し、動的要素についても、翻訳がなされるようになっています。

#翻訳対象外となる可能性がある動的要素

下記の場合については、翻訳対象外になる可能性があります。

  • 同時に多数の動的な更新が行われる場合
  • 自由検索結果の表示

サイト個々の実装方法によって、翻訳が可能かどうかや、可能でなかった場合の適切な対応方法が異なります。 ご不明な点については、サポート担当までお問い合わせください。

#テキストであってもAutolingual翻訳の対象外となるケース

#iframe

iframeで実装されたコンポーネントについては、対象サイトのHTMLドキュメントとは異なるドキュメントとして存在しているため、現在Autolingualによる翻訳ができず、元言語が表示されたままとなる場合がございます。 また、その場合、リンクや画像の置き換えもできません。

#inputタグvalue属性

サーバー側に送られる可能性があるテキストであるため、inputタグvalue属性については翻訳処理がされません。 一部のtypeでは翻訳対象に設定することもできます。 こちらをご希望の場合、お問合せください。

#Shadow DOM

Shadow DOMで実装されたコンポーネントについては、現在Autolingualによる翻訳ができず、元言語が表示されたままとなります。

#セキュリティ要件

一部サイトのセキュリティの各種仕様によっては、Autolingualによるテキストの置き換えが正常に動作しない場合があります。 サイトの実装方法等によって適用が異なりますので、ご不明な点についてはサポート担当までお問い合わせください。