注目の投稿で画像が縮小され、歪んで表示される

皆さん、こんにちは!

いくつかの注目の投稿があり、そこでの画像の表示がかなり悪いのですが:

画質を損なわずに画像のサイズを変更する方法はありますか?

念のため、フォーラムはこちらです:https://community.elfsight.com/

よろしくお願いします!

「いいね!」 2

それはFeatured Cards componentからですか?もしそうなら、@manuelさんが手伝えるかもしれませんか

「いいね!」 4

はい、それがコンポーネントのようです。ただし、Featured Tilesコンポーネントをベースにしており、画像のリサイズに関してはコードを変更していないと思います。Topic List Thumbnailsコンポーネントでも、ぼやけたプレビューが時々表示されます。@david は、プレビューがぼやけないように画像を最適化する方法についてアドバイスがあるかもしれませんか?

「いいね!」 3

ここでサイズ定義を更新する必要があります。

そして、ここで必要な解像度のリストを更新するために計算を行ってください。

「いいね!」 4

おお.. ご指摘ありがとうございます!設定でサイズを調整できるようにしています。

既存の定義とこの柔軟性をどのように統合できるか、少し考える必要があるようです :robot:

「いいね!」 3

最も簡単なアプローチは、コード内で可能な限り大きいサイズ(おそらく500x500、および1.5倍と2倍のバリアントを含む)でコンポーネントを定義し、ブラウザが表示時にそれらを縮小するようにすることでしょう。

「いいね!」 3

Davidさん、ヒントをありがとうございます!コンポーネントについてはこれでかなり明確になりました。いずれにせよ、ブラウザが実際に何をしているのか、つまり、スケーリングされたサムネイルを選択して最終的なレイアウトサイズにリサイズしているのかをもう少し理解する必要がありそうです。前述したように、トピックリストのサムネイルでも画像がぼやけて見え、ブラウザによって結果がわずかに異なります。おそらく、テーマコードでサイズ調整を行っているためでしょう。