人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

文字コードについての質問です。
サイトの一部にMovableTypeを利用しているため、文字コードをUTF-8で制作、メインツールにDreamweaverMXを使用、出来たcssファイルをアップ後W3C CSS検証サービスにかけると、文書解析エラーが出ます。このcssファイルをezhtmlで開くと、「@charset "utf-8";」が「?@charset "utf-8";」となっていました。Dreamweaver上では、「?」は見えなかったのですが…。秀丸で開いても「?」は見えず、また、秀丸を使ってcssファイルを作り直してもやはりエラーが出てしまい、ezhtmlで見るとやはり「?@charset "utf-8";」となっていました。
「?」を削除して再度アップ、検証をかけると文書解析エラーは消えますが、font-familyの日本語指定部分が「????」等に文字化けした検証結果が出ています。

そもそも、どうしてこのようなことが起こるのか、この文字化けした日本語指定部分を正しく表示させる方法はあるのか、もっとよい制作方法はあるのか、知りたいです。よろしくお願いいたします。

●質問者: graphico
●カテゴリ:インターネット ウェブ制作
✍キーワード:CSS Dreamweaver MovableType UTF-8 W3C
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● hamster009
●0ポイント

そのDreamなんたらを捨てたらどうでしょう。http://end


2 ● chankaz
●65ポイント

「@charset "utf-8";」が「?@charset "utf-8";」となっていました。

「?」はおそらく、BOM (Byte Order Mark) ではないかと。

普通のエディタでは見えませんが、バイナリエディタで表示させればわかります。(ファイルの先頭に「 EF BB BF 」があれば、それがBOMです)


もし「?」がBOMなら、BOMなしで保存(「utf-8N」で保存する)すれば消えます。


font-familyの日本語指定部分が「????」等に文字化け

CSSファイル内の日本語の文字列は文字参照に変換しておいた方が安全です。

http://hxxk.jp/2005/02/07/0132

http://www.eris.ais.ne.jp/~hiro/css/ref

◎質問者からの返答

ご回答、ありがとうございました!

ご指摘の通り、BOMでした。バイナリエディタで表示させたところ、「 EF BB BF 」がありました。削除したところ、文書解析エラーはなくなりました。

日本語指定部分についてですが、教えていただいたサイトを参考に文字参照に変換をしてみたのですが、どうもこちらはうまくいかず…例えば、

font-family: 'MS Pゴシック', …

font-family: '\ff2d\ff33\20\ff30\30b4\30b7\30c3\30af',

としてアップし直し再度検証サービスにかけてみたのですが、 そのまま表示されてしまいました。ただ、こういったことがあるとは知らなかったので、大変勉強になりました。


ブラウザ(Firefox)に、問題のあるcssファイルを直接突っ込んでみてチェックをすると、日本語の部分は問題なく表示されますし、同じくUTF-8で作られている他サイトのcssを検証サービスにかけてみても、やはり日本語部分(font-familyの指定部分)が「????」と表示されているので、こちら側の問題ではないのかもしれません。


もう少しいろいろ試してみますが、とりあえず文書解析エラーはなくなりましたので、終了とさせていただきます。


3 ● yusaku5963
●15ポイント

http://wakabano.cool.ne.jp/dream/setting/set_21.html

EZwebは文字コードがShift_JISなので。

◎質問者からの返答

ご回答、ありがとうございました。

「EZweb」は、もしかして私の質問文中の「ezhtml」のことでしょうか??

参照サイトのやり方のように、環境設定でUTF-8には設定しているのですが、どうもそのままではBOMがついてしまうようです。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