id:maimainet
ポイントあり200pt回答受付終了
ウェブ制作

UTF-8のHTMLファイルにShift-JISのHTMLファイルからソースの一部をコピペして保存したら、ブラウザ上は問題なく表示されるのですが、ソースの方は、コピペしたところだけでなく、ページ内の日本語を使っている部分全体が文字化けしてしまいました。charsetはUTF-8に設定しています。


①これを効率良く直す方法を教えてください。
②ソースだけが、しかもコピペした箇所だけでなく全体が文字化けする理由を教えてください。

①について、Shift-JISのHTMLファイルをまずUTF-8に変換してからコピペする、という方法で直るのかな？と思うのですが、また一からコピペし直すのが面倒なので、他にいい方法がないか探しています。

テキストエディタとしてはterapadとdreamweaverが手元にあります。
これらを活用した方法だと助かります。よろしくお願いします。

回答の条件
  • 1人5回まで
  • 登録：
  • 終了：2013/07/15 08:00:09
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。
id:maimainet

質問者から

maimainet2013/07/08 09:55:34

「ソースが文字化け」というのは、ブラウザを右クリックして出てくるメニュー（ソースを表示）のことです。Firefoxで見ると文字化けしますが、いま、IE9とchromeで見たら文字化けしてませんでした...。

HTMLファイル自体ももちろん文字化けしていません。

UTF-8にShift-JISをコピペしても特に問題ないものなんでしょうか？

でも、Firefoxで見たソースだけ文字化けしているのが気になります...

規約違反として通知

回答（5件）

id:Cherenkov No.1

回答回数1504ベストアンサー獲得回数493

ポイント40pt

元ファイルの文字コードを確認してください。
terapadで開いて右下の文字コード判定を見てみるとか。
shift_jisならばメニュー > ファイル > 文字/改行コード指定保存 utf-8nに変換
f:id:Cherenkov:20130708082744p:image

他1件のコメントを見る
id:maimainet

terapadの右下はUTF-8Nになってます。
念のため文字コード指定保存をし直してみても改善なしです。
「メニュー＞編集」というのがどこにあるか分からないんですが、firefox、IE、Chromeいずれもエンコード判定はUTF-8になっています。

>現在の状態は、shift_jisなHTMLだが

shift_jisからコピペした部分の方が圧倒的に少ないんですが、このようにshift_jisとUTF-8が混在した場合、どのように判定されるんでしょうか？？

2013/07/08 08:48:13
id:Cherenkov

そのURLか再現できるURLを貼ったほうが早いすね。
コメントでJULYさんが云っているサーバからのレスポンスヘッダのCentent-Typeが気になります。
以前Firefoxで Content-Type敏感問題 的なことを経験しました。

各ブラウザやソースビューアの文字コード判定がバラけてるんじゃないすかね。

2013/07/08 22:44:07
id:maimainet

質問者から

maimainet2013/07/08 11:36:59

Firefoxでソースを表示した時に、表示＞文字エンコーディングは「自動判別＞日本語」にしているのですが、自動で「日本語（Shift-JIS）」が選択されてしまって、文字化けしているようです。UTF-8にすれば文字化けは解消しますが、charsetもUTF-8に設定しているのに、なぜ自動判別でShift-JISが選択されるのかが分かりません。

規約違反として通知
id:dawakaki No.2

回答回数797ベストアンサー獲得回数122

ポイント40pt

HTML5なら以下のように書きます。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>なんとか</title>
</head>
<body>
...
</body>
</html>

他の場所にcharsetが紛れていないかどうか確認して下さい。
たとえば以下のようなmetaタグが紛れていませんか？

<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
id:maimainet

charset指定はUTF-8で一箇所のみで、shift-JISに関するコードは紛れていませんでした。

2013/07/08 12:24:06
id:MONO_Eraser No.3

回答回数13ベストアンサー獲得回数2

ポイント40pt

iPhoneのファイル(plistファイル)書き換えによく使っているのですが
下記のソフトを利用してUTF-8を表示させ

CopyBot.com
Download iPod software for Windows
plist Editor for Windows (Freeware)
(Platforms: Windows 7 (32/64-bit), Vista (32/64-bit), XP, 8)

全選択でコピーしてメモ帳にでも貼り付けたらどうでしょうか？

