UTF-8で作成されたHTMLを表示させると、文字の字体がおかしい
まだ、原因を追及中ですが、インターネットで検索しても、それらしいものが引っかからないので、お知らせしておきます。『MS ゴシック & MS 明朝 JIS2004 対応フォント(KB927489)をインストールするとUTF-8のホームページで字体がおかしくなる現象』をご覧下さい。
先日お客様のところにNEC社ノートパソコンVersa Pro(PC-VY16AEDJMFL1、WindowsXP SP2)を2台ほど納品しました。その後、インターネットエクスプローラ(IE6 SP1)にて、あるページを表示すると、文字の字体が他のパソコンと違い、おかしいとの報告が来ました。
原因を調査し、どういった環境でこの現象が起こるかまで突き止めましたが、機種に依存する問題なのか、追加で導入したアプリケーションのせいなのかまでは、絞り込めていません。
PCをHDDリカバリーすれば、切り分けできるのですが、すでに納品したものですので、そこまで思い切ったこともできません。
ちなみに追加で導入したアプリケーションは、以下のものです。
- ノートPCに付属のWinDVD
- 富士通ScanSnapドライバー、付属ソフト
- Adobe Acrobat8スタンダード
- ウィルスバスター2007
- Microsoft Office 2003 パーソナル(プリインストール版)
- 画像ソフト ViX
- 圧縮解凍ソフト lhaplus
- Visual Basic 6 SP6 ランタイム
- googleツールバー
- flashプレイヤー
- Shockwaveプレイヤー
- プリンタ用ドライバー
2007年11月5日追記
Windows XP professional x64 SP2 OEM版をインストールしたHP社 ML115でも同様な現象が発生しました。
Mozilla Firefoxで表示すると正常です。IEのレンダリングエンジンを使用しているSleipnirなどでは、UTF-8の字体がおかしくなりました。IE6の固有問題ということまで特定できました。
では、具体的にどんな状況にておかしな字体が表示されるかを説明します。
まず、HTMLドキュメントを文字コードUTF-8にて作成します。適当な文章を入力して、スタイルシートにて、フォントの字体を「MS P明朝」にします。
そのHTMLドキュメントをIE6にて表示すると、通常ですと明朝体で表示されるのですが、見たこともない変な字体になるのです。
下2枚のうち左が、Shift_JISで作成して表示したものです。これは正常な字体です。右がUTF-8で作成したものです。
HTMLドキュメントは、このような指定になっています。
<style type="text/css">
<!--
.style1 {font-family: "MS Pゴシック"}
.style2 {font-family: "MS UI Gothic"}
.style3 {font-family: "MS ゴシック"}
.style4 {font-family: "MS 明朝"}
.style5 {font-family: "MS P明朝"}
-->
</style>
~省略~
<p>テストあいうえおかきくけこ 関数無効可変属性内側横広引数発生実行</p>
<p class="style1">テストあいうえおかきくけこ 関数無効可変属性内側横広引数発生実行</p>
<p class="style2">テストあいうえおかきくけこ 関数無効可変属性内側横広引数発生実行</p>
<p class="style3">テストあいうえおかきくけこ 関数無効可変属性内側横広引数発生実行</p>
<p class="style4">テストあいうえおかきくけこ 関数無効可変属性内側横広引数発生実行</p>
<p class="style5">テストあいうえおかきくけこ 関数無効可変属性内側横広引数発生実行</p>
<p>テストあいうえおかきくけこ 関数無効可変属性内側横広引数発生実行</p>
<p>テストあいうえおかきくけこ 関数無効可変属性内側横広引数発生実行</p>
スタイルにfont-familyを指定すると、意図した字体ではなくなることが分かります。たとえば、「MS Pゴシック」にすると、なぜかMS UIゴシックで表示されてしまいます。
EUCコードでどうなるかまでは追求していませんが、どんな結果になるのでしょうか。
EUCコードでは、正常に表示されました。UTF-16コードも文字の字体がおかしくなります。
●サンプル
- Shift_JISで作成したHTMLドキュメント
- UTF-8で作成したHTMLドキュメント
- EUC_JPで作成したHTMLドキュメント
- UTF-16で作成したHTMLドキュメント
- GB2312(簡字体)で作成したHTMLドキュメント
サンプルをクリックしてみて同じような現象がでる方があれば、ぜひコメントお願いします。
IT工房にんにく庵関連ページ
・ トラブル対応