You spend weeks crafting the perfect hero layout to encourage website visitors to sign up for your new rewards program. The copy is snappy and the whimsical graphics are eye-catching. When you finally launch your page, you learn users scroll right past it.
User behavior can be unpredictable, but one way to help visitors take note of important elements—like an announcement—is with a splash page.
Here’s what splash pages are, why online businesses use them, and six tips to help you design your own.
What is a splash page?
A splash page (or splash screen) is an overlay or pop-up window that appears before a user sees a page on your main website.You can use splash pages to greet visitors, share valuable information, or promote deals or events.
Many splash pages feature engaging graphic design elements like photos, videos, or animations that reinforce key elements of your brand image.
Splash page vs. landing page vs. homepage
Splash pages, landing pages, and homepages are all common website entry points, but they’re not the same.
Splash page
A splash page isn’t a complete web page—it’s a pop-up or overlay window attached to one or more of your site’s URLs. This means you can ensure visitors see it before accessing other pages, regardless of how they arrived.
Landing page
Landing pages are standalone web pages with distinct URLs that businesses design for specific campaigns. For example, your Google ad might link to a landing page that encourages users to complete an action, such as signing up for a product trial or providing contact information to access gated content.
Homepage
Your homepage is your website’s main page. Homepages typically include welcome messages and links to key internal pages, like your product collection or contact form.
Benefits of splash pages
Splash pages offer control over initial impressions of your site, helping you improve your brand experience and highlight key messages. Here are the benefits:
Consistent user experiences
There’s more than one way to access your website. Prospective customers might type your URL into their browser’s address bar, click on a product in a Google Shopping post, or find a three-year-old Reddit thread that links to an archived blog post. You can display the same splash page to each of these viewers, giving them all the same first interaction with your site.
Language and regional targeting
Use a website splash page to prompt users to select their location and preferred language, which can improve their experience—especially for users who don’t speak your site’s default language. This also ensures that a European customer doesn’t see a product only available in North America, for instance.
Legal compliance
Some splash pages require visitors to agree with a statement or accept a disclaimer as a condition of viewing the site. Companies that sell age-restricted products (like alcoholic beverages) often use this strategy to restrict access based on a visitor's age, asking users to enter a birthdate or confirm their age.
Effective messaging
If you need to get a message across to every site user, you could either update every page on your site (including those archived blog posts) or create a splash page that highlights what visitors need to know.
Splash pages are simpler and more effective. You can focus an entire page layout around one message, require specific actions to enter your site, or create a unique branded experience that adds value for visitors.
6 tips for creating splash pages
- Use high-quality visuals
- Be concise
- Provide a clear exit
- Deliver value
- Optimize for mobile
- Account for returning visitors
Effective splash pages are eye-catching, direct, and on-brand. Here are six tips for creating a splash page for your website:
1. Use high-quality visuals
A single splash page can introduce your company to visitors, making it an important place to invest in high-quality images, layouts, and design. Create an eye-catching page that grabs visitors’ attention and is consistent with your overall brand personality. Stay clear of generic stock imagery or templates.
2. Be concise
Most splash pages contain very few elements—optimally no more than four sentences, three colors, and a couple of design elements. This increases the likelihood a user will engage with page content, retain relevant information, and continue engaging with your site.
3. Provide a clear exit
Including a clear exit link can reduce the risk that users leave your site if they don’t want to see splash page content. A labeled continue-to-site button or large X in the upper-right-hand corner of the splash page window can eliminate user frustrations
4. Deliver value
Your site visitors didn’t ask to land on a separate splash page and may be eager to leave. If your splash page content doesn’t deliver value, it can drive users away instead of boosting conversion rates.
Save messaging splash pages for truly meaningful announcements—an upcoming event or mega-sale. If your splash page encourages an action, consider offering a discount code or other incentive. For example, your splash page can read “Get 15% off one item when you sign up for our newsletter” instead of “Sign up for marketing emails.”
5. Optimize for mobile
More than half of all internet traffic is mobile, so a responsive splash page design that displays properly for mobile and desktop users is a must. An illegible splash page—or one with a cut-off exit link—can increase bounce rates (the percentage of people who leave without taking any action on your site) and damage your brand image.
6. Account for returning visitors
Have you ever felt annoyed hearing the same story for the fourth time? A recurring splash page can feel similar. To avoid this, you can display some splash pages to first-time visitors only.
To improve the experience for returning visitors, use browser cookies to store language preferences or age verification status, for example, so they don’t have to fill it out each time. Some splash pages also include an opt-out box, which users can check if they prefer not to see a promotional message twice.
Examples of splash pages
These three splash page examples demonstrate the value of high-quality images, clean layouts, and concise copy:
Spritz Society
Alcoholic beverage company Spritz Society sells wine spritzers made from California whites and real fruit, featuring flavors like passion fruit, pineapple, and blood orange. It also provides a great example of an age verification splash page.
Spritz Society uses a clean, visually appealing gradient background in the brand’s signature color palette, minimal copy that effectively deploys part of the company’s name, and two clear user pathways.
Omsom
Omsom, a packaged foods retailer and self-proclaimed provider of “loud, proud Asian flavors,” uses its splash page to encourage newsletter subscriptions. Omsom’s overlay style makes it clear to users that they’ve landed on the right page, and its layout highlights the page’s value proposition by promoting a discount with the largest text on the screen. The page also contains a clear exit link in the upper-right-hand corner of the pop-up window.
Omsom’s overlay style lets the company include multiple elements without diluting its message. The second pop-up window, which reads “Hi from co-founder Kim,” loads after the main image and expands to display a short video of Omsom co-founder Kim Pham eating noodles and welcoming shoppers.
Users can interact with the element to view another short video or return to the main site by clicking the exit link in the upper right-hand corner.
Zara
International fashion retailer Zara shows how a high-quality background image can reinforce brand image. Zara specializes in affordable, on-trend apparel with an upmarket feel. Its language and country selection page uses lightweight design elements to avoid drawing attention from a stylized background image, mimicking the look of high-end fashion photography. It positions the brand as a destination for creative, fashion-conscious consumers who want to look expensive—even when shopping mass-market.
Splash page FAQ
Do you need to hire a web designer to make a splash page?
No, third-party applications make it incredibly easy to design a custom splash page for your site. Search the Shopify App Store (or your app provider of choice) to view user-friendly pop-up and splash page applications.
What is the main difference between a splash page and a homepage?
A homepage is a website’s main page, and a splash page is a pop-up window attached to one or more URLs on a site. The typical splash page uses simple messaging and eye-catching visuals to introduce visitors to a business’s online store.
How do splash pages affect SEO?
Splash pages can interfere with your SEO efforts. They typically have limited content and can affect a search engine’s efforts to crawl your site.
