Web翻訳者になろう

初級編第1回目

ウェブ翻訳の基礎知識

ウェブ翻訳というと、なにやらHTMLやJavaScriptとかいろいろ出てきて、コンピュータ用語が何だか難しそうと思われるかもしれません。しかし今やIT時代と呼ばれる世の中、インターネットのウェブサイトで使用されるファイルを翻訳する仕事も増えてきています。しかも、この分野はまだまだ人材不足気味。今からHTMLやJavaScriptを味方につけて、“e翻訳者”への道を目指しましょう。

【ウェブ翻訳の世界にようこそ】

 『eとらんす』読者のみなさん、こんにちは。今連載では、HTMLファイルなどインターネットのウェブサイトで使用されているファイルの翻訳を「ウェブ翻訳」と称し、具体的な翻訳テクニックについて初級、中級、上級と3段階のレベルに分けて解説していきます。初級編では、「パソコンを使って翻訳の仕事をしているが、ウェブ翻訳の経験、HTMLの知識はゼロ」という翻訳者を対象に基本的なHTMLファイル翻訳の取り組み方を解説していきます。中級、上級では、JavaScriptやASPなどウェブ上のプログラミング言語が含まれてきた場合の対処方法などを含め、高度なウェブ翻訳のノウハウを解説するほか、ウェブ翻訳に関連した最新翻訳テクノロジーの解説なども進めていく予定です。高レベルなウェブ翻訳の依頼が来ても、基本的な対処はできるような知識を身に付けるのがこの連載の狙いです。技術翻訳分野で需要が高いウェブ翻訳に挑戦し、“e翻訳者”を目指そうという方はぜひ最後までお付き合いください。初級編第1回目の今回は、翻訳以前にまずどのような知識と準備が必要かについて詳しく解説します。

【ウェブ翻訳には何が必要なの?】

 今連載では翻訳ツールを使用しないウェブ翻訳作業を前提とします。翻訳ツールはタグを隠してくれたりして便利な機能がありますが、ウェブ翻訳を根本からきちんと理解するにはファイルそのものを相手に取り組む必要があります。このため、特別な翻訳ツールは一切使用せず、Windowsであればメモ帳、MacであればSimpleTextなどシステムに最初から付いている簡易エディタを使用します。もちろん秀丸などの市販エディタを使っても構いませんし、Netscapeユーザーであれば、付属のComposerを利用するのも便利です。何を使うにしても、HTMLファイルそのものを見ながら理解するのがポイントです。実際のウェブ翻訳でパソコン作業の部分はWindowsでもMacでも基本的に同じです。複数環境と複数ブラウザをすべて解説しているとスペースが足りませんので、便宜上、Windows環境でIntemetExplorer5.5を利用するのをベースにします。Mac環境や他ブラウザに関しては特に注意が必要なときだけ説明を加えます。念のためですが、非Windows環境を軽視するつもりは一切ありませんので悪しからず(実際、我が家ではMacG3もLinuxマシンも稼動しております……)。

【ウェブファイルの正しい開き方】

 初級編では基本的なHTMLファイルの翻訳に的を絞りますので、今回はまず「ファイルを開いて訳を入れてみる」という基本作業をマスターしましよう。HTMLファイルというのは、ちょくちょく見ているウェブサイトで使用されているファイルのことで、ほとんどのウェブサイトはこのHTMLファイルで作られています。百聞は一見にしかず。まずはこのHTMLファイルの中身を見てみましょう。えっ? ブラウザを開けばよい? そうじやないんです。普段見慣れたウェブページですが、その“正体"のHTMLファイルはブラウザで見るものとはちょっと違うんです。

ステンプ1:フラウザでHTMLファイルを開く

普段使用しているウェブブラウザ(IntemetExplorerやNetscapeなど)を立ち上げてください。まずはバベルのサイトに行ってみましょう。URLの欄にhttp://www.babel.co.jp/とタイプしてEnterキーを押してください。図1のようにバベルのホームページが表示されましたよね。


図1 バベルホームページ(2003年1月14日現在のもの)

当然ですが、いろんな画像や様々な色、サイズの文字でホームページが飾られています。もちろんこれがHTMLファイルなのですが、実際のHTMLファイルの中身というのはこんなきらびやかなものではないのです。その「正体」を見るには、ブラウザの「ソースを表示する」という機能を使用します。

