Tools
Dynamic Image Resizer
The image resizer takes a JP(E)G, GIF, or PNG uploaded to https://assets.csuchico.edu and resizes it through the use of a query string. For example:
https://assets.csuchico.edu/images/example.jpg?w=100
Will deliver a version of example.jpg that has been reduced to 100 pixels wide (assuming the original is wider than 100 pixels), preserving the original aspect ratio.
A Note on Using the Resizer
Before using the image resizer, consider whether an image can be properly sized prior to uploading. While handy, the image resizer does require some extra processing time to deliver an image and is not as proficient at compressing images as something like Photoshop.
Images generated by the resizer are saved to the server so they can be delivered without regeneration - this speeds up delivery time and reduces server load, but does still require the resizer to perform some processing.
TLDR: It's better to resize and compress images before upload. Use the resizer when necessary.
Instructions
The resizer accepts 4 paramaters attached to the source image URL via query string:
w
- width (in pixels)h
- height (in pixels)quality
- compression level (JPGs only), default: 65
We'll use the CSU, Chico signature as the source for our examples:
Resize by width, maintain aspect ratio
example.jpg?w=100
This will resize the image to 100 pixels wide, maintaining the source image's aspect ratio. For example, if the source image was originally 200 x 400 (1:2), the above query string would generate a 100 x 200 (1:2) image.
Resize by height, maintain aspect ratio
example.jpg?h=100
This will resize the image to 100 pixels high, maintaining the source image's aspect ratio.
Compression level
example.jpg?quality=50
The quality parameter only applies to JP(E)Gs and will be ignored for PNGs and GIFs if set. The default value is 65. Higher values means smaller file sizes, but more lower quality. Lower values mean larger file sizes, but higher quality. Compress as highly as possible while maintaining an acceptable level of image quality. When in doubt, don't set this parameter.
Multiple parameters
example.jpg?w=300&quality=50