Create Image Thumbnails with ImageMagick
ImageMagick is, for lack of better term, magic. You can throw just about anything at it and succeed. With that in mind, I was recently using Google Page Speed to see how I could improve my website and it occurred to me I wasn't generating thumbnails for my post lists -- I was simply scaling down preview images with CSS. Certainly not the most efficient technique you've ever heard of. ImageMagick to the rescue -- now I can parse for images and generate thumbnails to make my site much faster to download!
ImageMagick is loaded with options but the syntax to generate a thumbnails is dead easy:
convert billboard.png -trim -resize 32x32 thumbnail.png
Instead of simply scaling down an image with CSS, I should be generating a thumbnail and serving that up instead. And since it's so easy to do so, there's really no reason not to!
![Create a CSS Flipping Animation]()
CSS animations are a lot of fun; the beauty of them is that through many simple properties, you can create anything from an elegant fade in to a WTF-Pixar-would-be-proud effect. One CSS effect somewhere in between is the CSS flip effect, whereby there's...
![Creating Scrolling Parallax Effects with CSS]()
Introduction
For quite a long time now websites with the so called "parallax" effect have been really popular.
In case you have not heard of this effect, it basically includes different layers of images that are moving in different directions or with different speed. This leads to a...
![Build a Slick and Simple MooTools Accordion]()
Last week I covered a smooth, subtle MooTools effect called Kwicks. Another great MooTools creation is the Accordion, which acts like...wait for it...an accordion! Now I've never been a huge Weird Al fan so this is as close to playing an accordion as...
![JavaScript Copy to Clipboard with Branding]()
I published a post a year ago detailing how you can copy to the clipboard using JavaScript. The post was very popular and why would it be? Copying content from a webpage without needing to use the default browser functions is awesome. One trend I've...
There is a
-thumbnailoption to create, you’ve guessed it, thumbnails : http://www.imagemagick.org/script/command-line-options.php#thumbnailAnd if you need to do it on the fly, here’s a chainable wrapper for GD (PHP): https://github.com/claviska/SimpleImage