iPadおよびiPhoneブラウザーがサイト上の画像を回転させていますか?


13

私が今構築しているサイトで奇妙な出来事が発生しています。そこでは、イメージが想定されている方法とは90度異なって表示されますが、指定したイメージの通常の寸法は維持されます。これはiPadとiPhoneのSafariでのみ発生します。他のすべてのブラウザーにはこの問題はありません。

ここに画像の説明を入力してください

何か案は?

問題のページはここで見ることができます:http : //www.andrewpeterson.com/i-had-to-be-a-perfect-gentleman-with-the-princesses/


4
Uuuh ..確認するAppleデバイスやブラウザはありませんが、EXIF情報(特に回転)を読んでいるかもしれません。これらの画像から余分な情報をすべて削除して(少なくとも1つ、このような画像圧縮プログラムを使用してください:punypng.com)、画像を「最適化」バージョンに置き換えて、それが役立つかどうかを確認します(ブラウザに現在の画像バージョンがあることを確認し、キャッシュをクリアしてください)。
LazyOne

2
私が今まで見たことがない問題のために+1 。さらにいくつかのデータポイント:IrfanViewとPhotoshopはどちらも、Mobile WebKit / Safariのように回転した上部の画像を読み込みます。デスクトップSafariはサポートしていません。これは画像メタデータにあるという考え方をサポートしますが、そこにはたくさんありますが、Photoshopのブラウザを使用してここでそれを行っている特定のプロパティは見つかりませんでした(ただし、EXIFはあまり扱いません)。しかし、あなたに出発点を与えるべきです。@LazyOne、実際の回答として再投稿したい場合は、投票します。最初の画像をPunyPNGで実行したところ、うまくいきました。
蘇」

Thnx Su '
LazyOne

同じ問題を抱えていたので、メタデータを削除してもうまくいきました!

問題を解決しました:)メタデータを削除するプログラムを取得するのが面倒だと思う場合は、ペイントで画像を開き(Windowsに含まれます)、マークしてコピーし、新しい画像を選択し、コピーを貼り付けて保存します。

回答:


11

Uuuh ..確認するAppleデバイスやブラウザはありませんが、EXIFメタデータ(特にローテーション)を読み込んでいるようです。

この画像の1つをXnViewで開きました。画像は90度回転して表示されます。

これらの画像から余分な情報をすべて削除してみてください(少なくとも1つの画像に対して行ってください)。次のようなイメージコンプレッサーを使用します:punypng.com(またはメタデータの詳細を削除できる他のツール、または単に回転して再度保存できるツール)およびイメージを「最適化された」バージョンに置き換えます。

iPadで再度確認するときは、ブラウザに現在の画像バージョンがあることを確認して、キャッシュをクリアしてください。

PS Thnx Su '


それでした!Webブラウザに影響を与えるなんて奇妙なことです。最終的にIrfanViewを使用して修正し(ファイルを開いてメタデータなしで再保存)、すべてが正常に表示されるようになりました。ありがとう!
ギャレット


1

MS Windowsで画像が正しい向きで保存されている場合、EXIF回転メタデータを手動でオーバーライドする簡単な方法を次に示します。Windowsエクスプローラーで、画像ファイルを右クリックし、「時計回りに回転」を選択します。これを4回繰り返して画像を完全に回転させると、画像はすべてのシステムに対して正しい向きになります。その後、画像をWebサーバーにアップロードできます。


これは私にはうまくいきませんでした。おそらく、WindowsエクスプローラーはWIndows 10のメタデータを保持していますが、以前のバージョンではメタデータを維持していませんでしたか?
Mカッツ

0

これをAppleのBug Reporter経由でAppleにバグとして提出しました。これがあなたにとって重要であり、サンプルデータがある場合、問題について複数のレポートを作成しても害はありません。以下のスクリーンショットは問題を浮き彫りにし、Appleの従業員がこの投稿を一見すると、問題IDは11299426です。

一貫性のない回転動作

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.