Single-Page Websites: A Web Design Trend Worth Adopting?
Years ago, one of my clients referred me to a developer who wanted to partner with a copywriter. She would build the websites and I would supply the copy and SEO. Before we began our first project, I asked for a wireframe so I could get a sense for what each of the web pages needed to look like. I was shocked by what I received.
The website sketched out in the wireframe had only one page. There were six sections dedicated to the pages you’d find on a traditional business website—Home, About, Team, Services, Testimonials, and Contact. But each section of the single-page website was much smaller than I was used to, maybe only four or five sentences dedicated to each of the “pages”.
I had so many questions for the developer; the first of which was:
After I gave my brain time to cool down, I decided to look more closely at the website she was proposing and put together a list of questions that more practically addressed my concerns:
- Did the client care about SEO?
- What would this do to the website’s speed?
- Would there be negative implications for mobile?
- Wouldn’t the navigation be confusing for visitors accustomed to multi-page websites?
- What about a blog? Didn’t the client mention content marketing on the phone?
- Would this help or hurt conversions?
Based on my understanding of how websites worked and how users interacted with them, the choice to build a single-page website just didn’t make sense. It seemed unnatural and counterintuitive.
In the years since, and as I encounter more single-page websites, I wonder if there’s something to them that I’ve been missing. Which is why, in today’s post, I’m going to give you the lowdown on what I’ve learned about single-page websites. What their strengths are. Where they’re weak. And why you probably shouldn’t use them as a WordPress developer.
The Lowdown on Single-Page Websites
Websites have traditionally been structured similarly for years now. So, when you encounter a deviation from that formula, it’s usually for one of three reasons:
- You have users trying to DIY their own websites who don’t know what they’re doing. So, they end up stuffing a full website’s worth of data into a single page and using a cheap Wix or other site builder tool that doesn’t guarantee the kind of control over quality and performance they’d get with WordPress.
- You have inexperienced developers trying to take a shortcut. So, they encourage clients to go with a single-page website because it’ll “look cool” or generate more conversions. But, really, the only reason they encourage it is because it’ll take them less time and they believe they’ll make a higher profit.
- You really don’t have much to say, but you at least need a landing page that prospective customers can turn to.
Rather than focus solely on the “why” of it, let’s talk about what you’re actually dealing with and what kinds of results you can expect with single-page websites.
Content Needs to Be Succinct
With single page websites, you have absolutely no time or space to waste.
When you design a website like this, you’re basically dividing the home page into a different “page” for the site. And each of these “pages” needs to fit within the space of a standard hero image. Realistically, this means you can have a paragraph of text, a CTA, and an image in that space. Or a header and a video. Or a short intro with a portfolio or gallery. Something like that.
If your client insists on placing more content into each space—maybe because what’s in there is too vague or they feel like something is missing—then you need a multi-page web design.
Content Needs to Be Coherent
What you do with space is a major consideration with single-page design. But you also have to think about how well visitors understand what the copy says in those spaces.
Let’s say you allow your copywriter to insert 100 to 200 words in a given space. However, what they’ve written still doesn’t explain what the website, service, or business is about. That’s a major problem. Now, it could be that the writer doesn’t understand the topic or they said the same thing over and over again to fill a quota. If that’s not the case, though, you might just have an overly complicated topic that needs its own page for discussion.
Every Section Needs to Contain Something Valuable
Every now and again, you’ll encounter a single-page website that has random sections thrown in. They throw off the logical flow of the page and also distract visitors from getting to the bottom (which is where the contact form usually is).
You don’t have the luxury of visitors clicking a CTA or referring to the navigation, and being directed to a page containing relevant information. Instead, they’re stuck scrolling through your single web page. If you expect them to make it to the bottom of it, don’t place irrelevant elements in the middle. Make sure every section contains something valuable.
Anthony Isaac’s single-page website demonstrates this point well. While the above-the-fold header is kind of silly (as you scroll, his head pops off), the rest of the page contains information people would need if they’re interested in working with him.
Here’s the home page before scrolling:
Here’s the home page as you start to scroll:
Then you start encountering examples of his project work in video and image format:
His contact information is also short and to the point:
Keywording Is Extremely Limited
Keywords play an important role in the ranking of your website in search. But with only a single page to optimize, this will severely limit what you do with keywords.
You’re now limited to a single page of real estate to target keywords and drive search traffic. You pretty much have to find one and commit to it. Of course, you can use secondary keywords in the H2 header tags on the page, but the emphasis really needs to go on the focus keyword if you want to rank.
Internal Links Are Non-Existent, but Backlinks Are Awesome
Part of a good SEO strategy includes an internal link-building strategy as well as seeking out new opportunities for backlinks.
Because of the way a single-page site is built, an internal link-building strategy isn’t really possible. While you can create anchors on the page and link to them, the only place they can go is in the navigation.
Backlinks, on the other hand, are actually awesome for single-page websites. Whenever your site is promoted elsewhere online—be it a blog, on social media, or a review site, etc.—there is only one link those referrers can point to. This means all the authority your site generates will be on that one page and all traffic from Google will be driven there.
Single-Page Sites Can Seriously Hurt or Help Speed
One of the benefits of designing single-page sites is that minimalism rules the roost. With less content, no blog, and not much needed in the way of engagement, WordPress plugins aren’t as essential. Of course, you’ll still need them for:
1.6 million WordPress Superheroes read and trust our blog. Join them and get daily posts delivered to your inbox - free!
Other than that, you might need one or two to add video or include image galleries. But that’s nothing compared to the list of WordPress plugins most websites need.
That said, I’ve noticed that single-page sites built with tools other than WordPress can be slower to load, which is why these sites can get a bad reputation. So long as you use plugins that prioritize performance and keep what little content you have optimized, yours should be fine.
The Plastics Unlimited website seems like it’s one that isn’t plagued by performance problems. I was actually surprised by that what with how many features and products it highlights.
As you can see, Capabilities are listed out in a contained space:
Upon clicking on them, however, an accordion triggers open and a bunch of details are revealed:
A similar event occurs when Products and Applications are clicked. However, these use a lightbox element.
This is what the Products lightbox looks like:
This is what the Applications lightbox and gallery looks like:
It’s Easier to Design Responsive
Notice that I said it’s “easier” to design a responsive site with a single-page layout and not that it’s a given. That’s because developers or users who don’t utilize a responsive WordPress theme can compromise the responsiveness of their simple site’s design (which I saw a lot of today… blegh).
There are many high-quality WordPress themes that were built for single-page layouts. I’d suggest starting with multipurpose themes like Uncode or Divi. They have templates styled in single-page layouts or you can make use of their page builder tools to create one of your own. This way, though, you can ensure that your site is fully responsive.
Navigation Is Optional… Though You Should Still Have One
Because there’s no other page than the home page, a navigation menu might not seem necessary. However, users are accustomed to looking at the top of a site for a navigation bar or hamburger menu to guide them. Without one present, your users are smart enough to realize a scroll of the mouse or drag of a finger will get them through the rest of the page. However, that can quickly become frustrating if you have a lot of content on the page and if they have no idea what they’re even scrolling towards. There might be only one direction to go in, but that doesn’t mean it can’t frustrate or confuse them.
So, if you’re designing single-page websites, be sure to include a navigation. To get this to work, build anchor links into each section so each menu tab drops users down to the right section.
I really like what the Mesón website did with this. The navigation is clearly displayed at the top of the website. This way, even if visitors don’t realize they can scroll through the entire site on their own, the navigation will help them do it, too.
I also appreciate the space-saving techniques the Mesón designer used in the menu:
While each of the categories and corresponding menu items could’ve made the website longer than it needed to be, they used an accordion function to hide items until users engaged with them:
Single-Page Designs Don’t Always Last
As I looked through lists of the best or most inspiring single-page designs, I noticed that around 50% of the sites I pulled up had actually reverted to a multi-page design since the article was published. I try to use only references that are a year old, so this means it look less than a year for those developers or website owners to decide that a single-page design wasn’t for them.
Now, that doesn’t mean it won’t be right for your clients, especially if they have a very basic concept or service they’re selling. However, it may be worth A/B testing down the road to see if a single-page site is what’s hurting their conversion rates.
Google Analytics Will Be Difficult to Use
When it comes time to analyze the performance of your single-page site, Google Analytics will be able to tell you the basics about the demographics of your visitors. However, when it comes to user flow and behavior, there’s very little you’ll be able to decipher from this usually helpful tool. Instead, you’ll have to employ the use of something like heat mapping software in order to track user movements on your site.
Clearly, there are ways in which you can make single-page websites look good and perform well. However, I really only think there are only a few limited use cases for them in WordPress:
- A landing page for a business or event.
- A portfolio for a creative.
- A business with a highly focused and singular product or service to sell.
Otherwise, you’ll find that multi-page websites help you more effectively disperse all the information you want to share with visitors.