blog - みきまるしぇ

　日本語から外国語への機械翻訳全般に言えることだとは思いますが、自分がある程度の自信を持って事例を確認できるのは日本語から英語訳のみですので、その範囲で書いてみます。

　無料の機械翻訳がネットで提供されていますが、日本語のウェブページ文章でそれらのサービスを使うのは、まだまだおすすめできないのが現状。もしお店の紹介などできちんとした外国語訳が必要であれば、心得のある人もしくはプロに頼んだほうがよいです。

　機械翻訳で比較的無難なのは、ウェブサイト内のメニューに使う短めの英語などですね。連絡先、メールアドレス、所在地、営業時間などの簡単な見出しが英語になっているだけでも、だいぶよいかと思います。

　なぜ機械翻訳がいまひとつかというと、日本語は文字種が多く句読点の法則が比較的自由である（といいますか人間が読む場合は相手の意図を想像できる）ため、機械はどれだけ例文をたくさん読み込んで学習しても、やはりまだ理解と処理が追いつかないのでしょう。

　わたしが2018年10月7日に書いた日本語文章を機械的に英訳してみました。

　原文は、こうです。
＝＝＝＝＝
梨があまってしまったら
　お彼岸ころに買った梨が、まだありました。さすがに少し表面の皮も弱くなり、もしかしたら甘味もあまりないかなと、ひと工夫してみることに。
＝＝＝＝＝

1)まずはWeblioの翻訳
＝＝＝＝＝
　If a pear remains
It was about time when it, and there was still the pear which I bought on the equinoctial week. In what I devise when the indeed slightly surface skin becomes weak, and possibly you do not have much sweetness.
＝＝＝＝＝

　見出しの「あまってしまったら」は、他社サービスよりは、本文のニュアンスに近いです。2行目の、彼岸のころに買った梨は訳せていますが、それ以外は意味が不明。最後の行も、単語をひとつずつ訳そうとしていますが誤解もあり、文章全体としては意味をなしていません。

　2)つづいて、Googleの翻訳
＝＝＝＝＝
If pears get caught
There were still pears that I bought around the time. Indeed it seems to be a little devilishly that the skin of the surface will be weak a little, and maybe there is not much sweetness. 
＝＝＝＝＝
　見出しは「梨が捕まったら」…？　お彼岸がわからないので、飛ばしたようです。Googleは自分がわからない場所はすぐ飛ばしますので注意してください。つづく行の前半は意味がわかりませんが、最後の「梨に甘さはないかも」部分は、わかってもらえたようです。

　3)最後に、Bingの翻訳
＝＝＝＝＝
If so PEAR
PEAR advantage when I bought there. To give a nice twist indeed weaken a little surface skin, maybe not too much sweetness and.
＝＝＝＝＝
　これは、ちょっと、よいところが見つかりません。意味がわからないです。ただしBingの名誉のために書いておきますと、分野や原文の種類によっては、他社サービスより自然な英語を出してくれることもあります。相性の問題が大きいのでしょう。

　全般的に、もしできるだけ機械翻訳にかけて自動的に訳してもらいたいということであれば（それでも、最後に英語がわかる人に見てもらってください）…
　ウェブページに載せている文章とは別に、丁寧で漢字が多い文章を用意して、機械翻訳に読ませる
…これに尽きると思います。

　たとえば、先ほどの原文をこうしてみることで、Google翻訳に関しては、かなりよくなります。
＝＝＝＝＝
梨が余ってしまったら

　お彼岸のころに買った梨が、まだ家にありました。さすがに古くなって表面の皮も張りがなくなりましたので、おそらく甘味もあまり残っていないかなと考えて、ひと工夫してみました。
＝＝＝＝＝

　Weblioも、最後の「ひと工夫」を間違えたままですが、それでも改善は見られ、Bingも、最初よりは、よくなりました。

　みなさんも、ぜひあれこれお試しください。発見があって楽しいですよ。

　 　

　作業手順を画面キャプチャしてみました。18枚あります。
（のちほど、1画面ずつ意味を説明する文章を書きますので、適宜ストップボタンを押しながらご覧ください）

