Shift_JIS ? UTF-8 ? Internet Explorerの不思議な挙動
お仕事中、お客様から電話が入った。こちらから納品したHTMLが文字化けするのだという。UTF-8で作ってあるから、Internet Explorerの「表示」→「エンコード」で「自動選択」にチェックを入れてくださいということでお茶を濁したつもりだった。しかし．．．
そうすると、今度はお客さんのイントラネット上のデータが文字化けするのだそうだ。
そもそもこちらのデータはMETAタグで charset="UTF-8" を指定しているのだから、「自動選択」になっていてもいなくても「UTF-8」で表示されなければおかしいはずなのだ。実際、Firefoxでは問題なく表示できている。
さらにもう一つ言わせてもらうと、「自動選択」にしたことでお客さんのイントラネットのデータが化けるのもおかしな話なのだ。
というわけでIEの文字コードに関する挙動を調べたら、色々と奇妙なことが判明した。
まず、IE6から。
UTF-8でHTMLを作成する。ただし、文字コード宣言の前に日本語文字を入れる。
例えば
日本語
というようにしておく。
エンコードを「自動選択」にしておかないとIE6はこれをShift_JISとして認識。ページは文字化けを起こしてしまう（おかしい）。
エンコードを「自動選択」にすると、IE6はこれをUTF-8として認識。ページはきれいに表示される（期待通り）。
しかし、上記のHTMLのと<META>を入れ替え、文字コード宣言の前に日本語の文字が入らないようにすると、エンコードがどうなっていようとIE6はこれをUTF-8として認識。ページはきれいに表示される（期待通りだが．．．？？？）<br /><br />じゃあ、とにかく文字コード宣言の前に日本語の文字を入れなければいいのかと思い、先にMETAタグを置いたファイルを作ってIE7で試してみると、今度は「自動選択」を外した場合に文字化け。挙動が違う。<br /><br />で、さらなる情報を求めてネットを検索していると<br /><a href="http://support.microsoft.com/kb/413581/ja" target="_blank">http://support.microsoft.com/kb/413581/ja</a><br />というページに行き当たった。<br /><br />1.IEは、HTMLで文字コード宣言がある場合はその文字コードを使用する<br /><br />2.HTMLで文字コード宣言がない場合は、「エンコード」メニューでユーザーが最後に指定した文字セットが使用される。<br /><br />2-1.「エンコード」でユーザーが最後に選択したのが「自動選択」であった場合、IEは表示可能なありとあらゆる文字セットの中から、そのページを表示するのに適切と思われる文字コードを自動的に選択する<br /><br />2-2.「エンコード」でユーザーが最後に指定したのが「日本語（自動選択）」であった場合、IEはJIS、Shift_JIS、EUCのいずれかから、もっともそのページを表示するのに適切と思われる文字コードを自動的に選択する（UTF-8は候補に含まれていない！）<br /><br />ということらしい。<br />これと、今日の実験結果を付き合わせると、文字コード宣言以前に日本語の文字が見つかると、IE6はそのページで「文字コード宣言はなされていない」ことにしてしまうらしい。IE7に至っては何をどう判断しているのかまったく不明だ。<br /><br />さらに、今日のテストにおいて、条件分けが足りていないことも判明した。<br />IE6のテストにおいても、IE7のテストにおいても、「最後に選択してあったエンコードが何であったか」にまったく注意していなかった。<br />明日以降、Internet Explorerのこの挙動について、さらに調査を加えたいと思う。<a name="more"></a><div id="article-ad" style="margin-top:20px; text-align:center;clear:both;"><script type="text/javascript">
var adstir_vars = {
ver: "4.0",
app_id: "MEDIA-4594d55e",
ad_spot: 1,
center: false
};
</script>
<script type="text/javascript" src="https://js.ad-stir.com/js/adstir.js"></script></div></div>
<footer class="Article__footer">
<div class="Posted">
<div class="Posted__item -label"><a href="/theme/2537af2c69.html" rel="nofollow"><em>パソコン</em></a> <a href="/theme/384b971ad1.html" rel="nofollow"><em>ソフトウェア</em></a> <a href="/theme/ed735bda85.html" rel="nofollow"><em>Internet Explorer</em></a> </div><div class="Posted__item -feeling"><a href="https://kzworks.at.webry.info/200709/article_6.html#kimochi">気持玉(21)</a></div>
<div class="Posted__item -comments"><span><a href="https://kzworks.at.webry.info/200709/article_6.html#comments"><em>12</em></a></span></div><div class="Posted__item -trackback"><span><a href="https://kzworks.at.webry.info/200709/article_6.html#trackback"><em>1</em></a></span></div></div>
<div class="bookmark" data-url="https://kzworks.at.webry.info/200709/article_6.html" data-subject="Shift_JIS ? UTF-8 ? Internet Explorerの不思議な挙動"></div>
</footer>
</article>
<div class="Permalink">
<div class="Permalink__item -left">
<a href="https://kzworks.at.webry.info/200709/article_5.html" class="prev">
<div class="PermalinkThumbnail">
<div class="PermalinkThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<h4 class="PermalinkTitle"><span>Damnsmall Linux （DSL）を試す</span></h4>
</a>
</div>
<div class="Permalink__item -right">
<a href="https://kzworks.at.webry.info/200709/article_7.html" class="next">
<div class="PermalinkThumbnail">
<div class="PermalinkThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<h4 class="PermalinkTitle"><span>Shift_JIS ? UTF-8 ? Internet Explorerの..</span></h4>
</a>
</div>
</div>
</div>
<div id="kimochi" class="kimochi">
<h2 class="kimochiHeader">ブログ気持玉</h2>
<div class="kimochiClick">
<p><strong>クリックして気持ちを伝えよう！</strong></p>
<p>ログインしてクリックすれば、自分のブログへのリンクが付きます。</p>
<p><a href="https://webryblog.biglobe.ne.jp">→ログインへ</a></p>
<form method="post" name="feelingpost" action="" class="kPostWrap">
<input type="hidden" name="article_id" value="10847905">
<input type="hidden" name="feeling_type_id" value="">
<div id="k-post" class="kPostlist">
<div class="kPostlist__item">
<a href="javascript:void(0)" onclick="javascript:onFeelingPost(1);return false;"><img src="/images/article/kimochi_aha_a.png" alt="なるほど（納得、参考になった、ヘー）" width="22" height="20"></a>
<button onclick="javascript:onFeelingPost(1)" title="なるほど（納得、参考になった、ヘー）">なるほど</button>
</div>
<div class="kPostlist__item">
<a href="javascript:void(0)" onclick="javascript:onFeelingPost(2);return false;"><img src="/images/article/kimochi_amaze_a.png" alt="驚いた" width="22" height="20"></a>
<button onclick="javascript:onFeelingPost(2)" title="驚いた">驚いた</button>
</div>
<div class="kPostlist__item">
<a href="javascript:void(0)" onclick="javascript:onFeelingPost(3);return false;"><img src="/images/article/kimochi_funny_a.png" alt="面白い" width="22" height="20"></a>
<button onclick="javascript:onFeelingPost(3)" title="面白い">面白い</button>
</div>
<div class="kPostlist__item">
<a href="javascript:void(0)" onclick="javascript:onFeelingPost(4);return false;"><img src="/images/article/kimochi_nice_a.png" alt="ナイス" width="22" height="20"></a>
<button onclick="javascript:onFeelingPost(4)" title="ナイス">ナイス</button>
</div>
<div class="kPostlist__item">
<a href="javascript:void(0)" onclick="javascript:onFeelingPost(5);return false;"><img src="/images/article/kimochi_guts_a.png" alt="ガッツ（がんばれ！）" width="22" height="20"></a>
<button onclick="javascript:onFeelingPost(5)" title="ガッツ（がんばれ！）">ガッツ</button>
</div>
<div class="kPostlist__item">
<a href="javascript:void(0)" onclick="javascript:onFeelingPost(6);return false;"><img src="/images/article/kimochi_lovely_a.png" alt="かわいい" width="22" height="20"></a>
<button onclick="javascript:onFeelingPost(6)" title="かわいい">かわいい</button>
</div>
</div>
</form>
<div id="k-list" class="kList">
<p>気持玉数 ： 21</p>
<div class="kUnit">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<a href="https://higanaichinichi.at.webry.info/"><img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha_a.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="さるびあ"></a>
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_aha.png" width="22" height="20" border="0" alt="なるほど（納得、参考になった、ヘー）" title="">
</div>
<div class="kUnit">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_amaze.png" width="22" height="20" border="0" alt="驚いた" title="">
</div>
<div class="kUnit">
</div>
<div class="kUnit">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_nice.png" width="22" height="20" border="0" alt="ナイス" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_nice.png" width="22" height="20" border="0" alt="ナイス" title="">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_nice.png" width="22" height="20" border="0" alt="ナイス" title="">
</div>
<div class="kUnit">
<img src="https://webryblog.biglobe.ne.jp/images/article/kimochi_guts.png" width="22" height="20" border="0" alt="ガッツ（がんばれ！）" title="">
</div>
</div>
</div>
</div>
<div id="comments" class="Comments">
<h3 class="Comments__heading">この記事へのコメント</h3>
<div class="CommentsList">
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>タガワ</span>
</div><div class="CommentsDate">
<span>2007年11月22日 11:18</span>
</div>
</div>
<div class="Comments__body">
<span>検索からアクセスさせていただきました。<br />まったく同じ問題で悩んでいましたので大変助かりました。<br />ありがとうございます。</span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>kazuyoshikakihara</span>
</div><div class="CommentsDate">
<span>2007年11月23日 00:42</span>
</div>
</div>
<div class="Comments__body">
<span>お役に立てて幸いです。<br />次のサービスパックでIEの挙動がまた変わってしまわないことを祈らないといけませんね。</span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>FRYBAREC</span>
</div><div class="CommentsDate">
<span>2008年01月02日 22:53</span>
</div>
</div>
<div class="Comments__body">
<span>私も同様の悩みでこのページに着てしまいました。<br />情報提供に感謝いたします。<br />なんとも、MSIEは独自に走りすぎな気がしますね。<br /></span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>kazuyoshikakihara</span>
</div><div class="CommentsDate">
<span>2008年01月04日 23:10</span>
</div>
</div>
<div class="Comments__body">
<span>FRYBARECさん、どういたしまして。<br />個人のメモ書きを公開して意味があるのだろうかと思っていましたが、意外とこの記事は役に立っているようですね。実験した甲斐がありました。<br />MSIEは6と7で挙動が違うのがまた困りものなのですよね。</span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>イザワ</span>
</div><div class="CommentsDate">
<span>2008年02月19日 17:33</span>
</div>
</div>
<div class="Comments__body">
<span>私も同様の問題で検索していたところこちらにたどり着きました。<br />おかげさまで解決できました。大変感謝しております。<br />ありがとうございます。</span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>kazuyoshikakihara</span>
</div><div class="CommentsDate">
<span>2008年02月19日 23:39</span>
</div>
</div>
<div class="Comments__body">
<span>この記事だけ妙にアクセスが多いので、文章の拙さがだんだん気になってきました。<br />でも、意図するところは伝わっているようですので、これでもいいのですよね、イザワさん。</span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>通りすがり</span>
</div><div class="CommentsDate">
<span>2008年07月19日 18:12</span>
</div>
</div>
<div class="Comments__body">
<span>お役に立たないかも知れませんが。<br />htmlを保存するときに「UTF-8N」とかに出来ませんか。<br />通常これでいけるかと思いますが．．．<br /></span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>kazuyoshikakihara</span>
</div><div class="CommentsDate">
<span>2008年07月20日 16:12</span>
</div>
</div>
<div class="Comments__body">
<span>記事を作ったのが少し前のことだったので、あらためて調べなおしました。「UTF-8N」すなわちBOMなしでテストした結果が記事のとおりとなっています。<br />BOMをつけると、手元のIE6では、エンコードの設定がどうなっていようとも、UTF-8で表示されるようですね。BOMをつけるのが有効な解決策ということですかね。</span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>通りすがり</span>
</div><div class="CommentsDate">
<span>2011年03月01日 11:36</span>
</div>
</div>
<div class="Comments__body">
<span>同じ部分で困っていたので非常に参考になりました。</span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>ｇ</span>
</div><div class="CommentsDate">
<span>2012年04月09日 20:22</span>
</div>
</div>
<div class="Comments__body">
<span>いや文字コード指定する前にマルチバイトを書き込むって非推奨ですよ</span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>kazuyoshikakihara</span>
</div><div class="CommentsDate">
<span>2012年04月09日 21:49</span>
</div>
</div>
<div class="Comments__body">
<span>正論、ごもっともです。<br />しかし、非推奨といわれても、お客さんが社内で非推奨のことをやられている場合、こちらとしては手の出しようがないわけでして。だからこういった調査が必要になるわけです。ご理解ください。</span>
</div>
</article>
<article class="Comments__item">
<div class="Comments__header">
<div class="CommentsWriter"><span>okito</span>
</div><div class="CommentsDate">
<span>2012年04月19日 12:12</span>
</div>
</div>
<div class="Comments__body">
<span>IE8でも直っていませんね。私の場合、javascriptの英数文字で、コードの違いでエラーになります。ローカルのhtmlファイルを開くときに、自動が機能しないようで、文字セットを指定しても、自動で読み直さないと直りません。日本語文字まったく入れなくても、再読込が必要になります。インターネット上に置くと、問題が起きないのですが・・</span>
</div>
</article>
</div>
<div class="Comments__leave">
<a href="/comment?article_id=10847905" class="btn" rel="nofollow"><span>コメントを書く</span></a>
</div>
</div>
<div id="trackback" class="Trackback">
<div class="TrackbackArticle">
<h4 class="TrackbackArticle__header"><span>この記事へのトラックバック</span></h4>
<ul class="TrackbackArticleList">
<li class="TrackbackArticleList__item">
<p class="TrackbackUrl"><a href="http://icotfeels.blog66.fc2.com/blog-entry-2254.html" target="_blank" rel="nofollow"><span>絆の定義</span></a></p>
<div class="TrackbackDetail">
<span>Excerpt: <em>ようやくリニューアル。って、ログイン機構とかを見直したくらいですが。
絆の定義
マウスだけで特定の方とチャットできる、そんなサイ�...</em></span>
<span>Weblog: <em>今感じていること</em></span>
<span>racked: <em>2008-08-13 10:55</em></span>
</div>
</li>
</ul>
</div>
</div>
</div>
</div><!-- /main -->
<aside role="complementary" class="Side">
<div class="Side__inner">
<section class="Module -search">
<h3 class="Module__heading -none">検索</h3>
<div class="Module__body">
<form target="_brank" name="search" action="https://cgi.search.biglobe.ne.jp/cgi-bin/search-blog2" method="get">
<input type="hidden" value="検索" name="c">
<input type="hidden" value="1" name="clid">
<div class="Search">
<input type="keyword" value="" size="25" name="q" placeholder="ブログ内検索" class="Search__text">
<input type="submit" value="検索" name="btn" class="Search__submit">
</div>
<div>
<input type="radio" checked="" value="https://kzworks.at.webry.info/" name="sitesearch" class="-default"> サイト内
<input type="radio" value="" name="sitesearch" class="-default"> ウェブ
</div>
</form>
</div>
</section>
<section class="Module -freeArea">
<div class="FreeArea"><h2>趣味のセレクトショップ</h2>
<p><a herf="http://astore.amazon.co.jp/kzworks-22">パステルリングおすすめの動物グッズ</a></p>
<h2>私の民芸品置き場</h2>
<ul>
<li><a href="http://www7a.biglobe.ne.jp/~kzworks/">ホームページ</a></li>
<li><a href="http://www.vector.co.jp/vpack/browse/person/an041938.html">Vector ライブラリ</a></li>
</ul>
</div>
</section>
<section class="Module -freeArea">
<div class="FreeArea"><div id="twitter_div">
<h2 class="twitter-title">つぶやき</h2>
<a href="http://twitter.com/kzworks">@Twitter</a>
<ul id="twitter_update_list"></ul></div>
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/kzworks.json?callback=twitterCallback2&count=5"></script>
<iframe src="http://rcm-jp.amazon.co.jp/e/cm?t=kzworks-22&o=9&p=14&l=bn1&mode=books-jp&browse=466298&fc1=000000<1=&lc1=3366FF&bg1=FFFFFF&f=ifr" marginwidth="0" marginheight="0" width="160" height="600" border="0" frameborder="0" style="border:none;" scrolling="no"></iframe>
</div>
</section>
<section class="Module -freeArea">
<div class="FreeArea"><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- webryblog-right -->
<ins class="adsbygoogle"
style="display:inline-block;width:160px;height:600px"
data-ad-client="ca-pub-8167147843644381"
data-ad-slot="1124263553"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-2361650-3";
urchinTracker();
</script>
</div>
</section>
<section class="Module -recentEntry">
<h3 class="Module__heading">最近の記事</h3>
<div class="Module__body">
<ul class="RecentEntry">
<li class="RecentEntry__item">
<a href="https://kzworks.at.webry.info/201606/article_1.html">
<div class="RecentEntryThumbnail">
<div class="RecentEntryThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<div class="RecentEntryWrap">
<h4 class="RecentEntry__title"><span>Chrome の DomParser にSJISのHTMLをパースさ…</span></h4>
<div class="RecentEntry__body"><span>HTMLをパースするのに、ブラウザのパーサーを使うのが…</span></div>
</div>
</a>
</li>
<li class="RecentEntry__item">
<a href="https://kzworks.at.webry.info/201512/article_6.html">
<div class="RecentEntryThumbnail">
<div class="RecentEntryThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<div class="RecentEntryWrap">
<h4 class="RecentEntry__title"><span>AndroidのListActivityにコンテキストメニュ…</span></h4>
<div class="RecentEntry__body"><span>まさにタイトルの件で困って調べたのでメモとして。
…</span></div>
</div>
</a>
</li>
<li class="RecentEntry__item">
<a href="https://kzworks.at.webry.info/201512/article_5.html">
<div class="RecentEntryThumbnail">
<div class="RecentEntryThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<div class="RecentEntryWrap">
<h4 class="RecentEntry__title"><span>playframework 2.3 -> 2.4 で Controller が</span></h4>
<div class="RecentEntry__body"><span>動作環境の構築を人任せにしていたので、細かいところ…</span></div>
</div>
</a>
</li>
<li class="RecentEntry__item">
<a href="https://kzworks.at.webry.info/201512/article_4.html">
<div class="RecentEntryThumbnail">
<div class="RecentEntryThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<div class="RecentEntryWrap">
<h4 class="RecentEntry__title"><span>XmlPullParser が CDATA をどのように扱うの…</span></h4>
<div class="RecentEntry__body"><span>Android で XMLドキュメントをパースする際によくお世…</span></div>
</div>
</a>
</li>
<li class="RecentEntry__item">
<a href="https://kzworks.at.webry.info/201512/article_3.html">
<div class="RecentEntryThumbnail">
<div class="RecentEntryThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<div class="RecentEntryWrap">
<h4 class="RecentEntry__title"><span>RSS2.0 の と の違いについて</span></h4>
<div class="RecentEntry__body"><span>札幌市円山動物園のブログのフィードを解析していて、…</span></div>
</div>
</a>
</li>
<li class="RecentEntry__item">
<a href="https://kzworks.at.webry.info/201512/article_2.html">
<div class="RecentEntryThumbnail">
<div class="RecentEntryThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<div class="RecentEntryWrap">
<h4 class="RecentEntry__title"><span>Androidプログラミングのテストで、テスト用…</span></h4>
<div class="RecentEntry__body"><span>今日、Android用のプログラムを書いていて、すぐに分…</span></div>
</div>
</a>
</li>
<li class="RecentEntry__item">
<a href="https://kzworks.at.webry.info/201512/article_1.html">
<div class="RecentEntryThumbnail">
<div class="RecentEntryThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<div class="RecentEntryWrap">
<h4 class="RecentEntry__title"><span>Play Framework の Bootstrap 設定ではまった…</span></h4>
<div class="RecentEntry__body"><span>本日、仕事で Play Framework で CSSライブラリの Boo…</span></div>
</div>
</a>
</li>
<li class="RecentEntry__item">
<a href="https://kzworks.at.webry.info/201505/article_1.html">
<div class="RecentEntryThumbnail">
<div class="RecentEntryThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<div class="RecentEntryWrap">
<h4 class="RecentEntry__title"><span>VimとKarmaの相性がよろしくない件</span></h4>
<div class="RecentEntry__body"><span>Javascriptのコードを書くにあたり、2015年5月現在、…</span></div>
</div>
</a>
</li>
<li class="RecentEntry__item">
<a href="https://kzworks.at.webry.info/201410/article_3.html">
<div class="RecentEntryThumbnail">
<div class="RecentEntryThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<div class="RecentEntryWrap">
<h4 class="RecentEntry__title"><span>スマホのジオロケーションAPIの話</span></h4>
<div class="RecentEntry__body"><span>スマホのジオロケーション機能、もっと平たく言えばGP…</span></div>
</div>
</a>
</li>
<li class="RecentEntry__item">
<a href="https://kzworks.at.webry.info/201410/article_2.html">
<div class="RecentEntryThumbnail">
<div class="RecentEntryThumbnail__inner -bgnone">
<img src="https://bblog.sso.biglobe.ne.jp/visual/pc/common/noimage.svg" alt="" />
</div>
</div>
<div class="RecentEntryWrap">
<h4 class="RecentEntry__title"><span>Crafty のバグっぽい</span></h4>
<div class="RecentEntry__body"><span>Javascript によるゲームエンジンの一つ Crafty とい…</span></div>
</div>
</a>
</li>
</ul>
</div>
</section>
<section class="Module -qrcode">
<h3 class="Module__heading">QRコード</h3>
<div class="Module__body">
<div class="Qrcode"><img src="https://userdisk.webry.biglobe.ne.jp/000/233/74/N000/000/000/webry_plugin_qrcode_24938005.png"></div>
</div>
</section>
<section class="Module -rdfSummary">
<ul class="RdfSummary">
<li class="RdfSummary__item"><a href="/rss/index.rdf"><span>RDF Site Summary</span></a></li>
</ul>
</section>
<section class="Module -linkList">
<h3 class="Module__heading">BIGLOBEニュース</h3>
<div class="Module__body">
<ul class="LinkList" id="biglobenews">
</ul>
</div>
<script>
(function() {
const xhr = new XMLHttpRequest();
xhr.addEventListener('load', function() {
const json = JSON.parse(this.responseText);
for(let i = json.length - 1; i > 0; i--){
const r = Math.floor(Math.random() * (i + 1));
const tmp = json[i];
json[i] = json[r];
json[r] = tmp;
}
let html = '';
json.slice(0,5).forEach(function(item, index) {
const parts = '<li class="LinkList__item"><a href="' + item.url + '" target="_blank">' + item.title + '</a></li>';
html = html + parts;
});
document.getElementById('biglobenews').innerHTML = html;
});
xhr.open("GET", 'https://webryblog.biglobe.ne.jp/biglobenews.json');
xhr.send();
})();
</script>
</section>
<section class="Module -bgnone">
<div align="center" class="Module__body">
<script type="text/javascript">
var adstir_vars = {
ver: "4.0",
app_id: "MEDIA-4594d55e",
ad_spot: 2,
center: false
};
</script>
<script type="text/javascript" src="https://js.ad-stir.com/js/adstir.js"></script>
</div>
</section>
</div>
</aside>
<aside id="links-left" role="complementary" class="Side -left">
<div class="Side__inner">
<section class="Module -calendar">
<table class="Calendar">
<caption class="Calendar__date">
<a href="https://kzworks.at.webry.info/201605/index.html" class="prev"><span><<</span></a>
<a href="https://kzworks.at.webry.info/201606/index.html" class="month">2016年06月</a>
<div class="next"><span>>></span></div>
</caption>
<thead class="Calendar__week">
<tr class="WeekList">
<th class="WeekList__item -sun"><span>日</span></th>
<th class="WeekList__item -mon"><span>月</span></th>
<th class="WeekList__item -tue"><span>火</span></th>
<th class="WeekList__item -wed"><span>水</span></th>
<th class="WeekList__item -thu"><span>木</span></th>
<th class="WeekList__item -fri"><span>金</span></th>
<th class="WeekList__item -sat"><span>土</span></th>
</tr>
</thead>
<tbody class="Calendar__day">
<tr class="DayList">
<td class="DayList__item"><span> </span><span> </span></td>
<td class="DayList__item"><span> </span><span> </span></td>
<td class="DayList__item"><span> </span><span> </span></td>
<td class="DayList__item"><span>1</span></td>
<td class="DayList__item"><span>2</span></td>
<td class="DayList__item"><span>3</span></td>
<td class="DayList__item"><span>4</span></td>
</tr>
<tr class="DayList">
<td class="DayList__item"><span>5</span></td>
<td class="DayList__item"><span>6</span></td>
<td class="DayList__item"><span>7</span></td>
<td class="DayList__item"><span>8</span></td>
<td class="DayList__item"><span>9</span></td>
<td class="DayList__item"><span>10</span></td>
<td class="DayList__item"><span>11</span></td>
</tr>
<tr class="DayList">
<td class="DayList__item"><span>12</span></td>
<td class="DayList__item"><span>13</span></td>
<td class="DayList__item"><span>14</span></td>
<td class="DayList__item"><span>15</span></td>
<td class="DayList__item"><span>16</span></td>
<td class="DayList__item"><span>17</span></td>
<td class="DayList__item"><a href="https://kzworks.at.webry.info/20160618/index.html"><span>18</span></a></td>
</tr>
<tr class="DayList">
<td class="DayList__item"><span>19</span></td>
<td class="DayList__item"><span>20</span></td>
<td class="DayList__item"><span>21</span></td>
<td class="DayList__item"><span>22</span></td>
<td class="DayList__item"><span>23</span></td>
<td class="DayList__item"><span>24</span></td>
<td class="DayList__item"><span>25</span></td>
</tr>
<tr class="DayList">
<td class="DayList__item"><span>26</span></td>
<td class="DayList__item"><span>27</span></td>
<td class="DayList__item"><span>28</span></td>
<td class="DayList__item"><span>29</span></td>
<td class="DayList__item"><span>30</span></td>
<td class="DayList__item"><span> </span><span> </span></td>
<td class="DayList__item"><span> </span><span> </span></td>
</tr>
</tbody>
</table>
</section>
<script>
function changeMonthlyLink24937994(select) {
const url = select.options[select.selectedIndex].value;
if (url != '') {
location.href = url;
} else {
return false;
}
}
</script>
<section class="Module -backlog">
<h3 class="Module__heading">過去ログ</h3>
<div class="Module__body">
<select onchange="changeMonthlyLink24937994(this)">
<option value="">表示したい月を選択</option>
<option value="https://kzworks.at.webry.info/201606/index.html">2016年06月</option>
<option value="https://kzworks.at.webry.info/201512/index.html">2015年12月</option>
<option value="https://kzworks.at.webry.info/201505/index.html">2015年05月</option>
<option value="https://kzworks.at.webry.info/201410/index.html">2014年10月</option>
<option value="https://kzworks.at.webry.info/201409/index.html">2014年09月</option>
<option value="https://kzworks.at.webry.info/201408/index.html">2014年08月</option>
<option value="https://kzworks.at.webry.info/201407/index.html">2014年07月</option>
<option value="https://kzworks.at.webry.info/201406/index.html">2014年06月</option>
<option value="https://kzworks.at.webry.info/201405/index.html">2014年05月</option>
<option value="https://kzworks.at.webry.info/201404/index.html">2014年04月</option>
<option value="https://kzworks.at.webry.info/201103/index.html">2011年03月</option>
<option value="https://kzworks.at.webry.info/201102/index.html">2011年02月</option>
<option value="https://kzworks.at.webry.info/201012/index.html">2010年12月</option>
<option value="https://kzworks.at.webry.info/201011/index.html">2010年11月</option>
<option value="https://kzworks.at.webry.info/201007/index.html">2010年07月</option>
<option value="https://kzworks.at.webry.info/201006/index.html">2010年06月</option>
<option value="https://kzworks.at.webry.info/201005/index.html">2010年05月</option>
<option value="https://kzworks.at.webry.info/201004/index.html">2010年04月</option>
<option value="https://kzworks.at.webry.info/201003/index.html">2010年03月</option>
<option value="https://kzworks.at.webry.info/201002/index.html">2010年02月</option>
<option value="https://kzworks.at.webry.info/201001/index.html">2010年01月</option>
<option value="https://kzworks.at.webry.info/200912/index.html">2009年12月</option>
<option value="https://kzworks.at.webry.info/200911/index.html">2009年11月</option>
<option value="https://kzworks.at.webry.info/200910/index.html">2009年10月</option>
<option value="https://kzworks.at.webry.info/200909/index.html">2009年09月</option>
<option value="https://kzworks.at.webry.info/200908/index.html">2009年08月</option>
<option value="https://kzworks.at.webry.info/200907/index.html">2009年07月</option>
<option value="https://kzworks.at.webry.info/200906/index.html">2009年06月</option>
<option value="https://kzworks.at.webry.info/200905/index.html">2009年05月</option>
<option value="https://kzworks.at.webry.info/200904/index.html">2009年04月</option>
<option value="https://kzworks.at.webry.info/200903/index.html">2009年03月</option>
<option value="https://kzworks.at.webry.info/200902/index.html">2009年02月</option>
<option value="https://kzworks.at.webry.info/200901/index.html">2009年01月</option>
<option value="https://kzworks.at.webry.info/200812/index.html">2008年12月</option>
<option value="https://kzworks.at.webry.info/200811/index.html">2008年11月</option>
<option value="https://kzworks.at.webry.info/200810/index.html">2008年10月</option>
<option value="https://kzworks.at.webry.info/200809/index.html">2008年09月</option>
<option value="https://kzworks.at.webry.info/200808/index.html">2008年08月</option>
<option value="https://kzworks.at.webry.info/200807/index.html">2008年07月</option>
<option value="https://kzworks.at.webry.info/200806/index.html">2008年06月</option>
<option value="https://kzworks.at.webry.info/200805/index.html">2008年05月</option>
<option value="https://kzworks.at.webry.info/200804/index.html">2008年04月</option>
<option value="https://kzworks.at.webry.info/200803/index.html">2008年03月</option>
</select>
</div>
</section>
<section class="Module -tagCloud">
<h3 class="Module__heading">テーマ別記事</h3>
<div class="Module__body">
<ul class="CategoryList">
<li class="CategoryList__item"><a href="/theme/2537af2c69.html">パソコン</a> <span>(1210)</span></li>
<li class="CategoryList__item"><a href="/theme/384b971ad1.html">ソフトウェア</a> <span>(808)</span></li>
<li class="CategoryList__item"><a href="/theme/32b7d1b1ac.html">雑記</a> <span>(342)</span></li>
<li class="CategoryList__item"><a href="/theme/b7fc912103.html">暗号</a> <span>(172)</span></li>
<li class="CategoryList__item"><a href="/theme/5062a2b786.html">読書</a> <span>(132)</span></li>
<li class="CategoryList__item"><a href="/theme/e279c79ccd.html">セキュリティ</a> <span>(132)</span></li>
<li class="CategoryList__item"><a href="/theme/58d690c9c3.html">携帯電話</a> <span>(104)</span></li>
<li class="CategoryList__item"><a href="/theme/0340c201c7.html">PDF</a> <span>(82)</span></li>
<li class="CategoryList__item"><a href="/theme/3fc244f598.html">Namazu</a> <span>(42)</span></li>
<li class="CategoryList__item"><a href="/theme/683ea31bef.html">経済</a> <span>(35)</span></li>
<li class="CategoryList__item"><a href="/theme/4799890786.html">SQLite</a> <span>(34)</span></li>
<li class="CategoryList__item"><a href="/theme/ab4488107d.html">検索</a> <span>(33)</span></li>
<li class="CategoryList__item"><a href="/theme/8c646e57df.html">著作権</a> <span>(28)</span></li>
<li class="CategoryList__item"><a href="/theme/a1348fe003.html">芸術</a> <span>(28)</span></li>
<li class="CategoryList__item"><a href="/theme/772d095db1.html">GnuPG</a> <span>(22)</span></li>
<li class="CategoryList__item"><a href="/theme/8cb880a9c3.html">本</a> <span>(20)</span></li>
<li class="CategoryList__item"><a href="/theme/b834ba216e.html">文字コード</a> <span>(16)</span></li>
<li class="CategoryList__item"><a href="/theme/dfb1e384a9.html">備忘録</a> <span>(14)</span></li>
<li class="CategoryList__item"><a href="/theme/0bc7bb9518.html">統計</a> <span>(12)</span></li>
<li class="CategoryList__item"><a href="/theme/4f061f41c6.html">MySQL</a> <span>(11)</span></li>
</ul>
</div>
</section>
<section class="Module -recentComment">
<h3 class="Module__heading"><span>最近のコメント</span></h3>
<div class="Module__body">
<ul class="RecentComment">
<li class="RecentComment__item">
<a href="https://kzworks.at.webry.info/200802/article_21.html#comment" class="RecentCommentTitle">「MS-Access のmdb破損」</a>
<div class="RecentCommentFrom"><span>- by kazuyoshikakihara (11/29)</span></div>
</li>
<li class="RecentComment__item">
<a href="https://kzworks.at.webry.info/200802/article_21.html#comment" class="RecentCommentTitle">「MS-Access のmdb破損」</a>
<div class="RecentCommentFrom"><span>- by Parker (11/28)</span></div>
</li>
<li class="RecentComment__item">
<a href="https://kzworks.at.webry.info/200912/article_44.html#comment" class="RecentCommentTitle">「TrueType Font の仕様書」</a>
<div class="RecentCommentFrom"><span>- by kazuyoshikakihara (10/24)</span></div>
</li>
<li class="RecentComment__item">
<a href="https://kzworks.at.webry.info/200912/article_44.html#comment" class="RecentCommentTitle">「TrueType Font の仕様書」</a>
<div class="RecentCommentFrom"><span>- by holm (10/23)</span></div>
</li>
<li class="RecentComment__item">
<a href="https://kzworks.at.webry.info/201409/article_1.html#comment" class="RecentCommentTitle">「Smalltalk v.s. Python + git」</a>
<div class="RecentCommentFrom"><span>- by kazuyoshikakihara (09/02)</span></div>
</li>
<li class="RecentComment__item">
<a href="https://kzworks.at.webry.info/201409/article_1.html#comment" class="RecentCommentTitle">「Smalltalk v.s. Python + git」</a>
<div class="RecentCommentFrom"><span>- by sumim (09/02)</span></div>
</li>
<li class="RecentComment__item">
<a href="https://kzworks.at.webry.info/201407/article_10.html#comment" class="RecentCommentTitle">「PythonのhtmlパーサとWEBブラウザのパーサの違い」</a>
<div class="RecentCommentFrom"><span>- by kazuyoshikakihara (07/28)</span></div>
</li>
<li class="RecentComment__item">
<a href="https://kzworks.at.webry.info/201407/article_10.html#comment" class="RecentCommentTitle">「PythonのhtmlパーサとWEBブラウザのパーサの違い」</a>
<div class="RecentCommentFrom"><span>- by 某 (07/28)</span></div>
</li>
<li class="RecentComment__item">
<a href="https://kzworks.at.webry.info/200908/article_41.html#comment" class="RecentCommentTitle">「SQLite ODBC ドライバ 0.83 日本語対応版」</a>
<div class="RecentCommentFrom"><span>- by 田舎のIT新人 (12/10)</span></div>
</li>
<li class="RecentComment__item">
<a href="https://kzworks.at.webry.info/200612/article_28.html#comment" class="RecentCommentTitle">「Felica の暗号は破られたのか？」</a>
<div class="RecentCommentFrom"><span>- by http://www.fetang.com/ (08/02)</span></div>
</li>
</ul>
</div>
</section>
</div>
</aside>
</div>
</div>
</div><!-- /l-content -->
<footer role="contentinfo" class="l-footer">
<div class="l-footer__inner">
<div class="Footer">
<div class="Footer__inner">
</div>
</div>
<div id="links" style="display:block;visibility:visible;width:100%;text-align:center;">
<a href="https://webryblog.biglobe.ne.jp/">ウェブリブログ</a> ｜
<a href="https://www.biglobe.ne.jp/">BIGLOBEトップ</a> ｜
<a href="https://travel.biglobe.ne.jp/">旅行</a> ｜
<a href="https://gift.biglobe.ne.jp/">ギフト</a> ｜
<a href="https://kurashi.biglobe.ne.jp/">暮らし</a> ｜
<a href="https://news.biglobe.ne.jp/">ニュース</a> ｜
<a href="https://join.biglobe.ne.jp/index.html">入会案内</a>
</div>
<div class="Poweredby">
<div class="Poweredby__body">
<a href="https://webryblog.biglobe.ne.jp/"><img src="https://webryblog.biglobe.ne.jp/images/article/sbanner-m.gif" width="190" height="30" alt="ウェブリブログ：高機能ブログを無料で！" /></a>
</div>
</div>
<div style="display:block;visibility:visible;width:100%;text-align:center;">
<a href="https://www.biglobe.co.jp/" rel="nofollow">会社概要</a>｜<a href="https://www.biglobe.ne.jp/privacy.html" rel="nofollow">個人情報保護ポリシー</a>｜<a href="https://www.biglobe.ne.jp/cookie.html" rel="nofollow">Cookieポリシー</a>
</div>
</div>
</footer><!-- /l-footer -->
</div>
</div><!-- /ll-wrapper -->
<div id="balloonBox"></div>
<script src="https://bblog.sso.biglobe.ne.jp/js/simple-bookmark-pc.js"></script>
<script>
var bookmark_services = "simplesbm".split('-').join('').split(",");
var webryBookmarks = new blBookmarks({bookmark_services:bookmark_services, blog_url:"https://bblog.sso.biglobe.ne.jp"});
webryBookmarks.exe();
</script>
<!-- common footer -->
<script>
if(('ontouchstart' in document) && ('orientation' in window)) {
;
} else {
document.write('<sc'+'ript text/javascript" src="https://js.ad-spire.net/t/492/173/a1492173.js"></scr'+'ipt>');
}
</script>
<div style="height:120px"></div><script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
<script>
if(('ontouchstart' in document) && ('orientation' in window)) {
document.write('<sc'+'ript text/javascript" src="https://js.ad-spire.net/t/492/172/a1492172.js"></scr'+'ipt>');
} else {
;
}
</script>
<div style="display:none;">
</div>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-17602683-11"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-17602683-11');
</script>
</body>
</html>
そうすると、今度はお客さんのイントラネット上のデータが文字化けするのだそうだ。
そもそもこちらのデータはMETAタグで charset="UTF-8" を指定しているのだから、「自動選択」になっていてもいなくても「UTF-8」で表示されなければおかしいはずなのだ。実際、Firefoxでは問題なく表示できている。
さらにもう一つ言わせてもらうと、「自動選択」にしたことでお客さんのイントラネットのデータが化けるのもおかしな話なのだ。
というわけでIEの文字コードに関する挙動を調べたら、色々と奇妙なことが判明した。
まず、IE6から。
UTF-8でHTMLを作成する。ただし、文字コード宣言の前に日本語文字を入れる。
例えば
というようにしておく。
エンコードを「自動選択」にしておかないとIE6はこれをShift_JISとして認識。ページは文字化けを起こしてしまう（おかしい）。
エンコードを「自動選択」にすると、IE6はこれをUTF-8として認識。ページはきれいに表示される（期待通り）。
しかし、上記のHTMLの