Imagine going into a commercial establishment, maybe a 5-star hotel or a restaurant. You somehow expect to be greeted by an attendant who will then professionally inform you of any important or special message, or any promotion they may have. They may also offer assistance like checking your booking. You may also want that person to be respectful when you say, “I’m okay. Thanks!” so you can freely explore the premises on your own.

Imagine having someone who could do that for your website visitors. Well, guess what, that’s what a splash page does for you. With this idea in mind, let’s see a splash page definition, why to use it, its main content, and finally some splash page examples.

What is a Splash Page?

A splash page is an introductory page that your visitors see before they consume any content on your website. It contains a specific message to show visitors before they check the page's content. It can be a warning, a welcome message, a promotion, a disclaimer, etc.

Imagine it as a gatekeeper or a front desk receptionist that ‘greets’, inform, and determine your visitor needs so that they can be redirected to the appropriate department or destination. A splash page can also help determine if there is any access restriction to your website.

Any business establishment that seeks to attract more visitors and retain them should have pleasant receptionists. Your website can also do that with the help of a creative and well-done splash page.

Splash Page vs Landing Page

What is the difference between a splash page and a landing page? We can speak about 3 things that differentiate each other: goal, length, and design focus.

A landing page is a webpage that is dedicated to and focuses on advertising and marketing. Its goal is conversion, to make visitors act on something which is more known as a CTA or Call-to-Action. The content can be lengthy depending on the copy or information on what the page is trying to advocate.

Splash Page Example

A splash page may be used to promote or inform about something, but it differentiates from a landing page by its goal and length. A CTA (Call To Action) is not necessary for a splash page, and if there is any marketing content, it will be brief and direct.

Squeeze Page vs Splash Page

A squeeze page has a single intent or goal: to compel your visitors to provide their email addresses. This can be done by offering something that is highly valuable in exchange for visitors’ information. Same with a splash page, it also has to be direct to the point and the design should be focused on the CTA.

A Splash page can be a squeeze page, but not all splash pages are squeeze pages. It all depends on the goal of the splash page. Many of them won't even have a form. Promotions and age disclaimers for example.

Splash Page vs Home Page

When visiting a website, the first thing you might see is a Splash Page, so it is easy to confuse it with a homepage. Let's clarify this.

Home Page vs Splash Page

A home page is the main page of a website. It contains major information about the company, product, or service, and may serve as a directory or table of contents. Its design can be minimal or packed depending on the website’s goals. A Home page contains the links to the other web pages.

A home page can in fact contain a Splash Page on it in the form of a modal, a big image or an element taking the whole browser's window on page load.

A splash page will be much more concise than a home page. It has a single and clear purpose (which we will discuss later on in this article) and contains fewer or no links. It doesn't have to be a whole page. It can be just a modal dialog on top of the home page, for example.

Why use a Splash Page?

Are splash pages good or bad? Many people would say that splash pages cause about a 20-25% bounce rate. Others say that it contributes to a bad user experience. But just like everything else, it has something to do with your Why and How.

It is always important to know what your website or business goals are to determine what pages to use. So why would you need a splash page?

  • Convey information quickly, such as a notice or an announcement.

  • Show-off design skills. You may think that this may be insignificant, but this can be effective and well-played for portfolios and creative agencies.

  • Provide quick information about an offer or upcoming event.

  • Provide information or a disclaimer on how to navigate around the website, such as turning the volume off-on or if there are any plugins that you need to enable/disable.

  • New release updates.

  • Provide preference-based options such as language, or country/ region.

  • Provide an option to navigate a more accessible website for visitors with disabilities or a faster loading version of the website for users with a slower internet connection.

  • To warn and restrict access depending on the industry or niche your business operates in.

Main Elements of a Splash Page

What are the important elements you need to have in an effective splash page?

  • A message, copy, or announcement that is intentional, relevant, and valuable.

  • Related, attention-grabbing background image or design. It can be a photo of the product, a video (you can easily add a youtube video in the background), or an animation. Adding a logo or anything related to your company branding may contribute to a good splash page.

  • CTA button, if applicable. It could be a button to jump to a product webpage, avail of a promo, or select their preferred language or region website. These CSS buttons hover effects can help you create an appealing button.

  • A clear exit button to go back to the main website. You will not want your visitor to get annoyed and just leave your website altogether.

