【原因＆解決済】HTMLで空白または♂雄マークが出てしまう。ファイルメーカーの垂直タブが文字化け？

特に変更を加えてないHTMLページだったのに、昨日ふと見てみると自分のChromeでは♂マークが文と文との間などに大量発生していた。

結果から・・・
要素と要因をまとめると下記の3つ。

1 の原因を疑う理由としては、特に編集していないHTMLで少なくとも先週までは正常だったものが、昨日2/8に突然すべて同じ現象になったことから。

キャッシュの残り具合や気づかなかった＆見過ごしなどで日付の前後はあると思うけど、以前は確実に無かったものが、現在は表示されているという事実・・・

ということは・・・クロームのバージョンアップでHTML内に謎の空白＆雄マーク記号が出現したと思われるなぁ

クロームのバージョンアップ？で文字化け・空白・♂雄マークが出る

同じGoogle Chromeブラウザでも

56.0最新バージョンでは文字化けが発生。
55.0の旧バージョンでは正常表示。

なので、自分の環境と情報の限りだとクロームのバージョンによって発生したと考えています。

この♂マークがでる。。。ブラウザの個体（デフォルトのフォント）によっても違うらしい。

クロームのブラウザバージョンを確認してみた

現時点での自分のブラウザのChromeの最新バージョン
56.0.2924.87

再起動等しておらず、バージョンアップされる前の他のパソコンのChromeのバージョン
55.0.2883.87

最新バージョン

旧バーション

手元のパソコンでは同じクロームブラウザでも「♂」と出るパソコンと「□（四角：俗に言う豆腐文字）」とでるパソコンがあり、個体ごとに違いました。

ちなみにIEでは該当部分が空白として表示されていました。

ファイルメーカーでエクスポートしたCSVファイル内にある「垂直タブ」が原因

文字化け・空白・♂雄マークが発生したソースはすべてファイルメーカーで書き出したものでした。

たしかに、、ファイルメーカーで書き出したCSVをエクセルで開くと、♂マークが大量に出ていた記憶が。

ググってみると、こんな記事が。

ファイルメーカー内の「改行」はCSV書き出し時に、すべて「垂直タブVT」に変換されているとのこと。
たしかに、HTMLソースを見やすくするための改行（<br>じゃなくてソース上での）を各所に入れており、ちょうどその部分が文字化け？している様子。

ということは、今までのブラウザでは垂直タブを無視してくれていた（＝「垂直タブ」を「普通のソース内改行」としてレンダリングしてた）
のが・・・

仕様変更？で空白または文字化けとして表示されるようになってしまった、ということらしい。

解決方法：ファイルメーカーからのエクスポートの際に改行をすべて削除（置換え）で対策

対策として、ファイルメーカーからの出力の時点で改行をなくすことにしました。

ソース内改行は見た目のために入れてましたが、実際にはファイルメーカー内で確認・編集するケースがほとんどです。

改行ナシにするので、ソース上ではずら～～っと1行になっちゃいますが、特に今回は問題なし。
書き出し用のHTMLは計算フィールドで整形していました。

なので改行コード「¶」を削除するようにファイルメーカー内のスクリプト（実際にはデータベース内の計算オプション）を変更しました。

こういう仕様変更もあるんですね～

同じ現象の方の参考になれば、、といってもファイルメーカーのHTML書き出しってかなりマイナーか。。。

おわり。thanks！