ワードプレスで画像を配置するとデバイスによって画像がボケる現象がありました。
ワードプレスで画像を配置すると以下のようにclassが指定されます。
これはテーマにより異なるのか、site-originとかのplug-inの仕様なのか。
<img class="alignnone size-full wp-image-20031" src="～">
この表示されているページの”ページのソースを表示”で生成されたコードを見ると、このように長いコードになっていました。
※見やすいように適宜改行をいれてます
画像のソースが複数あり、末尾にサイズらしきものが追加されています。
このためなのか、表示画像が小さい画像を拡大したようにボケた状態になってしまっていました。
<img data-attachment-id="20031"
data-permalink="http://example.com/course/art/image"
data-orig-file="https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?fit=1200%2C480"
data-orig-size="1200,480"
data-comments-opened="0"
data-image-meta="{"aperture":"0","credit":"","camera":"","caption":"","created_timestamp":"0","copyright":"","focal_length":"0","iso":"0","shutter_speed":"0","title":"","orientation":"0"}"
data-image-title="image"
data-image-description=""
data-medium-file="https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?fit=300%2C120"
data-large-file="https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?fit=800%2C320"
class="alignnone size-full wp-image-20031"
style="width: 1200px!important;"
src="https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?resize=1170%2C468" alt="スケジュール" width="1200" height="480"
srcset="https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?w=1200 1200w,
https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?resize=300%2C120 300w,
https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?resize=768%2C307 768w,
https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?resize=800%2C320 800w,
https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?resize=830%2C332 830w,
https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?resize=230%2C92 230w,
https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?resize=350%2C140 350w,
https://i1.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?resize=480%2C192 480w"
sizes="(max-width: 1170px) 100vw, 1170px">
クラスを外すと末尾の変数はついていますが、ソースは一種類になりました。
<img src="https://i0.wp.com/example.com/wp/wp-content/uploads/2018/02/image.png?resize=1160%2C480" alt="○○○○" width="1160" height="480">
ワードプレスフォーラムなどでは同様な現象が見当たらなかったのですが、もしかして同じように悩んでる人のお役に立てばと。
対処療法ですが。
今は調べる気力がないけど、あとで理由を調べねば。