Permalink
Fetching contributors…
Cannot retrieve contributors at this time
92 lines (74 sloc) 6.33 KB
layout page_type page_datetime page_id page_title page_tag page_description
./src/jade/_post.jade
post
2015-10-20T01:32:46
69
translate属性による翻訳の制御
HTML
translate属性使ってます?

HTML5の仕様にはtranslate属性というものがある。翻訳ツールに対して指定した要素の内容が翻訳されるべきかを指定できる属性だ。

code要素の内容を翻訳させたくない時に指定するのがすぐ思いつく用途だろう。JavaScriptやCSSのスニペットが丁寧に日本語訳された時のあのなんとも言えない感じ、どうにかならないかなと思っていた。プログラミングのコードに限らず、コピーライトや商標、日本語に翻訳する必要のないよく使われている英単語などもそうだ。

しかし機械には何を翻訳すべきかなど推察できるはずもない。そこでウェブページの著者が閲覧者の意図を推察し、あらかじめ何が翻訳されるべきか・されないべきかを指定することができるのがtranslate属性である。

translate属性にはyesno""(�空文字列)、inheritを指定できる。""yesと同じで、翻訳されてよい状態になる。noにすると翻訳させない状態になる。inheritは親要素のtranslate属性の値を継承する値で、かつ初期値でもある。また、translate属性が不正な値だった時もinheritとなる。これは簡単な説明で、仕様的には翻訳モードの話などがあるが、それらは各自で調べて欲しい。

translate属性の値は子要素に継承されるので、translate="no"な要素内で個別に翻訳をenableにしたい場合は、要素ごとにtranslate="yes"を指定しなおす必要がある。

<div class="snippets" translate="no">
  ...
  <p translate="yes">...</p>
  <pre>...</pre>
  <p>...</p>
  <pre>...</pre>
  <pre>...</pre>
  <pre>...</pre>
  <p translate="yes"></p>
  ...
</div>

このようにすれば、包括要素のtranslate="no"によって子要素をすべて翻訳対象から除外しつつ、特定の要素を翻訳対象に戻すことができる。

だいたいのウェブサイトでは翻訳を除外したい要素ごとにtranslate="no"を付与する方が簡単だと思うが、値が継承されることと子要素ごとに上書きできることを覚えておきたい、ということで。

ツールの対応状況

では、肝心の対応状況はどうなっているかと思って主要かと思われるツールで調べてみた。デモは以下を用意した。divやpre要素などをいくつか用意して、それぞれにtranslate="no"を指定している。

Translate Attribute Test

翻訳ツール translte属性対応 確認URL
Google翻訳(ツールバー版) × url
Google翻訳(ウェブサービス版) url
Yahoo!JAPAN翻訳 url
Microsoft Translator(Bing翻訳) url
weblioウェブページ翻訳 × url
exite!翻訳 × url

対応しているツールが3つあるなら十分という感じがする。translate属性の入れ子も問題なさそう。Google翻訳がブラウザ搭載のツールバーでは対応していないのがなんだかアレだが……。

ツールごとにクオーテーションで囲まれていたら翻訳しないとか、<>で囲まれていたら翻訳しないなどの独自の判定基準を設けているものもあるようだ。また、対応しているツールはtranslate属性が何の要素に指定されているかは特に関係なく機能している。

翻訳の可否の是非

しかし、翻訳の可否は著者が決めるものなのだろうか。何を翻訳したいかは閲覧者が決めるものだと思っている。同じページでも翻訳したい範囲は目的によっても異なるからだ。プログラミングであればコード部分は翻訳はいらないかもしれないが、コードのコメント部分で英語をチョット勉強したいと思った時、その限りではなくなる。そうするとtranslate属性の指定で翻訳機能に制限をかけるのは、ウェブサイト著者の傲慢にもなり得る気がする。

ページ全文を翻訳にかけるようなツールではそういうニーズは満たせない。ブラウザの拡張機能で局所的に翻訳のオンオフを指定できるような仕組みに頼らざるを得ないだろう。単語単位で翻訳するものはChromeにあるが、段落単位・選択範囲単位で翻訳オンオフできるものはあるのだろうか。あったとしても全員がそれを使っているわけではないだろうし。

この記事を書いている時、過去のエントリーのcode要素にすべてtranslate="no"を追加しようと思ったけど、この理由でやめることにした。