« Wakwak、 「Outbound Port25 Blocking」を開始! | トップページ | PostgreSQL 8.0がリリース - Windowsに正式対応 »

2005/01/09

Mac版IE+ココログのコメント・文字化け

別のことを調べていて、思わぬ見っけものを見つけることがあります。今回のもそれです。Macで韓国語をコピー&ペーストすると文字化けすることがあるという件を調べていましたら(これも理由は分かりましたが、いつか時間ができたらまとめます。)、このココログの記事に対するコメント欄(textarea内)にMac版IE(5.2.3)で書き込もうとすると、左のように文字化けすることがあることが分かりました。

(私の環境でのOS9+IE5.17やOS9+IE5.0では文字化けは発生しませんでした。しかし、これはデフォルトでそうなのか、それとも私が記憶にないだけで、いつだったか設定を自分で変更していて、文字化けが発生しないのかは不明です。とにかく、MacOSX 10.3.7+ Mac版IE5.2.3では文字化けが発生していました。)

なぜ、ココログでのみ発生するのでしょうか? 他の掲示板などへの書き込みなどでは発生しません。実は、「ココログの文字コードはUTF-8である」ことが大きく関係しています。文字化けしていない掲示板ではShift_JISやEUC-JPであったために文字化けしていなかったのです。逆に言えば、ココログに限らず、UTF-8で書かれたサイトでは、Mac版IEではtextarea内に入力した文字が文字化けすることがあるわけです。

Click Here! ただし、UTF-8だったらすべて文字化けするというわけでなく、textarea内で利用されるフォントをスタイルシートで指定している場合には文字化けしません。実際、ココログのライバルであるエキサイトブログでは、Mac版IEで入力しても文字化けしません。Osakaフォントをスタイルシート内で明示的に指定しているからです。

ココログでは、なぜこの対策が取られていないかは不明ですが、もちろんココログでもBLOGを作成している人間(私たちのような立場)で対応は可能です。まず、自作スタイルシートをココログで利用する方法を

●詞織: 自作スタイルシートの適用
http://siolli.cocolog-nifty.com/blog/2003/12/post_1.html
を読んで、

ココログ管理ページにログインしたあと「ウェブログ>設定>ウェブログ/サブタイトル名称変更」のページにある「ウェブログのサブタイトル(キャッチフレーズ)」のテキストエリア

に、スタイルシートへのパスを書いた<link rel="stylesheet" type="text/css" href="スタイルシートのURL">を書けば良いと分かりました。結果的に生成されるタグは、
<h2>Linuxに限りませんが、(中略)検索しまくっています。<link rel="stylesheet" type="text/css" href="http://www.webfaq.jp/cocolog.css"></h2>」のようになりました。つまり、「<h2>」と「</h2>」の間にスタイルシートをサンドイッチさせているわけです。HTML文法的には問題があるようですが、これでリンクの上にマウスが乗っかったときに色を変えたり(hover)することもできましたし、まあいいかと思っています。

さらに、今回、テキストエリア内のフォントをMacではOsakaフォントが適用されるように、スタイルシート内に

textarea{
font-family:Osaka,Verdana,Arial;
}

と書きました。現在は対策済みですので、私のサイト内では、Mac版IEでもコメント入力欄が上記画像のような文字化けが発生することはないと思います。こちらに現象確認用のページを作成しましたので、Mac版IEの方はテストしてみてください。

● BLOG質問箱: Mac IEによるコメントの文字化け
http://www.mylog.jp/blogs/q-box/archives/001330.html

にも、同様な解法が紹介されています。また、多数のtrackbackが貼られているところを見ると、この問題はかなりみなさんを悩ませてきた問題であることが分かります。

では、そもそも、この問題はなぜ起こるのでしょうか? ココログの責任でしょうか? いいえ、そのようなことはありません。これは基本的にはMac版IEの問題です。


Mac版IEでは、上の画像のような画面でフォント設定が可能なようになっています(上の画像はIE5.2.3)。5.2.3の場合、メニューの「Explorer」→「環境設定」で「言語/フォント」で設定でこの画面が表示されます。ここで、赤色でしるしをつけた部分はプルダウンになっています。「日本語(自動選択)」がこの画面では設定されていますが、プルダウンを動かすと、一番下に「ユニバーサル文字(UTF-8)」というのがあります。その他、Mac版IE5.2.3には「日本語(JIS)」「日本語(シフトJIS)」「日本語(EUC)」も個別にフォントが設定可能になっています。

