Your Cart is Empty

by Michael P. Hill September 15, 2015

One of the most popular features of Shopify themes is a homepage banners — but how do you make this increasingly common feature work for your store?

The homepage banner, sometimes also referred to as a imageshow, hero, slider, rotator or carousel typically features two or more large, dominant images that are one of the first elements a visitor sees when entering your site. Often they will feature animation or cross-fades when changing from one to the next.

But what exactly should occupy that big, important space on your homepage? Here are some tips, ideas and suggestions to consider:

Picking photos

Choosing the best photography is the logical place to start when considering options for your homepage banner, considering so many of them feature photography or other imagery as a base.

First, it’s important to remember that whatever image you chose, it should be able to maintain a clear, sharp look even at very large sizes, since homepage banners often automatically expanded to fill the entire width of the user’s browser window.

For subject matter, you’ll likely want to avoid images that are overly complex or cluttered.

Clean, simple product shots with solid color or blurred backgrounds can be a good choice for this type of application.

For a more creative spin, consider using extreme product closeups that show off your products’ quality or even a solid color or interesting pattern or background design that relates to your products or brand. If taking your own photos, consider a free stock photography site.

Finally, also be sure to consider how your image will look on mobile devices and tablets, especially in relation to any text that’s being overlayed. Some premium Shopify themes, such as those available from Out of the Sandbox, also allow the option to specially crop your imageshow background images on small screens.

Many Shopify themes also offer the option to include a video in your homepage banner. This eye-catching method is a great way to add another dimension to showcasing your products, but it’s also important to keep in mind the same points above about photos when picking a video (find out more on how to configured video in Out of the Sandbox's Parallax Shopify Theme or Retina, Responsive or Mobilia Shopify Theme).

Often the best option for videos is to buy an inexpensive stock video — these are typically well produced and some even are shot with their use in a homepage banners in mind, so look for ones that already have good negative space and contrast while providing a clean look.

Crafting text

Including text in your homepage banner can be an effective way to complement your photography. However, it’s important to make sure, when selecting an image, that there’s is adequate negative space for placing the text.

The dominant colors of the photo should provide enough contrast so that the text remains readable, as well.

Finally, when writing your text, it’s often best to keep phrases short and simple. A few carefully chosen words that add a bit of intrigue or curiosity can also be very effective. Also consider how you can break up text into headlines, subheadlines or the other elements your Shopify theme allows.

The best content

When considering your homepage banner images as a whole, there are two distinct approaches: Using the area as a promotional tool or using it as a storytelling one.

The promotional approach involves using the homepage banner to spotlight specific products, sales, specials or other content on your site. Often this content is changed frequently to prevent the site from becoming stale.

For stores with value-conscious or price sensitive customer bases or frequent new inventory, this approach can be an effective way to draw in users to delve deeper into your store.

Keep in mind, however, that using your homepage banner for this purpose often requires more frequent changeouts to prevent users from getting tired of seeing the same items, as well as because content will likely naturally become outdated.

On the other hand, some types of stores may find it more effective to use the homepage slider to tell the story behind the company and products. This can quite effectively be divided up into smaller segments, perhaps three to five, each with its own slide in the rotation.

For this approach, it’s best to break down your story into manageable segment and introduce a single idea or segment at a time, each with well crafted text and carefully selected image.

Including calls to action

The final element of an effective homepage banner is ensuring that each slide has a clear and well chosen call to action — typically a link or button. Although many Shopify themes give you the option to not have a call to action on one or more of your images, this can often be a mistake since users often equate homepage banners to being clickable.

It’s equally important to consider where you will send users when they click the call to action button or link. In the case of a slide promoting a sale, then most likely the best place to link to is the collection featuring the items.

It can be a bit trickier, however, to identify the best place to send users when a homepage slider takes on the storytelling approach. One effective technique is to link the user to a page that gives more detail about the aspect of the story in question.

This is a great way to provide more detail to those who want to know more about the subject of the slide (especially since your space is limited in the actual slide) as well as show more photographs.

It’s also fine to integrate links to relevant collections or products on this secondary page — and this technique can be especially effective in keeping the funnel slippery and slowly but effectively introducing potential customers to your brand and products.

Alternatively, you could also link the user to a collections or product page.

It’s also important to carefully word your link or button so users know exactly what to expect when they click. If it’s more information about a product, “Learn more” is a good option. For links to product pages, consider “Explore all items” or something similar.

Michael P. Hill
Michael P. Hill

Michael P. Hill is a Shopify, Shopify theme, content marketing, digital marketing and product management expert based in Chicago. Follow him on Twitter at @michaelphill or connect on LinkedIn.

Need Support?

Please don't post support questions or issues as a comment on this thread, as we may not be able to process it in a timely manner. Instead, please visit our Support Center to browse frequently asked questions or submit a support request directly to our team.

Also in Shopify Theme Blog

Meet Sandy: The latest member of our Shopify theme team
Meet Sandy: The latest member of our Shopify theme team

by Michael P. Hill February 17, 2017 0 Comments

Out of the Sandbox has added a new member to our growing team: Sandy. Sandy is a bit different than our other team members, however — it’s actually a Facebook Messenger chat bot that’s here to help point you in the right direction when you’re looking for quick support on Shopify theme issues.
Read More
'Like' us on our new Facebook page
'Like' us on our new Facebook page

by Michael P. Hill February 15, 2017 0 Comments

Out of the Sandbox is now on Facebook! Our new Facebook page will offer a steady stream of Shopify theme tips and tricks, plus the latest theme updates and even special offers. To make sure you don't miss anything, join us on Facebook by "liking" our page here.

Read More
Section by section: 16 ways to use the image with text section
Section by section: 16 ways to use the image with text section

by Michael P. Hill February 08, 2017 0 Comments

This week we continue our look at Shopify theme sections and how you can use them to create dynamic and exciting homepages. This week, we’ll take a look at the “Image with text” section, which offers a wide variety of opportunities to include content in a dynamic and flexible layout that’s also mobile friendly and doesn’t require any coding.
Read More
News & Updates

Sign up to get the latest on sales, new releases and more …