Works

中国語サイトの作り方&書体のお話。

(上は中国最大のポータルサイトsina

ひょんなことで、中国語サイト製作のご依頼がございました。
単に中国語を流せばいいんじゃね?と思われるかもしれませんが、サイトを作成する際は、最初にちゃんと「言語の宣言」をしないといけません。この言語宣言で注意する項目は2つあります。

language宣言

「lang=“zh”」
これが中国語ページを作る際の最初の宣言。全文を書くと、
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh" xml:lang="zh">
のようになる。
日本語も混在させる場合は「lang=“ja,zh”」にすればよい。

ちなみに韓国語サイトなら「lang=“ko”」。

metaタグ指定

繁体字中国語は「big5」。
簡体字中国語は「gb2312」。
多言語用は「utf-8」。
全文を書くと、
<meta http-equiv=“Content-Type” content="text/html; charset=●●●” />
のようになり、「●●●」内に上部の文字を入れれば良い。

今回は「簡体字」での指定でしたが、どちらかに振るよりも、今はもう広く使われている「utf-8」がやはり確実ですね。日本向けのサイトにおいてもこれを使っておけばまず間違いないです。韓国語サイトもこれでOK。

上の2点を決めたら、あとはバババっと流し込めばよい。
もちろん、全くひとっつも読めないので文字校正は一切できませんが。
ちなみに、実は僕の第2外国語は中国語だったりする。が、ホントにひとっつも覚えちゃいない(笑)。こんなもんだ。

【11.28 追記】
上の2点だけだといまいち文字が美しくならなかったので、font-familyに「SimSun」「Arial」「Arial UnicodeMS」の3つを追加。

※最近は減りましたが、ウェブサイトを見ていてたまに文字化けを起こすサイトがあります。そのサイトのほとんどはこの「言語宣言」をされずに作られているからなんですね。見る方が悪いのではありませんのでご安心を。

※また、iPhoneが日本に来た際、既存のガラケーとのメールなどでよく文字化けを起こしていました。これは、説明するとものすごく複雑なので割愛しますが、簡単にいうとiPhoneがグローバルな「utf-8」を用いているのに対して、日本はまだ独自の「shift-jis」を使っていた(shift-jisしか読めなかった)のが原因です。

 

平行して、同クライアントさまの広告も作成。
中国語書体など全く持ってませんが、最初からこんなに入っているMacはやっぱりすごいと思う。世界が急速に近づいたのが実感できますね。ただ、プロとして気をつけたい部分はやっぱり書体選びからです。

日本語で言うと、印刷用でない、例えばWindowsに元から入っている書体を使ったり、「いかにもWindowsで作りました」という広告物は、どう作っても安っぽく見えるわけです。それほど書体がもたらす全体の印象は大きい。

この辺のCI(コーポレートアイデンティティ)がしっかりとなされている企業は、必ず使わなければいけない書体があったりします。つまり、その書体を使うことで企業のイメージがブレないように細心の注意を払っているのだ。これが企業の大きさの目安になったりして、そうでない企業の場合、得てしてころころと変わる。だからブレる。

一例として、docomoは和文に「ヒラギノ」、英文に「Frutiger」を必ず用いる。KDDIであれば和文は「モリサワ新ゴ」、英文は、、、忘れた。これらは以前ショップサインボードを作成した際に代理店から強く言われた注意点です。CIマニュアルはdocomoで約80ページありました。大きな企業のぶれないブランド力の根幹はここにあるわけですね。

ちなみに上の和文2書体は、今のスマホの標準書体でもあり、iPhoneはヒラギノ、Androidは新ゴが採用されている。

話がかなり脱線してますが、いったい何が言いたいかというと、中国語は全く見慣れていない言語なので、これだけあっても「どれが垢抜けてて、どれがダサいのか」全く判断できないのだ。唯一救われているのは、とりあえず漢字、ってこと。「じゃ、ヒラギノ使えば?」って思われるかもしれないが、日本では使われてない漢字のオンパレードで、到底太刀打ちできない(東京→东京、など)。

よく外国などで見る日本語は、「意味もおかしいけど、それ以前に文字が変じゃね?」ということに多く出くわすのは、業界標準の書体を知らないか持っていないかであり、それ以前に見慣れてない文字なのでどれが美しいか否かの判断ができないからです。

今回、そうならなければ良いのですが。。。

ちなみに、ハングル書体の業界標準はこちら(らしい)。



にほんブログ村 スマホ・携帯ブログへ にほんブログ村 PC家電ブログ Macへ にほんブログ村 スマホ・携帯ブログ iPhoneへ

Works