ステップ2:HTMLソースを表示する

InternetExplorerなら[表示]メニューから[ソース]という項目があります。「ソース」というのは「HTMLのソースコード」ということで、これがHTMLの“正体”を意味します。まずは選択してソースを表示させてみてください。


図2 HTMLソースを表示させたところ

Windowsであればメモ帳が自動的に開かれ、中にゴチャゴチャとコードが書かれたファイルが表示されるはずです。これがHTMLのソースコードです。まずは全体を眺めてみてください。めまいがしませんか? ウェブ翻訳をするということは、このファイルを相手にするということです。ところが、この中でHTMLのコードそのものに当たる部分は翻訳せず、実際のブラウザ上に現れる「翻訳対象テキスト」のみを翻訳していきます。いったいどうやって見分けるか?それを理解するのがこの連載の目的です。逆に、この翻訳対象テキストをきちんと見分けることができれば、完壁なウェブ翻訳者と言えるわけです。

ステップ3:HTMLファイルを保存する

HTMLファイルを翻訳する場合は、ファイルを自分のマシン上に保存しておく必要があります。ブラウザの上では内容を変更できない(となると翻訳もできない)ので、メモ帳やSimpleTextなどエディタで内容を変更できるように一時的にファイルを保存します。このHTMLファイルの保存ですが、ちょっとやっかいなのはブラウザや環境によってやり方が異なる点です。Windows環境でIEを利用している場合が最も簡単で、ソースファイルが自動的にメモ帳で開かれますので、そのままメモ帳から適当な名前を付けて保存します。初心者の方はとりあえずIEを利用するほうが無難でしょう。Netscapeユーザーの場合はエディタが直接立ち上がらないので、付属のComposerを使うのが便利です。ただし、Netscape4.7以前のバージョンと最新のNetscape6.0では多少使い方が異なりますので詳しいところは各人で研究してください。一方、Mac環境ですが、IEとNetscapeともにエディタは立ち上がりませんので、いずれの場合も、「ファイル」メニューから「別名で保存」を選択し、保存形式として「HTMLソース」を指定して保存するのが一番でしょう。また、保存する際のファイル名も、Windowsと同様に拡張子を入れ、「×××.html」のように保存しておいたほうが問題が少ないはずです。

 いずれにしても、ウェブ上で見つけたウェブページは、こういつた方法ですべて自分のマシンにHTMLファイルとして保存することができます。

【結局HTMLって何なの?】

 この段階でまず、「普段見ているウェブページの裏側にHTMLというコードが潜んでいて、どうやらそれがウェブページの“飾り付げ”に関係しているようだ」というところまでは理解してもらえたでしょうか。それでもまだ、HTMLって何なのかよくわからないという印象があるかもしれません。安心してください。これから極単純なHTMLコードを自分で書いてみます。きっとHTMLのさらなる正体が分かってくるはずです。

ステップ1:エディタでファイルを作成する

それでは、好きなエディタを開いて、“Please translate this text!”とだけタイプしてください。そしてそのファイルを保存します。繰り返しますが、保存するファイル名の後に、「.html」という拡張子を付け、「test.html」などとHTMLファイル名として保存してください。

ステップ2:ファイルを開いてみる

作ったファイルを実際にブラウザで開いてみましょう。以下のように表示されますよね。


図3 簡単なテキスト情報

入力した通り、“Please translate this text!”と表示されるだけです。ブラウザで表示されていますが、これってHTMLテキストなんでしょうか? それを確認するためにソース画面を開いて、中身を見てみましょう。ソースもやっぱりオリジナルの英文が入っているだけです。前に見たバベルのサイトのHTMLソースには<H1>とか<FORM>とかいろいろコードが入ってましたよね。ここで初めて説明しますが、この<>カッコで囲まれた部分のことを「タグ」と呼びます。HTMLコードというのはまさにこのタグのことを指します。今回作ったtest.htmlのファイルは、ファイル名としてはhtm1形式で保存して、ブラウザで表示させたのになぜ汐グが一切ないんでしょう……? 当たり前ですよね! タグを自分で入れていないからです(読者から殴られそう……)。

 では実際にタグとやらを入れてみて、何が違うのかを見てみます。先ほど作ったtest.htmlのソースを開けて、次のように文章を変えてください。

<b>Please translate this text!</b>


図4 変更後のテキスト

