解決済み
Question

画像サイズ(記事のデザイン・記事幅)について

  • 賃貸トラブルたすけ隊【公式】
  • JINR→カスタマイズ→記事のデザイン→記事幅

    サイズが680か740を選べますが、2カラムの時には選択したサイズの画像幅を最大で16:9等の画像を使うことが理想という考えに間違いないでしょうか?

    スマホ→ヴィジット→ハンバーガーメニューの幅と3カラムのサイズも教えてもらえるとありがたいです。

    EWWW Image Optimizerも使用していますが作成する段階でサイズを決めたいと思い、よろしくお願いします。

    問題となるページ : https://t-toraburu.com/
    • WP 6.1系
    • PHP 8.1
    • JIN:R 1.0.8
    • Conoha Wing
    • GoogleChrome
    • Windows10
    2023/03/08 08:31
  • Ryota0101

    こんにちは!Ryotaです。

    >サイズが680か740を選べますが、2カラムの時には選択したサイズの画像幅を最 >大で16:9等の画像を使うことが理想という考えに間違いないでしょうか?

    これは何を第一にするのかによって変わるかと思います。
    例えば「ページの表示速度」を第一にするのであれば、表示幅で画像を設定するのが一番いいのでアイキャッチは「680pxか740px」で作って表示するのが一番綺麗だと思います。

    ただ、サイト全体はどうしても綺麗ではなくなる可能性があります。
    RetinaディスプレイやWQHD+などの液晶ディスプレイではどうしても見劣りすることがあるのでそこだけは注意が必要です。
    最近のスマホの解像度は結構上がっているので、気になるようでしたら最低1000px前後は確保しておいた方が良いかもしれません。

    >スマホ→ヴィジット→ハンバーガーメニューの幅と3カラムのサイズ
    すいません、これはどこのことでしょうか?
    詳細をもう少し教えていただけると嬉しいです。

    2023/03/08 14:09
  • 賃貸トラブルたすけ隊【公式】

    先のアドバイスの内容の通り、スマホでも高画質やアイパッドなどを考慮して画像の質を使用する場所で作成するサイズを変更しする予定でTOPなどは1120×〇で統一し、アイキャッチ以降は全て740で統一作成を検討してます。

    740のアスペクト値は416で間違いないでしょうか?

    スマホだけで3ガラムの正方形でしか使わないアイコン画像の場合、150×150かもっと適したサイズがあるのかを確認したかったです。

    2023/03/08 16:05
  • 賃貸トラブルたすけ隊【公式】

    趣旨としては、HPのCLSの値が悪く、改善を模索しております。

    新しい吹き出しやリッチメニューのスクロールなどでCLSが遅くなっていると表示されるのですが、画像以外で改善策はありませんでしょうか?

    2023/03/10 08:33
  • Ryota0101

    ご連絡遅くなりました。

    >先のアドバイスの内容の通り、スマホでも高画質やアイパッドなどを考慮して画像の質を使用する場所で作成するサイズを変更しする予定でTOPなどは1120×〇で統一し、アイキャッチ以降は全て740で統一作成を検討してます。
    740のアスペクト値は416で間違いないでしょうか?

    はい、大丈夫だと思います。

    >スマホだけで3ガラムの正方形でしか使わないアイコン画像の場合、150×150かもっと適したサイズがあるのかを確認したかったです。

    150×150で問題ないかと思います。

    >趣旨としては、HPのCLSの値が悪く、改善を模索しております。
    新しい吹き出しやリッチメニューのスクロールなどでCLSが遅くなっていると表示されるのですが、画像以外で改善策はありませんでしょうか?

    可能性として考えられるのは「広告の停止」かと思います。
    CLSは「Webページを表示した際に生じるレイアウトの崩れを示す指標」なので、表示時もしくはスクロール時の動きをできるだけなくす必要があります。

    CLS対策で画像サイズにwidthやheightを指定するのは画像が表示される前にあらかじめ値を指定しておくことでレイアウト崩れをなくすためですね!

    同じ考え方で今設定している広告などもレイアウト崩れを起こしていることにもなるので、CLSを意識するのであれば無くしたほうが良いかと思います。
    ただ、収益との兼ね合いもあるかと思いますのでご判断はおまかせします。

    2023/03/12 11:19
CLOSE