In the first post of this series, we talked about principles of beautiful design and website templates. However, in order to take full advantage of those ideas, you need to have images to work with and know how to use them. That’s what we’ll focus on this week: how to find, use, and share beautiful images on your website. (If you want to learn more about creating a beautiful website, you can watch the full webinar here.)
First Things First
Before you begin, think about where you’re going to find your images. You might already have a collection of quality photos. However, you probably need to at least supplement this supply with images from other sources. Two fantastic resources that can help you find thousands of free stock photos are Unsplash and Pexels. Both offer free downloads of all their images, but they do ask that you provide a quick attribution when you use the photo.
Additionally, as a reminder, you might be tempted to spend most of your time and energy on your home page images. Before you do, think about the fact that many of your viewers will come to your site from one of the internal pages. Every part of your website should be thoughtfully designed. With that said, let’s get down to the details!
How to Set a Featured Image
In WordPress, go to the settings of your page and select “Set a Featured Image.” Pick an image and click “set as featured image.”
This is all fairly simple as long as it works correctly. Unfortunately, there are a couple of pitfalls to watch for. For example, this is what can happen to a perfectly beautiful image that somehow…turned out…wonky.
This is an example of what can happen if you forget to pay attention to resolution and aspect ratio. Resolution refers to the size of an image: the number of pixels wide by the number of pixels tall. Make sure you pay attention to the photo requirements for the featured image. Often the settings will say that the picture has to be “at least” so many pixels wide by so many pixels tall. If the image is larger than the specified size, WordPress will automatically crop your photo. This often ruins the beauty of the image. In order to change this, check the photo guidelines. Using the edit tool, crop your image manually to fit the requirements precisely.
If you are still having trouble adding featured images, watch the webinar recording.
Social Media Sharing
Don’t forget to think about what your website page will look like if someone shares it on social media. The SEO tool has a special Social tab that deals with this issue, where you can set a Facebook image that will be displayed if the page is shared. Keep in mind that this can be the same image that appears at the top of the page, but it does not have to be. Although you might have to crop the image at the top of the page, you can set the whole photo to be shared on social media if you would like.
A very useful tool that helps you double-check your work is Facebook Sharing Debugger. This tool lets you see what your webpage will look like when it is shared on social media and can bring potential problems to your attention.
That’s it! Hopefully you learned about a few new resources and helpful tips that will speed you on your way as you create beauty, one webpage at a time. If you want to learn more about creating a beautiful website, watch the webinar, read last month’s post about design principles and web templates, or watch for the final post coming up next week. In the meantime, have fun with images!