Windows版IEでは、メニューの「ツール」→「インターネットオプション」→「全般タブ」→「フォント」でフォントの設定が可能ですが、日本語・韓国語・・・・とあるだけで、Macのように日本語の中でさらに細分化されて文字コードを設定するようなやり方にはなっていません。なぜ、Mac版IEでこのようになっているかは不明です。Macだと、やろうと思えば、EUC-JPで作成されたページと、Shift_JISで作成されたページとでフォントを分けることが可能なのだと思います(試していません。また、スタイルシートなどでフォントが設定されている場合には、ブラウザで設定したフォントどおりには表示されないことがあります)。

話を元に戻します。Mac版IE5.2.3の「日本語(JIS)」「日本語(シフトJIS)」「日本語(EUC)」の設定画面を見てみると、Osakaフォントなどが設定されており確かに問題はありませんが、日本語を表記できる文字コードはこの3種類だけではありません。多言語の混在が可能なUTF-8でも日本語を扱うことができます。そして、このココログではUTF-8を採用しています。ですから、この「ユニバーサル文字(UTF-8)」がMac版IE(5.2.3)でのココログの見え方の基本を決定してしまうわけです。

この「ユニバーサル文字(UTF-8)」の設定画面でデフォルトでは英文フォントが指定されてしまっていることがtextarea内で文字化けする原因です。(これはMac版IEを製作したマイクロソフトの責任だと思います、多分。)Osakaフォントや「ヒラギノ明朝Pro W6」など日本語の表示が可能なフォントを設定してあげれば文字化けは解消するはずです。

ただ、Macユーザー全員に設定をわざわざ変えてもらうのも大変な話なので、ホームページ製作者やBLOGGERの方でスタイルシートなどでフォント設定しておくのが親切ですね。ココログでの自作スタイルシートの設定方法は上述しました。

なお、この日本語フォントの設定に関しては、

●ぞうさんちv2: Mac版IEのコメント欄の文字化け解消法
ぞうさんちv2: Mac版IEのコメント欄の文字化け解消法

を参考にさせてもらいました。

|

« Wakwak、 「Outbound Port25 Blocking」を開始! | トップページ | PostgreSQL 8.0がリリース - Windowsに正式対応 »

コメント

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/67411/2522403

この記事へのトラックバック一覧です: Mac版IE+ココログのコメント・文字化け:

» MacIE文字化け続き [takech net]
文字コードがUTF-8だと、MacIEのtextarea内では文字化けするとゆう事が判明。 (MacOSX 10.3.7+ Mac版IE5.2.3で確認されてい... [続きを読む]

受信: 2005/02/26 09:57

» ゴメンよ、OS9+IEの人w [Waka di sini]
スタイルシートを1度消してしまうと、ついつい忘れてしまうんですよ、OS9+IEの... [続きを読む]

受信: 2005/06/10 14:33

» MacIE5でTextAreaが文字化け [TOTOLOG]
状況 先日某所経由で教えて頂いたのですが、特定の条件でコメント欄(textar... [続きを読む]

受信: 2005/06/15 11:01

» 男前か [***mitosismix***]
いつのまにか、OSX+ie5でレイアウトが崩れてた。safariとfirefox... [続きを読む]

受信: 2005/08/26 23:32

» 仮移転とりあえずスタート [でんでんはうす・たれながし感想日記]
■とりあえず一通り設定と動作確認を終了しました。 あと1週間ほど元々の「さるさる [続きを読む]

受信: 2006/02/19 21:55

» 「Mac版IE5.2でselectが非表示になる。textareaが文字化けする」の回避方法 [OPQR.jp : WebサービスとWebデザインについて考えてみる;]
文字コードをShift_JISからUTF-8に変更したら、Mac版IE5.2でs... [続きを読む]

受信: 2007/08/07 20:52

« Wakwak、 「Outbound Port25 Blocking」を開始! | トップページ | PostgreSQL 8.0がリリース - Windowsに正式対応 »