Ask a web design question!

Rosaleen asks…

Hello, I’m creating a professional training website where one of the pages will be dedicated to the bios of the trainers. What size and resolution photos should I ask the trainers to send me? Thanks in advance for any advice.

Kristy Lee answers…

The answer to this question is a bit tricky, as the different sizes will look better or worse depending on the real estate you are working with. Generally, images come in pixels. Pixels are a unit of measurement that is standard amongst graphics. A good thumbnail is 150 pixels high and 150 pixels wide. If you want something a bit bigger and clearer, 300px x 300px is also a good size.

To give you an example, see the photo on the left sidebar of me wearing a cowboy hat? That photo is 250px wide and 140 pixels high. I chose this size because it was the size of my sidebar. If you are putting the photo within the body of the content, you have more flexibility and more room so I would probably go with 300px wide.

Secondly, you don’t necessarily need a square image. Most photos are rectangle shaped and it is customary to design according to the width. So if you designate that you want photos of 300px wide, the bio holder can choose the height based on the aspect ratio of the photo.

In regards to resolution, as long as the image is clear to the naked eye, you are fine. I wouldn’t worry too much about it. Because these images are smaller and will be the exact size you need, resolution is less of a factor. If you were adding photos to a gallery or using them for artwork, it would make a difference. But in this case, it is not so important.

The main objective here is that the photo adds to the content without dominating the design. You won’t want your photo to take over the page and get in the way of other content! Nor do you want it to be so small you have to strain to see it.

Lastly, keep in mind that search engines cannot read images or text on images. Don’t forget to add alt tags to your images with your keywords and add good on page text for those search engines!

Up Next

Related Insights

How To Take Better Photos For Your Website & Social Media

Here are some photography tips specifically tailored toward business leaders who use iPhones! High-quality photography is important for every website and social media page, but what exactly makes incredible iPhone photography? Although mastering photographic moments is something that challenges even the most experienced professionals on a day-by-day basis, business leaders...

Client Email Communications & How To Update Your Email Security

Several Tandem Design Lab clients have recently experienced email difficulties, so here’s how to fix these issues! We’ve recently been hearing from some of our clients about how their email accounts are rejecting other people’s emails and kicking messages back to senders. This is an unfortunate communication mishap for any...

Colorado’s New Accessibility Compliance Law

The state of Colorado is leading the way in website accessibility. Colorado is taking the right to equal access to web content seriously by making it easier to prosecute agencies that don’t provide equal access to the information or services obtained on the internet.