iPhone/iPadで見るとホームページの写真の向きが変わってしまう原因

ホームページのお手伝いをさせていただいているお客さんから

ホームページに載せた写真の向きがおかしくなっちゃった

という電話がありました。

そのページを私のパソコンで確認したところ、写真はまったく問題なく表示されています。

詳しく状況をうかがったところ、お客さんは iPhone でホームページを見ているとのことで、ホームページの写真も iPhone で撮影したものだそうです。

私は iPhone を持っていないので、iPad で確認したところ、たしかに写真の向きがおかしくなっています。

調べてみたところ、Orientation という Exif 情報が原因でした。

iPhone や iPad は、カメラの向きを縦にしたり横にしたり逆さにしたりして撮影したときに、あとで画面に表示したときに自動的に見やすい向きになるように Orientation という情報をJPEGファイルに格納しています。

iPhone や iPad の Safari ブラウザでもホームページを表示するときにもこの情報が使われています。

パソコンのブラウザではこの情報は使われません。

これがブラウザによる写真の向きの違いの原因でした。

下の2つの写真は両方とも右に90度回転して表示するという Orientation 情報を持つ画像ファイルです。

この記事をパソコンで見ると、ひとつめの写真は正しい向き(縦)で表示されますが、iPhone/iPad では右に90度回転しています。

ふたつめの写真をパソコンで見ると左に90度回転していますが、iPhone/iPad では正しい向きになります。

こういったややこしいことが起きないように、写真をホームページに載せるときには Orientation 情報を削除しておく必要があります。

私は 縮小専用。 というフリーソフトで写真のピクセルサイズを小さくしてからホームページで使っていますが、このソフトは Exif 情報をすべて削除してくれます。

投稿者プロフィール

対馬 俊彦魚沼情報サービス・ベクトル公式テクニカルパートナー

【日本全国対応】WordPress のサイト制作、設定、カスタマイズ、トラブルでお悩み、お困りの方、ベクトル公式テクニカルパートナーがお手伝いいたします。

Lightning / VK Blocks / VK Filter Search のサポート、カスタマイズを得意としています。

遠方からのご依頼の場合、打ち合わせ・サポートを Zoom や電子メール・電話などを併用して行わせていただきます。

オンラインレッスン形式でのホームページ制作サポートも行っています。お客様ご自身でホームページを制作・運用する上でうまくいかない部分をサポートいたします。設定やカスタマイズを手伝ってもらいたい、同時に便利な使い方や設定方法、カスタマイズのやり方も知ることができたら...という方にご好評いただいています。

デザイナー様、制作業者様のサイト制作のお手伝いも数多く行っています。難しい部分のコーディング ( PHP / CSS / jQuery ) をやってほしい、いま人手が足りない等、お仕事の依頼をお待ちしています。

ご要望をうかがった上で費用見積り（無料）を提示させていただきますので、お気軽にお問い合わせください。

メールでのお問い合わせはこちら

最新の投稿

この著者の記事一覧

• WordPress2026年1月13日WordPress コアのアコーディオンブロックと詳細ブロックを比較
• WordPress2025年12月3日WordPress 6.9 の新機能 - アコーディオンブロック
• WordPress2025年12月3日WordPress 6.9 の新機能 - 伸縮する見出しと段落
• 制作事例2025年11月26日ホームページ制作事例「有限会社星野工機」

WordPress のトラブル解決・設定・カスタマイズ

ベクトル公式テクニカルパートナー
があなたをお手伝いします

Zoom で画面共有してQ&A形式でサポートいたします。わからないところや疑問点をどんどん質問してください。その場ですぐに解決をお手伝いします。※ご希望の方にはメールでのサポートも可能です。

PHP / jQuery / CSS / アクションフック / フィルターフック のカスタマイズのご依頼も承ります。自分では思い通りにできないのでプロの力を借りたいとお考えの方、ぜひご相談ください。

ご相談・お仕事のご依頼はこちら