イメージを読み込むときのイメージの縮小方法

Question

イメージを16x16で表示したいとします。しかし、私がcss（例：width：16px;）を使用してそれを行うと、画像は元のサイズで読み込まれているため、ページを読み込むのにかかる時間が遅くなります。私は、画像の幅と高さを変更するだけでなく、PHPで画像の実際のサイズを変更するのではなく、2000x2000の代わりに16x16として画像をロードする方法があるかどうか疑問に思っていました。

おかげ イアン

Answer 1

基本的に2つの画像が必要です。フルサイズのものとサムネイルサイズのもの。あなたは控えめにCSSを使用して画像のサイズを調整する必要があります。ほとんどの場合、画像を必要なサイズにリサイズする必要があります。 2000x2000サイズの画像があり、それを16x16にするためにCSSを使用すると、2000x2000サイズの画像が読み込まれます。ユーザーのブラウザでどのようにレンダリングされるかに関係なく、同じ量の帯域幅を使用します。サムネイルイメージを作成することで、ユーザーのブラウザに読み込むために必要なサイズと時間が大幅に短縮されます。

Answer 2

のErm ...ありませんか？

あなたは、500ページのエッセイを取って、文書全体を数えずに1000番目のレターを取ることができるかどうかを尋ねるようなものです。

唯一の実際の方法は、画像が16x16であることです。

Answer 3

パフォーマンス上のメリットのためにクライアントが画像のサイズを変更することはできません。クライアントが画像を圧縮できるならば、まだは圧縮する目的を破るフルサイズのオリジナルをダウンロードしなければならないでしょう。

したがって、16x16でイメージを取得する唯一の方法は、そのサイズにするか、サーバー側のスクリプトを使用してイメージのサイズを変更することです。