　動画がうまく埋めこまれているかどうかの実験で、いったん公開しますが、説明の文章は25日夜に、書き足します。

（以下、書き足しました 2018.10.25 夜）　

　まず最初に…わたしの環境はMac OSで、使用しているPhotoshop Elementsは数年前のモデルです。また、モードをエキスパートにしているので、かならずしも同じ画面で作業している人ばかりでは、ないと思います。何らかのご参考になれば。

　画面上部のタイムスタンプを故意に削除せずにおきましたので「なるほど、15分もあればできるものなんだ」と、気楽にお考えください。
（途中で画面を離れるなどしたのでロスがありましたが、だいたい15分もあればできます）

今回のようなロゴ作成で、用意するもの

1.  フォント（パソコンにもともとインストールされているものや、ご自身で購入、または権利問題なしと確認できているもの）
2.  レイヤー処理ができる画像ソフト（多くのソフトで対応しています）

手順としましては

•  文字部分を作る。大きさや傾け方などの工夫の際にレイヤーを使用して、のちほど統合すると便利。
•  レイヤーを用意して、模様をつける。
•  最後に周囲の余白を切りとって、基礎部分の完成。

…という流れです。基礎部分ができましたら、それに色をつけたり加工をしたり、あるいは縮めてリンクボタンにしたりと、さまざまな工夫ができるようになります。

では、個々の画面の解説です。

画面1

• まず適当なサイズの無地画面を作り、テキスト入力メニューから、ロゴの一部を書きます。
• 当サイトの作成例として、Mikimarcheの M を書きました。
• 好きなフォントやサイズは、文字を選択した状態でフォントメニュー（画面下部）から選べます。

画面2

• レイヤーを作成するメニューから、新規に1枚を作成し、テキスト入力メニューでロゴ後半を入力します。
• 当サイトの作成例は Mikimarche の ikimarche 部分です。
• フォントは前半部分と同じ種類のものを選んでおけば無難でしょう。

画面3
第1のレイヤーで、前半部分を回転させたり、ひろげたり、好きなように動かします。（周囲をつまめば好きな形に変えられます）

画面4
第2のレイヤーで、後半部分を好きな位置に移動させます。

画面5
だいたいよいかなと思ったら、レイヤーをまとめます。

• もしここを何回かやり直すかもしれないと思ったら、画面4の段階で、レイヤーごと保存できる形式で保存してください。
• フォトショップ系であれば.psdという形式がそれにあたります。ほかのソフトでもレイヤーが保存できる形式があります。

画面6
効果のメニューから、文字をどう加工するかを選びます。ここはお好みで。

画面7
効果のメニューで選んだものを、設定画面から微調整できます。

画面8
微調整を確認しつつ、よいと思ったところでOKを押します。

画面9
次の作業のため、レイヤーを追加します。レイヤー追加は上のメニューバーから選べます。

画面10
新しいレイヤーを、いったんグラデーションで塗りつぶす準備です。
グラデーションのメニューを選び、流し入れる色合いを自分で設定します。お好きな色で。

画面11
色合いが決まったら、適当にぐりっと、画面上をカーソルでドラッグしてください。
わたしの場合は左斜め下から右上方向に、適当にやってみました。

画面12
グラデーションを模様で切り抜きします。
切り抜きメニューの中に、たくさん画像がはいっていますので（フォトショップでなくてもこういったものは、はいっていると思います）、選びます。

画像13
画面11とよく似ていますが、左下に、選んだ画像がご覧いただけると思います。
この状態で、適当な場所に（何度でも移動できますので、気にせずどこにでも）ぐりぐりっとカーソルをあて、ドラッグします。

画面14
洋梨の絵が出ました。場所が気に入らなければ、あるいは形がいまひとつなら、何度でもドラッグしなおしできます。

画面15
ここでまた、レイヤーをまとめます。
（やり直しがしたくなるかもと思ったら、レイヤーごと保存できる形式で、保存してください）

画面16