id:maimainet

ありがとうございました

2013/07/20 12:45:13
id:holoholobird No.4

回答回数574ベストアンサー獲得回数104

ポイント40pt

一度shift-jisで開いて、秀丸にコピーしたのちにurf-8に変換して貼り付けるのはどうでしょうか。

id:maimainet

Terapadで同じ事をやっていましたが、面倒臭いのと、改善ないのでここで質問しました。

2013/07/20 12:35:59
id:boost_beast No.5

回答回数785ベストアンサー獲得回数31

ポイント40pt

http://oshiete.goo.ne.jp/qa/2940513.html

こちらをみてみるのはどうでしょうか。

id:maimainet

参考になりました！

2013/07/20 12:37:17

コメント（9件)

  • id:rouge_2008
    rouge_2008 2013/07/08 08:26:00
    Firefoxでソースを表示したら、「表示」→「文字エンコーディング」で何が指定されているか確認してみてください。
    ※HTMLファイルをUTF-8で保存したのでしたら、「Unicode(UTF-8)」に設定すると正常に表示されると思います。
  • id:maimainet
    maimainet 2013/07/08 08:51:17
    確かに、「表示」→「文字エンコーディング」でUTF-8にすると文字化けは解消されました。
    これは、ソースそのものには特に問題がない→つまりUTF-8のファイルにShift-JISのファイルからコピペしても問題がなく、ただソースを表示するブラウザ側の問題、ということなんでしょうか？
  • id:rouge_2008
    rouge_2008 2013/07/08 09:34:25
    Firefoxのバージョンはいくつでしょう？
    通常はmetaタグで指定した文字コードで表示されているようです。
    ブラウザでの表示は問題ないという事ですので、どうやら違うようですが・・・

    ※HTMLソースの前半部分はどうなっていますか？
    良ければそのままコピー＆ペーストして教えてください。(ファイルの最初からheadの終了タグくらいまであればいいですが、長すぎる場合は文字コード設定とtitleタグまであればいいです。)
  • id:maimainet
    maimainet 2013/07/08 10:20:57
    Firefoxのバージョンは22.0です。HTMLソースは投稿できないのですが、さきほどもう一度新規でファイル作成を試してみたら、Shift-JISのファイルからUTF-8にコピペしても文字化けしませんでした。ただ、すでにアップしてるファイルを確認すると、やっぱりソースだけが文字化けしています。文字化けしたり、しなかったり...わけが分かりません。。

    ※はてな初心者なのでよく分からないのですが、コメントだとポイントを配分できなかったりするのでしょうか？よろしければ、ポイントを差し上げたいので、回答として投稿していただけると嬉しいです。
  • id:maimainet
    maimainet 2013/07/08 10:25:39
    補足を追加しました。

    ↓
    Firefoxでソースを表示した時に、表示＞文字エンコーディングは「自動判別＞日本語」にしているのですが、自動で「日本語（Shift-JIS）」が選択されてしまって、文字化けしているようです。UTF-8にすれば文字化けは解消しますが、charsetもUTF-8に設定しているのに、なぜ自動判別でShift-JISが選択されるのかが分かりません。
  • id:JULY
    JULY 2013/07/08 14:27:41
    ちょっと試してみたのですが、Firefox のソースビューアの「表示」－「文字エンコーディング」で選択されている文字コードは、デフォルトが Shift_JIS で、HTTP プロトコル中の charset の指定が無いと、このデフォルトが選択された状態になるようです。

    「HTTP プロトコル中の charset」というのは HTML 中に記述する charset ではなく、Web サーバ側の設定で決まる charset で、FIrefox であれば「開発ツール」－「Web コンソール」を選択して、「ネットワーク」のボタンが選択されている状態でアクセスすると、各通信の一覧が表示されるので、それをクリックした時に表示される情報の中の「応答ヘッダ」に「Centent-Type」という名称のヘッダに記述されます。

    で、手元で

    ・UTF-8 で書いた HTML ファイルを Web サーバに置いておく。
    ・HTTP ヘッダ中で charset が指定されないように、Web サーバを設定しておく。

    という状態でソースを表示してみると、

    ・ソースビューアの文字エンコーディングの選択は Shift_JIS のまま。
    ・でも、文字化けされていない。
    ・手動で文字エンコーディングに UTF-8 を選択しても何も起こらない。
    ・そこから Shift_JIS を選択すると文字化けする。

    という挙動になりました。おそらく、ソースビューアを起動した直後は、

    ・文字エンコーディングの選択状態は Shift_JIS。
    ・でも、内部的な状態は UTF-8 として処理している。

    という状態ではないかと想像します。

    ただ、一部が文字化けする、という現象は説明できませんし、エディタとの間のコピー＆ペーストで問題が発生する事も説明出来ません。

    う～ん...。
  • id:maimainet
    maimainet 2013/07/09 07:33:54
    >JULYさん
    検証ありがとうございます！
    レスポンスヘッダを見てみたところ、Content-Type text/htmlとなっていました。特にcharset は指定されていない、ということになるのでしょうか。それでShift-JISと自動判別される理由は解決しました。
    しかし、やはりソースだけが文字化けしています。ソースビューアの言語をUTF-8に変えてやると、文字化けは直るのですが..。

    たまたま開いていた別のサイトもレスポンスヘッダにcharset が含まれておらず、HTMLの文字コード指定はUTF-8で、ソースビューワの自動判別は初期でShift-JISになっているのに、文字化けしておらず、UTF-8を選んでも変化なし、Shift-JISを選び直すと文字化けするという、まさにJULYさんと同じ状況が再現できました。

    なぜ全く同じ状況なのに、自分のページだけ文字化けするのか....何か原因があるんでしょうけど。。
  • id:JULY
    JULY 2013/07/09 16:18:21
    > レスポンスヘッダを見てみたところ、Content-Type text/htmlとなっていました。
    > 特にcharset は指定されていない、ということになるのでしょうか。

    その認識で間違いないです。

    > それでShift-JISと自動判別される理由は解決しました。

    細かいニュアンスで申し訳ないですが、自動判別の結果が Shift_JIS ではなく、あくまでもメニュー上の文字エンコーディングの選択状態が、あたかも Shift_JIS で認識しているように見える、というもので、ソースビューアが実際にどの文字コードとして扱っているかは分からない、という状況です。

    例えば、ソースビューアのメニューで「表示」－「文字エンコーディング」で「西欧（iso-8859-1）」を選択すれば、日本語が含まれていれば文字化けすると思います。この状態から「表示」－「文字エンコーディング」－「自動判別」－「日本語」と選択すると、文字化けは解消しますがメニュー上は「西欧（iso-8859-1）」が選択された状態のままです。正しく表示できているのだから、ソースビューアが認識している文字コードは iso-8859-1 ではない事は明らかですが、じゃぁ、なんの文字コードなのか？ というのは結局分かりません。

    ブラウザの方は、右ボタンんのメニューから「ページの情報を表示」とすれば、どの文字コードとして最終的に認識しているかは分かるのですが、ソースビューアの方に、これに該当する物は見当たりません。

    おそらくは、ブラウザで認識した文字コードを採用していると思うのですが、それだと、ブラウザで正しく表示されていて、ソース表示で文字化けすることが説明できないし...。

    実は、HTML のソース自体は、本当に文字コード混在（もしくは、Web サーバへの転送の際に意図しない変換があって、微妙に中身が壊れているとか）していて、でも、ブラウザの表示は JavaScript の結果で、結果的に文字化けしている所が隠れてしまっている、なんて事は無いですよね、さすがに。
  • id:maimainet
    maimainet 2013/07/20 12:44:04
    >JULYさん
    詳細ありがとうございます。ブラウザのソースビューアって思ったよりもずっと複雑な仕組みなんですね。結局、文字コードを変換してコピペしても改善せず、「西欧（iso-8859-1）」までもが自動判別で選択されるページまででてきてしまったので、もうお手上げかなというところです。
    javascriptの件は、あながち間違ってないかもです....もう原因としてそれしか無い気がします（複雑なJSが多数入っているようなので...）
    時間がある時に腰を据えて原因を探ってみたいと思います。
    何度もありがとうございます！大変勉強になりました。

この質問への反応（ブックマークコメント）

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません
ユーザー登録をして使いはじめる!無料
すでに登録されている方はこちらからログイン
この質問に含まれるキーワード
知りたいことを検索してみよう
▲ページトップへ