#native_company# #native_desc#

Resizing Images with PHP and Mogrify

By John Masterson
on August 19, 2002

One of the challenges for any web development team is creating systems
that are technically robust while still being intuitive to users. It’s
especially important to keep in mind the level of technical proficiency of
the intended users of the system. We were reminded of this crucial truism
shortly after the initial launch of a site we recently built.
Our consulting division had been approached by a economic development
organization who wanted us to build a website. One of the desired features
of the site was a system that allowed their staff to upload member company
logos to be displayed on the front page of their site, as well as in a
member directory section. The intent was that businesses would send their
logos to the organization staff, and they’d use the system to insert the
new logos and descriptive text into a database. No problem, right?
Because Modwest runs PHP as a chrooted CGI, it was easy to use standard PHP
upload features to get the logos from the client’s personal computer
up to the server and into a database. (See
for the basics.) What we
originally failed to account for was the size of the uploaded images.

The Problem Unveiled

The launch of the site went nicely, and the first few logos uploaded fit
the design of the site nicely. A few weeks down the line, a business sent in
a logo that was over 800 pixels wide. Of course, as soon as the staff uploaded
it into the system, it wrecked the design of the site, as the logos were
meant to be displayed in columns that were only about 250 pixels wide. The
staff member responsible for uploading called us immediately, wondering why
our system had broken. Of course, the system was doing exactly as it was told.
Our first tactic was to suggest that the staff member resize logos to be no
more than 200 pixels wide. This suggestion may have worked if we were talking
to a graphics-savvy user, but this individual wasn’t terribly comfortable
using Windows Paint (the only graphics program they had available). So, we
needed a solution that would auto-resize photos appropriately and maintain
their original proportions to prevent any distortion.