10 one-page websites to inspire your own

When done correctly, the one-page format gives your user a simple-but-functional experience without the burden of navigating pages and links.

The premise is simple: Keep all (or most) of your website’s assets, from text to graphics to navigation buttons, on a single page. Users are expected to scroll up and down (or use navigation buttons) to view your website.

We want to show you a few more great examples of one-page websites to help inspire your own design—and then give you some great tips on building your own in InVision Studio.

10 captivating one-page websites to inspire your own

Below are 10 fantastic examples of one-page websites. Use them to inspire your own designs, or simply to fawn over.

1. Balsoy

Balsoy leverages a fixed menu bar at the top to help users easily navigate their pared-down one-page website. As users scroll down, they are presented with sections offering information about their product. Each section transitions into the next with sliding animation, which keeps it fun.

2. Epic

Epic gives you true, compelling stories from talented writers—and they’re all displayed on a one-page website. Using the anchor links at the top of the page, users can find exactly what they need by either clicking the buttons or scrolling down.

Each story comes with a vivid graphic and brief but enthralling synopsis. The layout is simple and allows the user to scroll through and have their pick of stories, like a digital library. Though each story is its own sub-page, we really dig this as an example of putting the majority of the site’s content on this single, easily-browsable page.

3. Every Last Drop

Every Last Drop is a one-page website brought to you by the folks at Waterwise, a UK-based nonprofit focused on educating people about water consumption and the importance of reducing it. As the user scrolls down, they’re taken through a day in the life of a typical UK citizen—and the dizzying amount of water they consume each day.

The site uses animations and a unique scrolling technique to immerse visitors and show them the importance of reducing water usage. It’s a very creative take on the one-page website and provides a memorable and educational experience.

4. Ian Enders

Ian Enders is a software engineer—and the creator of a fantastic one-page website.

Learn the 101 of Enders’ life without scrolling. By the end of the 17th line, everything you need to know is spelled out: he codes, he has experience, he has a resume, and he’s (in his own words) a “crotchety old man.”

5. Angry Bear

The design agency Angry Bear uses users a beautiful nature-themed one-page website, including a floating hamburger menu (or is it hamBEARger menu? Okay, I’ll stop…) on the left for easy navigation throughout the page.

The design users design elements and creativity to give a sense of depth and scope as they scroll down a waterfall into the forest below.

6. Reverend Danger

Reverend Danger is a fun and interactive one-page website from the digital agency of the same name.

Using the scroll bar at the top, users can choose between two different themes for how they can experience the website: Reverend, for a more passive and calming experience; and Danger, for a more violent and action movie experience. A very fun way to spice up a one-page website.

7. Knucklebones

Founded in 2016, Knucklebones is a newer website dedicated to an older game. The website is dedicated to a Kickstarter product based on the ancient game of Knucklebones (a predecessor to jacks).

As users scroll down, the website gives users all the information they might need to play, showcasing the rules in an easy to follow format.

The website also provides various packages in which users can purchase the game.

8. Rest

Rest is a great example of how a one-page website can also work for e-commerce. The web page is short and sweet, giving users everything they need to know about the product through great images and good copy, while giving them options on how to purchase it for themselves through three easy purchase options—expressed visually.

The two navigation buttons at the top are also a plus, helping navigate the website without having to scroll around constantly.

9. Jon Phillips

Not every one-page site needs to be anchor links and animations. User interface designer Jon Phillips gives us the most spartan one-page website on this list with his personal site. No scrolling is needed for this one, as it’s just a simple page with his name and a contact button front and center.

At the bottom you’ll find standard, run-of-the-mill social icon buttons that send users to his social media accounts—and that’s it. You found him.

10. We Ain’t Plastic

We Ain’t Plastic is the alter-ego of Roland Lösslein, a Berlin-based UX engineer and creative technologist. The page is broken up into various sections. Each section gives users different information they might want to learn about Roland.

This includes:

• Roland’s background via a short biography
• An excerpt from his body of work as a UX engineer
• Awards he has won
• Blog posts he’s written on Medium

