How to Create Stunning Images for Your Website & Blog

Learn how to create website images & graphics without Photoshop. A list of helpful online tools for creating your website/blog visuals for beginners.

Creating website visuals for non-designers

Adobe Photoshop is the industry standard that most professional web designers use to create and edit all those perfectly designed images embedded on their websites.

However, the average small business owner typically doesn't have a subscription for PhotoShop or even know how to use it. While we love Adobe Photoshop ourselves and do encourage you to try it out, there are several alternative tools you (as a beginner and non-designer) can use to create stunning images for your website and blog.

Creating decent images for your website/blog is actually easier than you may think. But first, let’s talk about the importance of website visuals (in case you’re tempted to just leave those default stock images that come with the website template you may already be using)!

The Importance of Website Visuals

When you walk through Times Square, there is no shortage of giant, attention-grabbing images dancing around on screens larger than some people’s homes. This is because marketers know that we humans are visual creatures and that our brains process images 60,000 times faster than text.

Aside from our marketing budgets, we are not so different from these brands – we are competing for the mind share of consumers that are inundated with messages and content from the moment they wake up to the minute they go to sleep.

How do we increase our odds to stand out among all the noise? Take a page from the marketer’s playbook and use visuals to communicate your point and bring your website content to life.

Imagine this article without any pictures! It would still be an inspiring piece of journalism I’m sure, but would it have the same effect? Probably not. Outside of looking pretty, adding supporting visuals to your website content offers numerous benefits.

Benefits of Website Visuals

  • Help readers understand your message – our brains process images 60,000 times faster than text
  • Keeps people reading — Increases engagement and keeps skimmers skimming
  • Increased likelihood of social visits — adding a visual means that when your content is shared on social networks there is a visual to go with it, increasing the likelihood that people will click through to your website
  • More shares — Gives people another reason to share your website (via Pinterest)

That’s Great, but What’s a Non-designer to Do?

Now that you know how important visuals are, how do you go about creating your own visuals if you’re not a pro who has mad skills in Photoshop? Fortunately, there are plenty of online tools that can help you create attractive, professional-looking visuals to use on your website.

5 Popular Website Visual Tools for Non-Designers

Ok, so now let's get to the important part – the tools you can use to create your images! Below we’ve rounded up some of our favorite resources.

1. Snappa

If you need an online graphic and ease of use is essential for you, Snappa.com should be on your shortlist! You can find a template for pretty much any online platform or social network like Facebook, Instagram, LinkedIn, Youtube, etc.
The free plan allows 3 downloads per month, to increase this limit you can also opt for their $10/month premium tier. With the paid plan you can also upload custom fonts and remove image backgrounds.

snappa

2. Visme

Visme is a really powerful tool that you can use to create all sorts of media for your website, social media and email marketing campaigns. With its drag&drop visual editor it's possible to create resources such as infographics, presentations, social media banners and even interactive charts and maps to visually display data points.

Files can be downloaded as PNG and JPG images, PDF or HTML files, and there is even a free plan available so the platform can be trialed for free.

Visme graphic design tool

3. Canva

Boasting testimonials like “Canva enables anyone to become a designer” and “The easiest design program in the world”, it’s easy to see why Canva is a great tool for non-designers. Canva offers templates for you to start with or lets you start from scratch. They also offer a great selection of stock photos, design elements, and fonts. Below is a screenshot showing a couple of starter templates, which you could easily jump into and customize for your own website:

Website visual tools for non-designers - Canva

4. Pablo

Pablo is a quicker, more streamlined version of Canva. Upload your photo, select the size of your image, select the text you want on top of the image, and edit the photo if you want. The End result is a quick, clean-looking image to use on your website.

Website visual tools for non-designers - Pablo

5. Easel.ly

Easel.ly is an infographic generation tool that is highly customizable and comes with many templates to start you off. This is a great way to create supporting visuals or to communicate a complex idea with your website readers.

FotoJet

FotoJet is a robust online tool for graphic design, photo editing, and photo collage. It's very easy to use and make your own graphics. Take these steps:

  1. Open FotoJet and select a template under the design mode.
  2. Upload your own photos.
  3. Customize the design by fixing your images, adding text or clipart, etc.
  4. Save and use.

