Atelierで“文字化け”タグの付いているブログ記事

2023年11月19日

隠居のPC:Webページでの文字化けを解消した

先日、"休暇村ー35hotels" と題するPRメールを開いて、ページ・サーフィンしているとページの一部が文字化けして、読めない。このような事象には今までたびたび出くわしていたので解決法を探りたいと思い、いろいろとググっていると、何とか解消することができたので、備忘録的に記録しておきたい。
 私は、ネットサーフインするときは、Windows11でブラウザーはほとんどの場合 Google chromeを使っている。
 「休暇村」のページに現れた文字化けは、下のようなものである。肝心な部分が文字化けして読めない。

文字化け001.png
クリックすると大きくなります。

 Windows上の問題と思い、IME関係をいろいろと乏しい知識を巡らせて探ったが、どうにもうまくいかない。文字化けしている部分を反転して右クリックすると、表示されるポップアップの中で、本来表示すべき文字が確認できるので、まあいいかと思ったがどうもしっくりしない。
 いろいろとググっているうちに、どうやら、これは Windows の問題ではなくて、ブラウザの問題らしいとおもいいたった。
 Chromeの設定(画面右上の縦3点リーダ )をクリックし、「設定」→「デザイン」ページを開くと下の方に、「フォントをカスタマイズ」と項目があるので、これを選択し、「標準フォント」を見ると[ Marleft] となっている。その下の例示には、文字化けWeb ページに表現されていた文字が並んでいた。これが原因のようだった。この標準フォントをおなじみの「Arial」を選択すると読める字になった。文字の種類は何でもよく読めるフォントを選択すればよい。

文字化け002.png
表示されている文字がよめるようになった。

ブラウザが Microsoft Edge の場合には、設定(画面右上の3点リーダ...)をクリックし、「設定」→「外観」ページの一番下の「フォントのカスタマイズ」をクリックすると、chrome と同じように標準フォントを選択することができる。

2010年1月 3日

隠居のパソコン備忘録:Google Maps API を使った地図ページでの文字化け対策

 皆様、あけましておめでとうございます。今年も、よろしくお願いします。
 今年も、自分用の記録のために、ブログを続けたいと思います。ネット の世界の片隅に参加していることで、世の中の変化が、少しは肌で感じられるないかと不遜なことも考えています。

 GoogleMapsAPI を使った地図ページ、例えば、Studio YAMAKO「クロアチア・スロベニア・モンテネグロを巡る旅」は、GoogleMapsAPI を使いこなすためのtutorial の中から、自分でなんとか使えそうなサンプルを参考にというか、ほぼそのままに Copy&Paste して使っている。
 このページでは、Google Map をテーブルの中に表示しているが、ここで使っている表題の日本語が、場合によって文字化けを起こす現象が起きていた。
 文字化けを起こしている場合は、画面を右クリックし、出てくるポップアップ画面でエンコード→Unicode(UTF-8) を選択すれば治るのであるが、見にきてくれる人にお願いをするわけにはいかない。 
 そこで、何か方法はないかとネットサーチしてみると、上のHTML コードのなかの<head> ~</head> 部分に、その文書に関する日本語コード情報(メタ情報)を指定していなかったために起きたらしい。 つぎのようなメタコードを挿入すると、文字化けはなくなった。(と思う。)
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">


 メールなどの文字化けについては、よく相談を受けるが原因がよく分からない場合が多い。多くは、使っているメーラーの設定によると思われるが、発信元・受信先を探らないとよく分からない。もう一つのよくある原因は、普通には使わない名前などで使われている特殊な2バイト文字が宛先とか文中に使われる場合である。また、ドイツ語のウムラクトつきu(ü)などでも、文字化けを起こすようである。