Resize images outside of the browser


Do not resize images using HTML height and width attributes. Doing so sends images in their original size, wasting bandwidth and CPU power.

A PNG-24 350 x 300 px image is 41 KB. If you resized the same image file using HTML, and displayed it as a 70 x 60 px thumbnail, it would still be 41 KB, when in reality it should be no more than 3 KB! Meaning 38 KB downloaded for nothing.

The best solution is to resize images using software such as Photoshop, without using HTML.

When content added by the website’s users has no specific added value, it is best to prevent them from being able to insert images using a WYSIWYG editor e.g. CKEditor.

This best practice should only be applied if it is coherent with your project's specifications.
Under CC-By-NX-SA license