Do you want to use great quality images on your website?
Images can act to improve user experience, engagement and overall conversion of your website and blog posts. Or, they can make your website appear unprofessional and slow loading.
In this epic post I am going to help you find great images and show you how to best display them on your website.
Here's what we're going to cover
Where To Find Images For Your Website
Quality, professional images look great. But, you can't just use any image you find!
How To Create Your Own Images For Your Website
Are you the budding photographer? Here are a few tips for taking your own website photos.
How To Optimise Your Website Photo's For Your Website
Now you have your photos or images can't you just upload them and job done? Absolutely not! Here's what to do next.
Where To Find Images For Your Website
High quality images can increase the visual appeal of your website and improve user experience. I am going to help you keep website costs low by showing you how to find free images for your website.
Images are not something that you can just grab from a Google search and use on your website. Most of the “good” images you will see that fit your specific needs are not free. People get their own images and then put copyrights on them. If you do copy them, your SEO rating may fall rapidly due to copyright violations. And, you may find yourself with a hefty fine!
So how does one go about finding good images for your website?
You must find images that state explicitly that they are free to use, which is why I recommend sticking to the methods below.
Choosing the right images
To be able to make an impact, you need to find something that truly represents your brand. The 'brand' is very important for any website or business that wants to have a long-term presence in people’s lives. It is the unique feeling that any person gets when they see a product or any other material from a particular company.
Having that associative effect is what you have to aim for when finding images. Photos are the most obvious part of any website’s content and stand out immediately. So, make sure that whatever image you use is in line with what your website is all about. Where can we find images for our website?
Option One: Stock Images
There are many different sites that provide free stock images that you can use for a range of different applications. These images are the result of a collaboration between countless people around the world. Photographers post these on these websites and allow them to be used freely. In many instances they ask to be given credit, although this isn’t always compulsory.
There are many free stock image websites that you can use.
Unsplash, Pexels or Pixabay, are a couple that come to mind and have a great and continuously growing collection of photos. The images you will find here are all very high quality. High quality images greatly enhance the professionalism of your website.
I really like Canva for high quality photographs. Many are free although they do have a paid plan too.
Image size?
When you have found the perfect image, you will be given the option to decide what size you want to download them. Before you do this, you must consider what you want to use the image for on your website. If you intend using it on a background image that stretches across the width of the screen, then you need to ensure it is large enough.
I would recommend that your image should be downloaded at least 1600 pixels wide by 900 pixels tall to ensure it looks good when used on a background section.
If you need a smaller sized image, then I would still recommend downloading it at, at least, the above size but then resize it as you need to. Then you can keep the original size and a smaller size. There are great free tools like this one that can help you resize images.
Whatever image you use, you must make sure it displays the correct emotion. The more engaging an image is, the more impact it will have on the viewer. It should be in line with the tone of your content as well. If you are a fun and playful website, then the image should be the same too. The same is true for any other emotion as well, be it serious, professional, comedic, intriguing, or any of the countless other tones/emotions.
Option Two: Professional Photographer
If you sell products like physical items or clothing then hiring a professional, or at least learning to create very professional looking product photographs might be the best option for you.
Can you imagine visiting an online clothing store where there are unprofessional photos, with poor lighting and photo quality is low. Would you be likely to purchase a product showcased in this fashion?
Once you have reached a point where you feel like you can spend money on your website’s aesthetics, hiring a professional photographer should be on your list.
Having professionally taken photos that directly focus on your products can have a huge impact on your reputation. When people see professionally taken photos of a product, they feel that you are serious about your work.
Get The Website Foundations Right!
Free Online Video Course.
Let me show you the basics of how to build a website!
Create Your Own Images For Your Website
The good news is that you don’t need to become a professional photographer; neither do you need expensive camera equipment to take high quality and professional photos. You can take great looking images with your Smartphone’s camera with just some basic tricks.
1. Don't Underestimate the power of natural light
A camera’s flash can do more damage to your photos than good.
The flash on your phone’s camera is an LED light that can produce weird colours on your pictures. This is why you take some photos and wonder where all the funny-looking hues are coming from. They’re the product of the LED light. So, instead of using the flash, try to get natural sources of light.
Whether indoor or outdoor, you can still use natural light when taking your pictures. For indoor photo shoots, look for a bright spot around the window. A note of caution though - watch out for the shadows. Make sure you have the source of light in front of you and not behind.
For outdoor pictures, watch out for the time of the day. Mid-morning and late afternoon can be perfect for getting the best light sources for your photo shoots.
2. Invest In Some Basic Equipment
Professional-looking photos may help attract your target audience and taking them requires some basic equipment. A tripod can make a significant difference to the quality of your photos. With a tripod, you can have your Smartphone or camera permanently and absolutely still throughout the course of the shots. A tripod does not have to be expensive.
I have the one you see in the picture below and you can purchase it through Amazon from here.
3. Basic Editing
Your pictures might already look amazing but there are a few free or nearly free photo editors out there. Some of the key things to adjust are:
Adjust sharpness, brightness and white balance if needed
Crop the photos to focus on the subject
Eliminate distracting components
4. Focus on the subject
Whether you’re taking a photo of a product or a person, you have to keep the subject in focus. Make sure that you can see the details of the subject without necessarily being too close. Being too close may make it impossible for you to crop the photos if you need to. If you are using a Smartphone or digital camera, check the viewfinder screen to utilize the focus box.
One last tip. If you are using a smart phone to take photos check the settings. Make sure you are taking the photos in the best, highest resolution possible. This might lead to a large file size but we will discuss compression and optimization next.
How to optimise your website photos
Image optimisation is essential for website loading times and Search Engine Optimisation. Kraken.io is a free tool that is super easy to use. It is the first thing I do when a client sends me a new photograph they want uploaded to their website.
If you would rather watch a video, here is me walking you through how to optimise your website images.
Why You Should Optimise Your Website Images
The two main reasons you should optimise your website images are: increase the speed of your website and to improve your Search Engine Optimisation. We will look at these two, closely linked, reasons in more details.
Increase the speed of your website
Previous generations had to search through books and ask people (can you imagine) for the answer to questions. Today we expect the answer to even the most trivial of questions instantaneously. What does this mean if you are creating a website?
Browsers will not hang around for a slow loading web page. They will click back and go to the next option, probably your competitor.
Not only have you lost a potential customer but you have increased the bounce rate of your website (the bounce rate is the number of people who go to your website and quickly leave again).
If they do happen to hang around and wait for your site to load they probably won't come away from your website having had the best user experience. Especially if all of your web pages load slowly. This is not leaving a good impression!
Bounce rate and user experience impact Search Engine Optimization or SEO. Which leads us to my next point.
Improve Search Engine Optimisation (SEO)
In the most basic sense Search Engine Optimisation is how likely Google is to show your website in the search results for a given query. This is important!
If Google doesn't think you will give users the answers they need, or provide them with a good user experience then it simply won't put your site in a search result.
One way to improve user experience, reduce bounce rate and become found in a Google search is to optimise your images. Here is my blog on How To Be Found On Google.
What is Image optimisation?
Before we look at how to optimise our images I want to briefly describe what image optimisation is. I will keep it as simple as possible.
There are two ways we can optimise our images, image compression and image resizing.
Image Compression
When you take a photo on your smart phone there is a corresponding image file that contains a lot of information that no one sees. This could include the date and time the photo was taken, the location, camera information or the photo resolution.
When you upload this image to your website, you also upload this file of information. A website visitor has to download that same information to view the image on the web page. This makes your page load slower than it might otherwise have done and if you have a number of poorly optimised images this could add up to quite a few seconds.
Image optimisation in simple terms, strips away that excess information allowing the web page to load quicker. It also helps to better 'organise' some of the other information to further reduce the file size. My favourite tool for this is Kraken.io, which I will show you how to use further down this post.
Image Resizing
If you use a free tool like Pixabay to find beautiful, professional photos for your website then you get to choose the size of the image that you download. I always choose the file size in and around 1920 pixels.
This should be big enough for most purposes. For example, if you wish to use it on a background section, it would want to be large enough to reach the whole way across the screen. You can downsize an image without affecting the quality (depending on the tool you use) however trying to increase the size of an image could produce a poor quality image.
In order to help your page load as fast as possible it's recommended that you resize your image to the size you actually need it.
What size do you really need it? To find the size of an image on any website, including your own, you need to go to that website, right click and select Inspect. This will bring a whole bunch of complicated looking code on the right hand side of your screen.
If you hover your mouse over certain parts of this code you will see those elements highlighted on the actual web page. This will provide you with certain information including the size.
Find the image in the code and you will see what size it is, giving you an idea of what size an image you need for your website.
How to optimize your images using Kraken.io
Let's move on to how you can quickly and easily optimise your website photos using Kraken.io, decreasing website loading speed times and improving SEO.
Step 1. Go to the website Kraken.io
Step 2. Click on Try Free Web Interface
Step 3: Click on 'Click to upload or drag and drop individual images here' where you can upload your images from the files on your computer.
Step 4. Observe the savings in file size. You won't always see this size of a saving but I find it is still worth using this process.
Step 5. Click on Download File then right click and Save Image As to put your new optimised image in a file on your computer. Ready to be uploaded to your website.
If you are using a lot of images, like I have done in this blog post you can upload all of your images first then download them all in one go to save time.
Final Thoughts
Optimising your website images is essential to having a quick loading, professional and searchable website. If you are creating your own website then this should be part of that process. Another process you may be thinking about if you want to create your own website is your business logo. Logo's don't need to be expensive. Read about how to create a free logo in this blog post.
If you are finding or taking your own images then sending them to a web designer/developer who is creating your site, optimising them first will save him or her time and work and speed up the process. I'm sure they will be very grateful!
You now have all the information you need to find and display quality images on your website.
Go forth and create an amazing website!
Want To Build An Amazing Website The Easy Way?
Take the Build Your Amazing Website online video course.
Natalie Strachan
Dietitian
“Thanks so much for everything. It's great to have a 'proper' website that I can update myself.”