Q&A
互換表示はオフにしてますか？
Web制作しています。
今回、<video>タグでの動画埋め込み案件で、クライアントに納品（サーバーアップ）したHTMLファイルが、こっちでは本番環境でもローカル環境でもブラウザ上で正常に表示されるのに、クライアントでだけ「本番では正常に表示されるのに、ローカルでだけ表示が崩れる」現象が起こりました。
【サーバー内の状況 今回手を加えたファイルは★を付けてます】
/（下記全て同階層）
∟★aaa.html
∟★bbb.html
∟ccc.html
∟ddd.html
∟eee.html
∟★movie（今回の動画データを入れてます）
∟img
∟css
・
・
・
【分かっていること】
・納品したhtmlファイル（aaa.html、bbb.html）だけ表示が崩れてて、同階層の他のHTMLファイル（ccc.htmlやddd.html）は正常に表示される。
・cssが当たっていない状態。
・画像も表示されていない。
・動画は表示され、再生もできる。
・Chromeでは正常に表示される
・IEとEdgeでだけcssが当たらず画像も表示されない
・今回納品したHTMLファイルは着手前の既存ファイルに今回の動画埋め込み箇所に<video>タグを埋め込んだだけで、head内など他のコードは一切触っていません。
・以前まではクライアントのローカルでも正常に表示されていた。
考えられる原因は何がありますでしょうか？
よろしくお願いいたします。
【追記】
■互換表示設定について
・当方はオンの状態です。（IE11）
・先方の環境は確認しないと現状わかりません。
クライアントの設定がどうなっているかわかりませんが、当方では上記で追記しました通り「オン」になっていました。
当方あまり詳しくなく恐縮なのですが、こちらは「オン」だと正しく表示されるのですか？
「当方はオンの状態です」というのは、あなたの手元ではChromeでもIE11でもEdgeでも正常に表示されているという意味ですか？先方のChromeはOKでIE11とEdgeがNGというのは読み取れますが、あなたの環境でのブラウザごとの結果がわかりません。
> 当方あまり詳しくなく恐縮なのですが、こちらは「オン」だと正しく表示されるのですか？
古いIEの時代に作られたWebアプリケーションでないのなら、オフにしておくのがよいでしょう。先方の環境内に古いWebアプリケーションと新しいWebアプリケーションが混在している場合はHTML側でX-UA-Compatibleを指定するのが普通と思います。
お返事遅くなりました。
>「当方はオンの状態です」というのは、あなたの手元ではChromeでもIE11でもEdgeでも正常に表示されているという意味ですか？先方のChromeはOKでIE11とEdgeがNGというのは読み取れますが、あなたの環境でのブラウザごとの結果がわかりません。
→私の方ではChrome、IE11、Edge全てで正常表示となっております。
>古いIEの時代に作られたWebアプリケーションでないのなら、オフにしておくのがよいでしょう。
→なるほど、ありがとうございます。当方で「オフ」に切り替えましたが、表示は正常のままでした。
>先方の環境内に古いWebアプリケーションと新しいWebアプリケーションが混在している場合はHTML側でX-UA-Compatibleを指定するのが普通と思います。
→Webアプリケーションとはここではどのようなものを指しておりますでしょうか？
回答1件
0
ベストアンサー
画像のパスを、<img src="/img/画像.png">というように「/」から始まる形で書いていたりしませんか?
サーバのドキュメントルートに設置したら機能するものの、それ以外では機能しなくなる
ということが発生しそうです。
そのほか、根拠があるわけではないですが、
元のファイルの文字コードが特殊 (普通こんなの使わない、といった類のもの) で、
編集したファイルを保存する際、文字コードを「UTF-8」に変更してしまいクライアントの環境で動作しなくなった、ということもあるかもしれません。
投稿2020/05/08 04:10
編集2020/05/08 04:13
総合スコア4528
new1ro様
お返事遅れましてすみません。この度はご回答ありがとうございます。
>画像のパスを、<img src="/img/画像.png">というように「/」から始まる形で書いていたりしませんか?
サーバのドキュメントルートに設置したら機能するものの、それ以外では機能しなくなる
ということが発生しそうです。
→こちら確認しましたところ、/からは始まっておりませんでしたのでこちらの件については大丈夫だと思われます！
>元のファイルの文字コードが特殊 (普通こんなの使わない、といった類のもの) で、
編集したファイルを保存する際、文字コードを「UTF-8」に変更してしまいクライアントの環境で動作しなくなった、ということもあるかもしれません。
→こちらについてですが、編集したファイルを保存する際に、文字コードを「UTF-8」に変更してしまう、と言うのはどのような状況で起こってしまうのでしょうか？
また、現在のHTMLファイルの文字コードを調べる方法って何かありますでしょうか？
よろしくお願いいたします。
> 編集したファイルを保存する際に、文字コードを「UTF-8」に変更してしまう、と言うのはどのような状況で起こってしまうのでしょうか？
具体的にこれ、という明確な例が上げれないのですが、エディタの設定でそのようにしていたりすることがあるかも、とは思います。(普通はないはずですが)
> また、現在のHTMLファイルの文字コードを調べる方法って何かありますでしょうか？
Windowsの場合
https://uxmilk.jp/47131
Macの場合
http://inforati.jp/apple/mac-tips-techniques/internet-hints/how-to-fix-garbling-of-mac-safari-browser.html
先日はご回答いただきありがとうございました。
今回、先方のローカルにあるHTMLファイルを先方側のエディター（Terapad）で保存し直したところ、無事に先方のローカルでも崩れなく表示されるようになりました。
原因は判明しませんでしたが、もしかしたらnew1ro様のおっしゃるような、私のエディタで保存した際に何かファイル形式を変えてしまったという可能性がございます。そして今回先方が上書きしてまたファイル形式が元に戻ったと言う感じでしょうか。
解決へのヒントになりましたので、ベストアンサーとさせていただきました。
ありがとうございました。
あなたの回答
tips
プレビュー