変更するのは、冒頭に<b>と入れるのと、終わりに</b>と入れる点だけです。この<b>というタグは後で説明しますので、ここでは何も考えないでください。変更したらそのまま保存し、そのファイルをブラウザで表示させてください。どうなりましたか?

テキストが太字で表示されていますよね。別にエディタでフォントを大きくしたわけではないのに、どうしてこうなるのでしょうか。それがまさにタグの“魔術”なのです。<b>というタグは、bold(太字)を指示するタグです。どこまでその太字で表示するかというストップサインが</b>です。タグの開始は<XXXX>で終わりは常にスラッシュ付きの</XXXX>。その開始タグと終了タグの間にはさまれたテキストが、指示の対象となります。タグの位置を変えてみたらそれがよく理解できます。次のようにしたらどう表示されるでしょうか。

Please translate<b>this</b>text!

今度はthisのところだけが太字になったことが分かるはずです。このように、どんなタグでも基本的な役割というのは、開始タグと終了タグの間にはさまれたテキストをどう表示するかという指示です。翻訳作業ではこれをどう解釈するかというと、「翻訳するテキストはすべてタグの間にある」ということです。ブラウザで見た通り、タグそのものは「指示情報」ですからブラウザ上では表示されません。特別な場合を除き、翻訳者にとってはタグの間のテキスト情報がすべてです。また、タグそのものの知識は本当に基本的なものだけ押さえておけば十分です。繰り返しになりますが、本初級編では、この翻訳対象テキストの見分け方に集中してHTMLを勉強していきます。

【ウェブ翻訳、最初の一歩】

 では非常にシンプルなHTMLファイルの翻訳に挑戦してみましょう。サンプルのファイルを開いてください。


図5 サンプルHTMLファイル

これを手順に沿って翻訳してみましょう。まずはソースの表示でしたね。図6のようにエディタにHTMLのソースコードを表示させられましたか?


図6 HTMLソースコード

表示ができたら自分のマシンの適当な場所に保存してください。Netscapeユーザーはソース表示をさせずに直接ファイルを保存してください。保存した後でエディタでファイルを開きます。

それではソースコードを詳しく見てみましょう。

<html>
くhead>
<title>Sample HTML file 1-1</title>
</head>
<h1>Company Information Menu</h1>
<ul>
<li>Employment Opportunities</li>
<li>Public Relations</li>
<li>Address</li>
</ul>
</body>
</html>

<>で囲まれたタグのコードに惑わされず、タグの間にはさまれたテキストだけに集中してください。また、タグの部分を一部でも消したりしないよう注意が必要です。実際のウェブページと比べるとどこを翻訳すればよいのか分かりますよね。ここでは便宜上、翻訳すべきテキストを太字で示してあります。翻訳例としては次のような感じでしょうか。

<html>
<head>
<title>サンプルHTMLファイル1-1</title>
</head>
<h1>会社情報メニュー</h1>
<ul>
<li>求人情報</li>
<li>広報</li>
<li>住所</li>
</ul>
</body>
</html>

翻訳が終了したらファイルを保存し、再びブラウザで表示させてみてください。図7のように表示されれば完了です。


図7 サンプルファイルの翻訳例

 タグの間にはさまれたテキストを翻訳する。これがウェフ翻訳の基本です。ただそれだけであればこんな簡単なことはないのですが、実際にはそう単純ではありません。例外があったり、タグ内にも翻訳テキストがあったり、スクリプトコードが入っていて、それが翻訳テキストを含んでいたりとか……。実際に上のHTMLコードでも例外がひとつあります。<title>サンプルHTMLファイル1-1</title〉という部分のテキストはいったいどこに表示されるか分かりますか? ウェブページの中にはありませんよね。そうです、これは文字通りタイトルなんです。<title〉というタグはウィンドウタイトルを示すもので、このタグ間にあるテキストはウェブページ内には表示されず、タイトルバーのみに表示されます。

 初級編第1回目の今回は、ウェブ翻訳の基礎部分にスポットを当てて解説を進めましたがいかがでしたか? サンプルファイルの翻訳ができれば第1回目はクリアです。ここで説明した基礎作業はこれからの土台になりますので、是非ともマスターしてください。次回はもう少し詳しくHTMLタグについて研究してみます。

 eとらんす 2001年 2月号より Copyright© 2003 Babel K.K. All Rights Reserved.

▲戻る