Website design trends: Single-page websites

Single-page websites have become an increasingly popular trend over the past few years. Instead of building a full-fledged website with separate pages for each topic, everything is packed into one page. Menus don’t point to separate pages but instead to sections of the single page. Single-page sites are trendy, but are they a good idea?

Single-page website navigation

Navigation is an important consideration for any website, as content is only as valuable as its ability to be discovered. A menu bar on the top or left of the screen is common for most websites, and while these are possible with a one-page site, they’re a little more difficult to set up. Since you can’t link to each page as usual in your menu, you’ll need to create anchor links for each section of your page. You can then link to them in your menu. At this point, your site essentially functions like a typical site except that your content is on one long page instead of several separate pages.

SEO for single-page websites

SEO is perhaps the biggest reason to second-guess a single-page site. On a standard website, each page can be customized to target a specific search term. With several pages on a website, your site is able to target several keywords successfully. This is much more difficult with a single-page site, and traditional SEO tools like Yoast SEO aren’t optimized to help, so you’ll be on your own for optimization.

That doesn’t mean SEO is impossible on single-page sites, though. Use typical SEO techniques to help your site rank, but with one major exception. Begin each section of your site with a Heading 1 line. This will help search engines to view each section as a separate page, and ideally, they’ll index your sections separately, helping them to rank as they would if they were separate pages.

Single-page website examples

With these techniques in mind, single-page sites become as much a matter of preference as anything else. As long as you’re not planning on creating a blog and want to keep your site simple, a single-page site is a viable option as long as you’re committed to the extra SEO work it’ll take to get your site to rank.

That said, here are some examples of single-page websites:

Livia Satriano

Livia Satriano

In addition to being a single-page website, Livia Satriano’s site encompasses some of the other design trends we’ve featured before. It features elements of brutalism in addition to a solid color duotone section that changes colors when the mouse is hovered over elements inside it. Interestingly, this site uses numbers to emphasize the division between sections of the page. It’s a bold, futuristic design.

Investment Calculator

Investment Calculator

The Investment Calculator is exactly what it sounds like — it’s a simple calculator to help people determine how much money they’ll end up with based on a monthly investment. Simple tools like this work well for a single-page site. With a bold, gradient section at the top and bottom of the page, the site presents information in an appealing way without seeming overwhelming.

Cardéa WordPress Theme

Cardéa WordPress Theme

The Cardéa theme makes it easy to create a single-page site with WordPress. The theme features, vivid, bright-colored sections, and the menu highlights the section of the page you’re browsing as you scroll through the page. While we haven’t used this theme beyond this demo, it looks like a nice option if you’re looking for an eye-catching single-page website.

 

Shippen House

Shippen House

“That house on the beach,” as the URL proclaims, uses hero images and alternating light/dark sections to create a lovely, inviting design. Like the Livia Satriano site, the Shippen House site uses numbers to further divide the sections of the page. The Shippen House site demonstrates the utility of a single-page site for a simple website with one single, basic goal.

What do you think of single-page websites? Are you interested in creating one? Let us know in the comments.

Want to see more website design trends? Visit mpwrdesign.com/trends for more ideas.

Comments