How to Best Attract Your Visitors with a SleekBox Image

  • Lesson 2 of 5
  • 06:15 min

In This Lesson You Will Learn

  • What are the key points when discussing images for your SleekBoxes.
  • How to work with images in the Sleeknote editor.
  • What types of images can you use for your SleekBoxes.

How to Best Attract Your Visitors with a SleekBox Image?

Words are processed by our short-term memory. However, when we look at images, they go into our long-term memory. This means that the knowledge is held indefinitely.

According to research from 3M, humans process visuals 60.000 times faster than text. Therefore, images are used by many marketers to best grab the attention of their audience.

Choosing the right image to best match your brand and attract the customer may be difficult. We understand your struggle and are here to help you. Thus, this article will look into how to choose the right image for your SleekBox, to best attract your visitors.

The Base When Discussing Images

Before going through some examples, let’s talk about a couple of points you should know when implementing images.

When selecting an image, put yourself in the shoes of your customers. You want to select an appropriate image for the message you are sending. Let’s image you are selling furniture on your site. Just because you like images of the mountains, it does not mean that it is relevant for your audience or your business.

The pixels matter. Use high-resolution images. You want to have a good quality image on your SleekBox, not a big blur.

Consistency is important. Your website is most likely already using specific colors, and other images. Aim to stick to one style with all of your design. Blend in your SleekBox with the other elements. Consistency sends a strong message about your business. You don’t just want to use a  bunch of random images. Trust me, it won’t look appealing.

Make sure the selected image is relevant to your brand. Remember, your company will be associated with the image by your entire audience.

Be original. Aim to make your SleekBox personalized. Instead of using stock images, try to use your own images, unique images.

And lastly, do not go overboard. Use an appropriate image size that will not be disturbing to your visitors.

Images and the Editor

The editor gives you a lot of freedom to personalize the images for your SleekBox. You can choose the position of the image element, its size, border and alignment options. You are also able to make the image the background of your SleekBox.

There are three types of images you can implement to your SleekBox design.

  1. First one is a regular image element. This type is placed in line with all the other elements.
  2. The second type is a background image. They take up the whole area of the SleekBox form.
  3. And lastly, you can implement a floating image. This gives you the option to place parts of the image outside the SleekBox frame.

Let’s take a look at a couple of examples of how images can be added to your SleekBoxes.

The first one is a Swedish travel agency called Alpresor. They are specializing on skiing and hiking vacations. Thinking both of their target audience and their brand, they have decided to go with an image of a happy skier.

Images and the Editor

To keep a consistent look on their site, they used the colors green and yellow on their SleekBox. They are visible in the call-to-action buttons and the person’s jacket.

The background of the image is transparent, thus the background color can be adjusted based on your preference in the editor. Alpresor in this instance went with a simple look and used the color white.

The image does not have to contain only human beings. It can also be a product that you are offering.

Regular Image Element

This is a sneaker store called Rezet. They are engaging their visitors with information about their popular product. Therefore, the product itself is the star of this SleekBox.

Regular Image Element

Rezet has chosen to work with an image as an element. The position of it is in this instance on the top of the SleekBox. The bottom is reserved for the text element and an call-to-action button. You can clearly see the border between the image, and the other elements as the image doesn’t contain a transparent background.

Background Image

Now you have seen both right and left positioning of an image. So let’s have a look at how a SleekBox with an image as a background looks like.

Klaus Pilgaard is the face of the Chili Klaus brand. They are specializing in spicy chili products. Almost every product has an image of him on it, and many recognize the products precisely because of that.

Thus his presence on the SleekBox is not a surprise. The positioning of the image is brilliant, as Klaus is visible where there is space for the image, and the rest is hidden behind input fields.

Background Image

The picture is unique, taken by their organization. Using your own internal pictures creates a truly personalized design.

Floating Image

At Sleeknote we do not limit your creativity. We aim to give you space for a great design creation. If you do not want to be bound to set paddings and margins, you can use a floating image in you SleekBox.

Here is Miinto, a clothing retailer. Their image is partially outside of the SleekBox, with the head and hand of the model. Working with a floating image gives you the opportunity to put wherever you want to.

Floating Image

Now you have seen how an image can be implemented with a transparent or non-transparent background. And how its position can be on the left, right, floating or even set as a background. The options in our editor are truly unlimited.

Sign up for Our Newsletter
Get Proven Marketing Strategies
Join Prominent Readers Such as:
Sign up for Our Newsletter
Get Proven Marketing Strategies
Join Prominent Readers Such as:


Are you now imagining all the possibilities of your SleekBox design? Are you bringing the creative you to life? I won’t keep you for much longer!

To wrap up, I will take you through the checklist of things you should keep in mind when selecting an image for your SleekBox one more time.

  1. Make sure the image is relevant to your audience
  2. Work with only high-resolution images
  3. Keep the design consistent
  4. The image should be relevant to your brand
  5. Aim for originality

I believe you are all set now for implementing images in your SleekBoxes.

Still Got Questions? Get In Touch And Let Us Help

If you’re looking for more information on how to use our features or want to see step-by-step guides, check out our help center.
Try Sleeknote on Your Site 👋
Start a no-commitment 7-day free trial and enjoy all Sleeknote features on your website. (No credit card needed.)