The design is minimal and gives the users only what they might want from Roland — and nothing more.

Tips for building a one-page website

Now that you’ve seen some great examples of one-page websites, let’s take a look at the main ingredients you’ll want to consider when you build your own.

They are:

1. Actionable goals
2. Strong CTA
3. Easy-to-reach navigation buttons

1. Determine actionable goals

The first thing you should do before you even think about starting a one-page website is ask yourself, “What is my goal?”

This is one of the most crucial aspects of creating any website, one-page or not. Knowing exactly what your website’s goal is will help you make the right decisions for what you want to do with your website.

It might even help you realize you shouldn’t make a one-page website.

For example, if you have a photography business and you want a website that will both show off your portfolio and book you new leads every month, you won’t need a ton of paqes—just great visuals. You could absolutely create an excellent and effective one-page website.

However, if you have an e-learning business teaching people about all the different facets of photography and you have multiple courses on the topic, you’re going to want to create a more traditional website with more page. This is because you’ll need space to dedicate to your different products and assets, and maybe even a blog—which would make one page feel very crowded.

No matter how many pages you settle on, you should still use your website’s goal as the North Star for all of your web design decisions—including things like what elements to include, what kind of calls to action you’ll have, and how your navigational elements will look.

So ask yourself, “What is my goal? What’s the goal of my brand? What do I want to accomplish with my website?” Only by answering these questions can you decide how you want to approach your one-page website.

For more on good design goal setting, check out our articles on the topic below:

• Watch: Why the secret to success is setting the right goals
• How to measure the impact of your work
• Setting your design system up for success

2. Develop strong calls to action

Every one-page website needs a clear call to action. Without one, your user won’t know what they should do once they arrive on your website—meaning fewer leads, less engagement, and reduced conversions.

How do you come up with these CTAs? Go back to your goals.

• Do you want your reader to sign up for your email list? Make sure you have a place to easily gather email information (or at least an anchor button to it) at the top of the page.
• Do you want your reader to contact you for quotes? Direct your readers to a contact box on your website.
• Do you want potential clients to look at your most recent projects? Be sure to have anchor links to those projects within easy reach
• Do you want people to connect with you on social media? Have fixed buttons that lead to your social channels.

This is where good user research comes into play. By understanding the people who are interacting with your website, you’ll be able to immerse yourself in your users’ goals and pain points. When you do, they’ll actually tell you what they want to hear from your copy.

For example, let’s say you run a fitness coaching business and you want your user to sign up for a consultation session. After speaking with a few clients, you frequently hear them tell you that they really want to get six pack abs by the summer.

Now you can start brainstorming effective CTAs. Something like,“Sign up for a free consultation session on how you can get six pack abs by the summer!”

All you have to do is speak your target users’ language.

3. Build easy-to-reach navigational elements

It’s critical to make sure that your page is easy to navigate, no matter what part of the page you’re on.

There are many different ways you can go about this. A few I suggest:

• Anchor text. Anchor text is a link on a piece of text that will bring you to a predetermined place on the web page. They’re incredibly handy for navigating web pages—plus, they give you an SEO boost when you use them. Double win!

Want to learn more about anchor text? Read this Ahrefs post on the topic..

• Fixed navigation. Having navigational elements, such as buttons or a sidebar, follow the user as they scroll up and down the page can be convenient and helpful (see Balsoy above). This is especially so if your one-page website is long and contains a lot of content.

• Keep it short. You might feel like having navigational elements would be too distracting. In that case, you can keep things simple and make sure your one-page website is short. This will ensure that they get all the information they need without having to scroll too far (see Ian Enders’ or Jon Phillips’ examples above).

If you want to learn how to make a floating navigation button for your website, check out this article on the topic to learn how to do it with InVision.

Use InVision for your one-page website

A one-page website can be a good opportunity to give users a simple-yet-engaging browsing experience. To help you design your first one-page website, we want to help with Invision Studio.

This is our tool to help you create attractive screen designs and collaborate with your team with ease. Try InVision Studio for free here today.