Image Tasks for a Website Content Manager
Articles about Planning Images


The life cycle of a website has need of many skills. The web developer gets all the attention, but development only really involved at the beginning and when new features or rebuilding is needed. The real hero of a website is the Content Manager. Content is the words, the images and the organization of the website.

Working with images is, in itself a major task that involves both 1) choosing the best images to illustrate the text and 2) manipulating those images to best convey the message.

Basic Website Image Tasks

1. Resizing images

This simple image manipulation project required several steps, the first was to resize the image.

Now-a-days, we can reasonably assume that platforms will take care of image resizing for us. Facebook, WordPress, etc. all have internal image functions that we had to do in photo manipulation software, not so many years ago. It was common knowledge that increasing the size of a small photo would make it blurry, but careful use of the Sharpen tool, small size increases could be done passably well.

Sizing images down was less prone to blurriness, but again, the Sharpen tool was needed to retain image detail. It feels strange to not have to train my clients in resizing with multiple steps after so many years of it taking 10 minutes to resize an image with good results.

But, there is still image resizing that needs to be done. For the image on the right, the first task was to resize the original stock photo from 5616px x 3744px to 315px x 210px.

2. Cropping

Cropping is taking a portion of an image that suits a specific need.Cropping can turn an image with an indistinct message into an image with a distinct message.

One time I took a photo of a therapeutic hot tub for a massage client. ( Let it be known that I’m a lousy photographer. ) The whole tub area was dark because of light streaming through a lovely stained glass window. The only part of the photo that was salvageable was the window. So, I cropped it out of the photo and had something I could use for the website!

The banner on most of these pages is cropped to 1500px x 250px from a larger stock photography image. Choosing an image that maintains its message with such a narrow crop is challenging. Some images just don’t work, even though they are excellent images in the original size.

3. Mixing Elements

The Business Topics image combines 3 elements 1) black background, 2) text, 3) a photo. Each of these elements takes its own steps. To accomplish this task requires the use of the Layers function in a graphic manipulation program.

4. Knowing When to Use CSS Code

Many of the imaging tasks that were done with graphic software in the 1990s and 2000s, are now done with CSS3. These tasks include borders with rounded corners, dropshadows, opacity, etc. While these effects can also still be done with imaging software, using CSS code means that the image can be shared with social media and retain it’s original format. The effects exist only in the page with the CSS code.

Leave a Reply

Your email address will not be published. Required fields are marked *