iPhone文字化け対策

目次

  1. 1. 施策
    1. 1.1. ①HTMLのドキュメントタイプ宣言をする。
    2. 1.2. ②metaで文字コードを指定する
    3. 1.3. ③ジオクリエーター
    4. 1.4. 追記

どうもこんばんはm(__)m@TOMMYです。
今日、久しぶりに自分のホームページをいろいろ触っていました。

目的:iPhone4(というかsafari?)からホームページを見た際の文字化けが起こらないようにソースを編集する。

ネットで調べたりもしつついろいろやってみました。とりあえずそのへんのメモを。

施策

①HTMLのドキュメントタイプ宣言をする。

ソースを見るとわかりますが、実はウチはやってませんでしたw
とりあえずHTML4.01 Frameset DTDで定義しておけば無難かと思い、以下を記述。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">


どうにもうまくいきません。indexファイルから各HTMLページ全てに記述を追加しましたが、効果なし。ドキュメントタイプ宣言の問題ではなさそうです。

というわけで次

②metaで文字コードを指定する

まあぶっちゃけ私はあまり詳しくないんですが、iphoneのsafariでは文字コードの変換ができないので、予め指定しておくといいらしいです。

ソースはこんなかんじ。

<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">


しかしうまくいかず…orz
日本語よりも前に記述しましたが、どうもこれも原因ではないご様子。ちなみにShift_JIS以外のコードにも指定してみましたが以下略

ところが、その後意外な結末が。

③ジオクリエーター

これは何かといいますと、ジオシティーズ上で使える簡易ホームページビルダーのようなものです(たぶん)

以下、ヘルプから転載。
ジオクリエーターヘルプ

■ジオクリエーターとは
ジオクリエーターは、HTMLなどホームページ作成の知識がなくても、簡単にホームページを作成できるツールです。ジオクリエーターには主に以下のような特長があります。

・HTMLタグを書かなくても、文字の修飾やページレイアウト、表の作成などが手軽にできます。
・すでにジオシティーズで公開しているホームページの編集もできます。
・写真や画像を挿入してレイアウトできます。
・プレビュー画面でホームページの仕上がりを見ながら作成できます。
・HTMLタグの直接編集も可能です。
・Flashや音声ファイルなどのさまざまなファイルを掲載できます。

ちなみにわたしはHTMLタグを全部手打ちしていたので今までこれは使っていませんでした。
ところが、ちょっとaboutページの編集をたまたまこれで行ったところ、そのページだけiphoneからでもはっきりくっきり読めるようになりましたΣ(・ω・ノ)ノ

というわけで、もしやとおもい全HTMLファイルに以下のようなことをやってみました。

(1)ジオクリエーターでHTMLファイルを開く
(2)最下部に適当に改行を入力
(3)ジオシティーズ上に上書き保存


おおお、読める…読めるぞぉ!

調子よく作業は進んでいき、あとはindexファイルだけやれば終了と思ったら、どうもジオクリエーターはフレームセットに対応していないらしく、indexファイルを開いた瞬間、frameset タグが全部消滅\(^o^)/

しかも勢い余って上書きボタンを押してしまい、frameset タグを再度打ち直すハメに。もう作ったの何年も前だからどうタグ打ちしたか忘れたよばか!おれのばか!

というわけでHTMLタグ辞典を片手にシコシコ作業が終了しました。←いまここ

それにしても、ジオクリエーターで一度開いて保存することで何故safariの文字化けが解消されたのか謎です。HTMLソースを見ても特に何も変わっていないし…

もし似たような悩みを持っていらっしゃる方はよろしければご参考ください。

追記

半年後に原因がわかりました。
そりゃそうだわw