iPhoneだけブログ写真の向きがおかしい
ウェブサイトのブログに写真をアップした際にパソコンで見た時には普通に表示されている。
自分のスマートフォン(Android)で見ても大丈夫。
でも友達から写真の縦横がひっくり返っていると指摘を受けた経験ないでしょうか。
よくよく聞いてみると友達はiPhoneから見ているようです。ではiPhoneが原因?
しかし同じ画像をSNSにあげているけどその際はiPhoneから見ても向きが正しくなっている。何故?
結論としてはExif情報のorientation属性が関係しているようです。
Exif(イグジフ)情報とは
見慣れない言葉が出てきたのでご紹介します。
Exif(イグジフ)情報は簡単に言うとデジカメで撮影した時に記録される詳細データといった内容です。
具体的には
- 撮影日時
- 撮影機器のメーカー名
- 撮影機器のモデル名
- 画像全体の解像度
- 水平・垂直方向の単位あたり解像度
- 撮影方向
- シャッター速度
- 絞り(F値)
- ISO感度
- 測光モード
- フラッシュの有無
- 露光補正ステップ値
- 焦点距離
- GPS情報
等々といった情報です。
参考:Exchangeable image file format(wiki)
パソコンでしたら画像を右クリックしてプロパティ→詳細から確認できます。
このExif情報が入ることで写真の管理などもとても便利になりました。
フィルム式のカメラと比べてデジタルカメラは消去も簡単ですし、枚数(容量)も実質無制限といっていいほど撮れるので枚数が膨大になり後々の管理も大変ですがExif情報をもとにまとめることもできます。
但し、Exif情報には危険性もはらんでいるので注意も必要です。こちら危険性は別途ご紹介します。
カメラの向きを記録するExif情報のorientation属性
Exif情報の一つにorientation属性というものがあります。
orientation属性はiPhoneで写真撮影した時にその時の撮影のカメラの向きを記録してくれるというものです。
例えば、ホームボタンが下にある場合(普通の縦持ち)に撮影した時はOrientation属性が6(Rotate 90 CW)と記録され、時計回りに90度回転されます。
横持ちスタイルでの撮影でホームボタンが左の場合は3(Rotate 180)180度回転。
横持ちスタイルでの撮影でホームボタンが右の場合は1(Normal)そのまま、となります。
Androidでは大丈夫でもiphoneでは画像の縦横がおかしい原因
今回iphoneで見たときに画像が縦横おかしくなってしまうのはこちらのorientation属性が原因の可能性があります。
ウェブサイトを確認する端末がiphoneの場合、撮影時に記録されたorientation属性をそのまま読み取るので画像によっては、縦横がおかしくなってしまいます。
Android端末の場合はorientation属性を読み取らないので影響を受けないようです。
SNSでは大丈夫だけどウェブサイトでは画像の縦横がおかしい
iphoneに原因の可能性があるというのは分かりましたが、では同じ画像をSNSにアップした際には大丈夫だけどもウェブサイトでは画像の縦横がおかしくなってしまうというのは何故でしょうか。
SNSといってもフェイスブック、ツイッター、ライン、インスタグラム等色々な種類のサービスがありますが、これら主なSNSではプライバシーに配慮してかExif情報が自動的に削除されるように設定されています。
なので縦横画像がおかしくならずあまり気にする必要はありませんが、ウェブサイトのブログでワードプレスを使用している場合はExif情報の自動削除に対応していないので個別対応が必要になります。
参考:ツイッターよくある質問
参考:主なSNSやブログサービスでのExif対応状況
ワードプレス Exif情報自動削除プラグインの導入で解決
iphoneでも横持ちスタイルホームボタン右側で撮影した画像なら問題なさそうですが、縦撮り画像を使いたい場合もありますし、Exif情報が原因の場合、そのまま残していてもリスクがある場合があるのでExif情報を削除しましょう。
ワードプレスの場合一括で対応できるプラグインがあります。
EWWW Image Optimizer
ワードプレスのバージョン等やサーバー環境によって導入できるできないもあるので導入出来ない場合は別のプラグイン等を試してみて下さい。
ios-images-fixer
Exif-Remove-ImageMagick
参考:EWWW Image Optimizer プラグインの導入方法
これらはプラグイン導入後の画像から適用されるので既にアップされている画像に関しては再度アップし直さないといけないこと注意です。
普段AndroidとiPhone両方で確認することがあまり無いので気づきにくいですがもしかしたら画像の縦横が意図せずひっくり返っているかもしれません。
一度確認してみましょう。