- ベストアンサー
hpDrafteのHTMLファイルが文字化けするor Macのフリーエディタ
- hpDrafteで作成したHTMLファイルが文字化けしてしまう問題があります。Firefoxでは文字化けするが、safariでは正常に表示されます。
- Macのフリーエディタはいくつか試しましたが、使いやすさとFirefoxの互換性を兼ね備えたものが見つかりません。
- 他のエディタを探すか、プレビュー機能やタグ入力支援などの機能を備えたフリーエディタを探しています。
- みんなの回答 (4)
- 専門家の回答
質問者が選んだベストアンサー
> Firefoxの環境設定はほとんど触っていないです。 >初期設定でFirefox使ってるほとんどの人が(私が)hpDrafteで作成したファイルが見れないというのは困るので >FirefoxとhpDrafteの両立は諦めることにします。 変えるのは、Firefoxの設定ではなく、hpDrafterの設定です。 まず、環境設定の「動作」のエンコードを使いたいものにします。 →検証していただいた結果から、現在は「日本語(JIS)」になっていると思います。 JIS = ISO-2022-JPです。Shift_JISではありません。 Shift_JISは「日本語(SJIS)」です。 次に、テンプレートの <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> のShift_JISの部分を上で設定した文字コードに変えます。 日本語(SJIS)→Shift_JIS <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> 日本語(EUC)→EUC-JP <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP"> 日本語(JIS)→ISO-2022-JP <meta http-equiv="Content-Type" content="text/html; charset=ISO-2022-JP"> ユニコード(UTF-8)→UTF-8 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 他に、htmlチェッカのオプション「-w short」を消して、エラーチェックをかけてみてください。 >9: 指定されている文字コードセットは `Shift_JIS` ですが、実際のコードは JIS のようです。 というようなエラーメッセージが出てくるようになると思います。
その他の回答 (3)
- kmee
- ベストアンサー率55% (1857/3366)
実験ファイル <html> <head> <meta http-equiv="Content-Type" Content="text/html;charset=shift_jis"> <title>Test</title> </head> <body> <p>正しい日本語</p> </body> </html> 日本語自動判別でSafari,Firefoxで表示 ・Shift_JISで保存 →Safari,FirefoxともにOK ・metaタグをcharset=ISO-2022-JPに →Safari OK →Firefox 文字化け(文字エンコードはISO-2022-JPに) ・ISO 2022-JPで保存 →Safari,FirefoxともにOK ・metaタグをcharset=Shift_JISに →Safari OK →Firefox 文字化け(文字エンコードはShift_JISに) ・metaタグを削除 →Safari,FirefoxともにOK ということで、 ・Safariはmeta http-equiv="Content-Type での指定によらず、ファイルで使われているコードから判別 ・Firefoxはmeta http-equiv="Content-Type"にcharsetが指定してあれば、それを優先する その他の状況から ・元々、ファイルはISO-2022-JPだった ・それにmeta http-equiv="Content-Type" でShift_JISと指定してあったために、Firefoxでは文字化けした と考えられます。 対策は、 ・実際のファイルのエンコードと、meta http-equiv="Content-Type"のcharsetを一致させる。 ・あるいは、 meta http-equiv="Content-Type"を指定しない です。
お礼
>・実際のファイルのエンコードと、meta http-equiv="Content-Type"のcharsetを一致させる。 >・あるいは、 meta http-equiv="Content-Type"を指定しない 試してみましたが駄目でした… Firefoxの環境設定はほとんど触っていないです。 初期設定でFirefox使ってるほとんどの人が(私が)hpDrafteで作成したファイルが見れないというのは困るので FirefoxとhpDrafteの両立は諦めることにします。
- kmee
- ベストアンサー率55% (1857/3366)
そうですねぇ。 あと確認するべきことと言ったら ・Safariの[表示]>[テキストエンコーディング]はどうなっているか(何処にチェックが付いているか)?変えるとどうなるか? ・Firefoxの[表示]>[文字エンコーディング]はどうなっているか(何処にチェックが付いているか)?[自動判定]はどうなっているか(何処にチェックが付いているか)?変えるとどうなるか? ・Safariの[表示]>[ソースを表示]でhtmlファイルを見たらどうなっているか?headの中に<meta http-equiv="Content-Type~はあるか?あるなら位置が正しいか? ・Firefoxの[表示]>[ページのソース]で以下同じ ・上の条件がhpDrafterでの文字コードと一致するかどうか? ・[Safari]>[環境設定]の「表示」のフォントと「デフォルトのエンコーディング」は? ・[Firefox]>[環境設定]の「コンテンツ」の「フォントとカラー」の「詳細設定...」で、対象「日本語」のフォントと「デフォルト文字エンコーディング」は? ・htmlファイルを他のテキストエディタ(mi(http://mimikaki.net/)等)で開いたときの文字コードは? とりあえず、これくらい調べれば、なにかしらの原因が掴めるかもしれません。 hpDrafterはSafariでも使われているWebkitを使っているそうなので、Safariとの相性は確かによさそうです。
補足
引き続きありがとうございます。 自分ではどこを見ばいいのか分からないのでチェック項目助かります。 ・Safariの[表示]>[テキストエンコーディング]はどうなっているか(何処にチェックが付いているか)?変えるとどうなるか? デフォルト。変えるとFirefoxと同じ文字化けになりますが日本語(ISO-2022-JP)は正常に表示されます。 ・Firefoxの[表示]>[文字エンコーディング]はどうなっているか(何処にチェックが付いているか)?[自動判定]はどうなっているか(何処にチェックが付いているか)?変えるとどうなるか? 日本語(Shift JIS)。自動判定は日本語。日本語(ISO-2022-JP)に変更すると正常に表示されました ・Safariの[表示]>[ソースを表示]でhtmlファイルを見たらどうなっているか?headの中に<meta http-equiv="Content-Type~はあるか?あるなら位置が正しいか? 正常に表示されます。metaタグも正しいです。 ・Firefoxの[表示]>[ページのソース]で以下同じ タグ以外全て文字化けしています( $B%j%s%/%F%9%H (Bのような感じです)metaタグは正しいです。 ・上の条件がhpDrafterでの文字コードと一致するかどうか? 日本語(Shift JIS)はありますが日本語(ISO-2022-JP)はありませんでした。 ・[Safari]>[環境設定]の「表示」のフォントと「デフォルトのエンコーディング」は? 標準フォントTimes16 等倍フォントCourier13 デフォルトのエンコーディング 日本語(Shift JIS) ・[Firefox]>[環境設定]の「コンテンツ」の「フォントとカラー」の「詳細設定...」で、対象「日本語」のフォントと「デフォルト文字エンコーディング」は? プロポーショナル ゴシック体(Sans-serif) 明朝体(Serif) ヒラギノ明朝 Pro ゴシック体(Sans-serif) Osaka-等幅 等幅(Monospace) Osaka-等幅 デフォルト文字エンコーディング 日本語(Shift JIS) ・htmlファイルを他のテキストエディタ(mi( http://mimikaki.net/) 等)で開いたときの文字コードは? Shift_JIS 開いた時点で文字化けしていました。 ISO-2022-JPに変更しても文字化けしたままでしたが、文字コードを変えて保存してもう一度開くと正常に表示され、アップロードするとFirefoxでも正常に表示されました。 miで編集したファイルが正常にアップロードされたことに驚きました。 やはりhpDrafterとの相性に問題があるのでしょうか…。
- kmee
- ベストアンサー率55% (1857/3366)
文字化けは、おそらく、文字コードの誤判定でしょう。 <head>の中にmetaタグで文字コードを指定すれば直るかもしれません。 例) Shift JISの場合 <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> すでにあるのなら、その指定内容、位置等が間違っているのでしょう。 http://www.htmq.com/html/meta.shtml
補足
文字コードは指定しています。情報の後出しで申し訳ないです。 以前はWindowsのメモ帳を使ってファイルを作成していました。 今とタグの内容は変わっていませんが、今まではこんなことありませんでした。 最近Macに変えて、hpDrafteも使い始めたばかりで文字化けする仕組みが分かりません。 hpDrafteのプレビューでは正常に表示されるのにFirefoxで見た場合に文字化けしてしまいます。 Windows時代に作ったファイルをhpDrafteで開くとすでに文字化けしています。 英語の文章は無事なようです。
お礼
>JIS = ISO-2022-JPです。Shift_JISではありません。 >Shift_JISは「日本語(SJIS)」です。 ご指摘通りの勘違いをしていました;; なかなか把握できなくて申し訳ないです。 kmeeさんがここまで付き合ってくださったお陰で解決しました。 FirefoxとhpDrafteの両立を諦めずに済んでよかったです。 ありがとうございます!