It's simple and effective way to quickly and easily make your own graphics without any professional design skills.

6. Over

www.madewithover.com is a mobile app that allows you to overlay images and visuals on top of your images. The interface is extremely easy to use, making it a great way to create a quick, professional looking visual in a pinch. The only downside is that you'll need to create your images on your phone or tablet. There is no desktop version.

Website visual tools for non-designers - Over

Using GIFs to Enhance Your Visuals

Whether you pronounce it JIF or GIF, these visual animations can be really powerful in getting your message across. You could create a GIF by either combining a series of photos or by converting a video file into GIF format. Once created, a GIF file can be placed in your blog posts, websites, social media posts, or even in your product pages.

Here are some compelling reasons to choose GIF visuals in your content:

  • Universally accepted – Since its inception in 1987, GIFs has been universally supported by all major browsers and devices without the need for additional plugins. This means you can be 100% sure your audience can consume it.
  • Great for storytelling – GIFs are great for storytelling because they can summarize a feeling or a point that you are trying to make.
  • Funny & shareable – There is a reason why netizens share millions of GIFs every day. They are easy to share on any device, plus they tend to be funny in nature. People love sharing content that is funny and easy to digest. GIF is the perfect medium for that.
  • Keep it small & cheap – The last thing you want in your content is a bulky video that is going to slow down your servers or send your visitors to YouTube (they won’t come back to your site after they find those cat videos!). Instead, turn your videos into small GIFs. They are small in size, which means they are easy to host and consume.
  • Easy to make – Making a GIF is super easy and fun. All you need is a series of images or a youtube clip as your source.
Making an animated GIF with GIF Maker
A screenshot showcasing the creation of an animated GIF with GIF Maker, a free online tool you can use to make your own animated GIFs.

Now that you understand the value of including GIFs in your content, here are few tips to keep in mind when making them:

  • Keep it short – The ideal length is 3 to 5 seconds.
  • Make it loop – Make it seamlessly loop by adjusting the start time and duration sliders
  • GIF worthiness – Find the perfect moment in your Video by adjusting the start time.
  • Match it with content – Whether it’s a high five or an eye roll, make sure it’s the reaction you want from your audience.

Animated GIF example

Using Stock Photos to Enhance Your Visuals

Most images found on websites or blogs require an existing photo as a base. For example, if you're creating website visuals for your bakery business, you may want to take a nice photograph of your bakery store and upload it to one of the above tools and then start editing it. From there, you can add the finishing touches, making the visual look perfect. However, depending on what you need and the type of business you run, you may want to look into using stock photos to enhance your website visuals. We’ve also included a few of our favorite places to go to find great quality stock photos:

Did we miss your favorite tool? Have you used any of these tools on your site? Let us know and share links in the comments below!

About the author


  • Casey Davenport
  • Casey Davenport is an experienced internet marketer who has worked with many brands to develop successful digital analytics, search engine optimization, user experience, paid search, social media marketing, and retargeting strategies. She currently heads Digital Strategy for RocketBike Marketing out of Portsmouth, VA. When she’s not keeping up with the latest in digital trends, Casey enjoys running, reading, & eating tacos.

2 comments


Leave a Reply

author

This site uses Akismet to reduce spam. Learn how your comment data is processed.

  • Rob Watson

    Casey, great article. We love Canva over here at Webidextrous.com. It saves us a lot of time. I noticed that the dollarphotoclub.com site is now part of Adobe Stock. At least that’s what the popup says on their site now.

    What do you think are the sources for all those “free” photos? I have worked at a publishing company and we always took great care to ensure that every photo was attributed or paid for. I like to try to do the same at Webidextrous.com, but it’s hard to source them sometimes.

  • Gene Briones

    I also use Canva, which in my opinion, is a drag and drop version of Photoshop. Although it doesn’t have Photoshop’s advanced features, Canva is perfect for creating banners and other graphics which usually take long to create. Also, check out Gimp, an image manipulation software for Mac, Windows, and Linux. Gimp nearly has all the features of Photoshop, allowing you to edit photos and design layouts for websites. It’s also free. Gimp is for photo editing and Canva is for designing banners and templates.

Please help us stay funded. Purchase a product through our site and we may receive a commission for the referral! Learn more.