What Makes Good a Splash Page?

Poor splash pages result in higher bounce rates, so we have to be especially careful when using them. If we believe a splash page can be beneficial for our visitors or the page's goal, then these are the things to consider to make it a great splash page:

  • Make it beautiful.
    Surely web designing has improved a lot throughout the years, it has been one huge contributing factor in making visitors come back and stay on your website. When designing a splash page, consider it as any other part of the website and pay attention to its design in the same way.

  • Provide relevant information.
    We don’t enjoy being blocked off in the street by someone who offers something we don’t really need. We get annoyed if there are obstructions, especially if we are in a rush. Remember that your visitors are looking for something they need. Therefore, be sure to make a good first impression and don't annoy them. If you need a splash page, only include important and valuable information.

  • Be clear and direct.
    Again, visitors are looking for something on your site. If you want to steal a little of their time, make sure to deliver information in a direct way. Alternatively, you can provide an option to ‘know more’ in case they find it interesting.

  • Be consistent with your branding.
    It not only makes a good impression, but it makes it easier for your visitors to remember you or your company.

  • Provide an easy opt-out link.
    Make it easy for them to hide the splash page and go directly to the content they are looking for. Visitors should be in control over what they want to see.

6 Splash Page Examples [2021]

We have collected for you some splash page examples where you can get ideas from.

1. Bible Project

Bible Project Splash Page

Type: Language Selection (User preferences)

Visit site

This creative animation studio based in Portland has resources that are available to different people in different countries and languages. They sure do need a splash page to help direct visitors to the website of their preferred language. A good splash page example for international websites.

2. Open Doors

Open Doors

Type: Location Selection (User preferences)

Visit site

Open Doors are serving Christians from all around the world. Their website has a splash page asking if you would like to stay on the international website or go to the website for a specific country or headquarters. Similar to the previous splash page example, but they clearly urge you to go to your country website by highlighting the option they want you to click.

3. Disney

Disney Splash Page

Type: Promotion

Visit site

Disney uses an element at the very top of the page to promote their latest deals. The promotion element takes almost the whole window size when we access the page, forcing us to see it before being able to see any other content on the page.

A great example of how a splash page doesn't have to be a different page or even a different from the landing page. Both can be combined and a single element can take the role of the splash page all by itself.

Notice how this full-screen element is the first thing we see when entering their page, and that unless we scroll down (user action), we won't be able to see more content. It meets all the requirements to be considered a splash page.

4. Deliveroo

Deliveroo Cookies Splash Page

Type: Accept Cookies Policy (User preferences)

Visit site

Deliveroo uses a small size modal dialog as a splash page within their landing page. Before we see any content on the page we will have to accept the cookies policy. We can't hide the dialog without accepting them. This dialog might not appear in every country, but it will do in most European ones.

This is a great example of how a landing page can contain a splash page in it, and how a splash page can be something quite simple and basic besides carrying the name "page" on it.

5. Justin Wine

Justin Wine Splash Page

Type: Age confirmation

Visit site

Before being able to view the Justin Wine website, visitors need to confirm they are at least 21 years old. Depending on each region’s legal and moral policies, industries like this one may be required to add age restrictions to their content. A good splash page example if you plan to offer age-limited products.

6. Coolors

Coolors Splash Page

Type: Welcome message + Increase followers

Visit site

Coolors uses a splash page by using a modal dialog. It gives us a warm welcome and encourages us to get in touch with him to give him feedback or just say hello.

I see it as a clever way to also encourage people to follow him on different social networks such as Twitter or Instagram.

Not the usual splash page we see around much, but definitely an interesting use of it!

Conclusion

Splash pages are a natural result of a good user experience. There are scenarios when they are the obvious answer for better navigation, and there are cases when they can look a bit less ideal.

Whatever is your scenario, make sure to only use splash pages when strictly necessary for your users or your company goals/policies.

And once you decide to create a splash page, make sure to design it wisely by applying the principles we talked about in this article.