• そろそろ作業も終盤ですので、適当な大きさに切りましょう。
• このあたりかなと思う場所を長方形で選択します。
• 選択しながら画面に確認の数字が出ますので、好みのサイズが決まっている人はその数字を参考にしながら範囲選択

画面17
周囲を切り抜きます。

画面18
数字をきっかり好みに合わせておきたい人は、ここで合わせましょう。

作業はいったん、ここで終了です。

このままファイル保存することもできますし、その後、これを部品としてさらなる加工をしていくこともできます。

もし保存する場合、.jpg（ジェイペグ）形式ですと作業をしていた背景色（この場合は白）で背景が確定します。
.png（ピング）ですと、背景色を指定、あるいは背景を透明にして保存することもできます。

駆け足でしたが、今日のところは、以上です。
ご覧いただきありがとうございました。

　

　

　おもにパソコンなど画面の大きな環境でインターネットを利用していると、ウェブサイトを見にいったときに履歴やアドレスバーにアイコンが付いていることが、わかる場合があります。スマホやタブレットなどの画面ですと、そのときは気づかないのですが、ブックマークや履歴、よく見にいくサイト一覧で、サイトが名前ではなくアイコンで表示されているのがわかると思います。

　たとえば
Facebookならば、濃い青の背景に白のF  
ツイッターなら明るい青の背景に白い鳩
ですね。

（これらのファイル2点は、FacebookはWiki Commonsからのリンク表示、Twitterは正規のサイトからダウンロードしてきたものをそれぞれ16pxで表示しています）

　こういった仕組みで表示されるものを favicon (favorite icon お気に入りアイコンの略) と呼びます。日本語のカタカナでは、ファビコンです。これはもともとマイクロソフトのブラウザInternet Explorerからはじまったものだと聞いています。しばらくのあいだ、そして現在でも多くの人が、画像ファイルを作成する際に拡張子を .ico としたファイルを利用しています。

（この部分は無駄知識ですが、マイクロソフト系のOSでは拡張子が3文字で処理されてきましたので、.iconであればわかりやすかったところを最後のnをとって.icoとなっています。同様にウェブページの拡張子 ".html"も、マイクロソフト系の環境では.htmと長く表示されてきましたが、正式には最後にlがつくものでした）

　最近はで大きめファイルで作る事例も多いようなのですが、実はこれ、初期のころは律儀に16pixelの正方形で作られていました。その16pxというのは、インターネットでみなさんが日本語の文字をご覧になる場合は12ptというサイズで指定されているサイトが多いですが、これとほぼ同じです。日本語1文字分に画像を入れていたわけで、90年代末ころには、あまり高度な柄は入れられませんでした。

　その後、世の中のパソコンやさまざまな環境の変化で、大き目の正方形ファイルで作っても読める人が増えてきたため、いまでは96pxくらいで作る人もいれば、144pxなどの人もいます。大きく丁寧に作っても、読む人の環境に合わせて縮小表示がなされるので、大きなファイルのまま表示されるということではありません。ただ、大きくすれば相手のパケット代は増えますので、そのあたりの判断から、大きすぎないものを心がけると、よいのかもしれません。

　favicon用のファイルは伝統的には拡張子.icoのものでしたが、最近では、サイトのほうで独自に用意した.pngを使うと宣言してロボットにそれを読ませたり、アップル社のapple-touch-icon.pngを使用している例もあるようです。

　昔ながらの.icoファイルを用意するには、

• それ専用が可能なソフトをダウンロードして作成——これは、「アイコン作成ができるソフト」などの検索をすれば無料のものも見つかります。わたしは多機能の画像ソフトGIMP（読みはギンプ）というものを使っています。
• オンラインで作ってくれるサービスもあります。「ファビコン作成」などの検索をしましょう。
• 自分が.ico以外の形式で持っているアイコンを.icoに変換してくれるサービスもあります。「ファビコン変換」などで検索してみましょう。

　ちなみに当サイトでは、普段の画像作りはAdobe社のPhotoshop Elementsで、数年前のバージョンを使っています。これで画像を作って、ファビコンにする場合は、最後にGIMPで.ico変換しています。