October 28, 2014 - Tutorials

What (exactly) is a One Page Website?

The majority of our readers know that One Page Love showcases only “One Page” websites but you’ll be surprised at how many still mail us confused with the concept. As straight-forward as it sounds, there is actually quite a bit more to it. We have also changed the rules slightly over the years to accommodate trends but more importantly new laws. Below is an in-depth look at what the criteria are but also the exceptions to still be deemed a One Page website.

Firstly, so why One Page?

A One Page website aims to provide the perfect (could read minimum) amount of information for a user to make a decision and act upon it. This Singe Page website has no additional pages (like about, services, contact) and tries to remove as much “clutter” as possible, focusing the user’s attention to the most important content. Our Most Loved One Page website gallery section showcases what we think are the absolute best One Page website examples.

“Simplicity is about subtracting the obvious, and adding the meaningful.” – John Maeda

“Simplicity means the achievement of maximum effect with minimum means.” – Dr. Koichi Kawana, Architect, designed the botanical gardens

“Make everything as simple as possible, but not simpler” – Albert Einstein

Click the above image to tweet this quote

Click the above image to tweet this quote

Accepted Additional Pages

Now that we have cleared up what a One Page website is and aims to achieve, I want to add that some additional pages are acceptable but need to follow these rules:

  • The page contents are relevant to the main/parent One Page website but would add “clutter” to the user reading experience.
  • The links to these additional pages are not visible in the website header – distracting the user from the One Page reading experience. These page links are normally associated with the website footer.

Since “Impressum” pages became a requirement by German law, One Page websites from Germany were forced to add them. We thought it was only fair to still accept these websites – so this evolved into us accepting any “Terms & Conditions” pages plus a few more. Here are a few examples of non-intrusive website footer links:

impressum-01 impressum-02 imprint-01

Here is a summary of the accepted additional pages:

1. Impressum Pages

“Impressum” is a Latin word for “printed” that derived from “imprimĕre”, meaning “to print”. An Impressum is the term given to a legally mandated statement of the ownership and authorship of a document, which must be included in books, newspapers, magazines and websites published in Germany and certain other German-speaking countries, such as Austria and Switzerland. There is no equivalent legislation in English-speaking countries such as the United Kingdom and the United States, and therefore no consistent legal term is used in English-language media. (Source: Wikipedia)

Summary: In Germany, Austria and Switzerland (by law) websites need to include Impressum pages.

2. Imprint Pages

Under the UK Printer’s Imprint Act in 1961, which amended the earlier Newspapers, Printers, and Reading Rooms Repeal Act 1869, any printer must put their name and address on the first or last leaf of every paper or book they print or face a penalty of up to £50 per copy. In addition, under the Political Parties, Elections and Referendums Act 2000, any election material – including websites – must show the name of the promoter of the material and the name and address of the person on whose behalf it is being published. (Source: Wikipedia)

Summary: In the UK, it is good practice to include Imprint pages in websites.

3. Terms & Conditions Pages

Terms & Conditions pages spell out each party’s rights and obligations in connection with the use of a website. I personally feel these are becoming less popular in One Page websites but some companies prefer to play it safe and include one.

4. Privacy Policy Pages

If you are collecting information from your users, including credit card information, you should add a Privacy Policy detailing how this information will be used or not used. The Yahoo Privacy Policy is a good reference to this.

5. Refunds, Returns & Shipping

If you are selling any form of physical or digital product this information creates more trust (resulting in higher sales) if you make these terms very clear to the potential buyer.

6. 404 Pages

These are pages that tell the users what to do if they have landed in an unknown area of a website. Ours looks like this.

But what about Modal windows?

Yes, we recommend Modal windows as a good solution to display additional information without browsing away from the One Page website. A Modal is basically an “overlay child window” that loads on top of the existing (parent) website’s content. They are however subjective and a lot of people disagree with them from the usability point of view. Here is an excellent article on Modal windows by Smashing Magazine.


What about AJAX loading content?

This question needs it’s own full article but in short, loading snippets of content (news, projects, more team info) via AJAX is perfectly acceptable but we tend to frown upon “pulling in” full pages into the One Page website. We definitely do have exceptions sometimes and are still refining this topic. Full article soon.

Accepted Additional Sections

These sections are also acceptable to your One Page website:

1. Alternative Languages

A One Page website can have a link to alternative versions of the website in different languages. These are great for targeting marketing campaigns to the relevant version and often in a subdomain like:

  • fr.onepagelove.com
  • en.onepagelove.com

2. Blog or News

With the trend of a lot of One Page Templates starting to include these, we adapted our rules and now allow any form of blog/news “feed” as long as the content loads in a Modal window, via AJAX within the page or opens in a new section away from One Page website.

blog-feed-01 blog-feed-02

3. eCommerce Integration

Often when someone wants to sell a single product they use a Singe Page website to promote the product and aim at a sale or conversion – this type of website is also know as a Landing Page. These Landing Pages encompass everything that a One Page website stands for and are brilliant references to creating attractive and engaging websites. This trend and movement towards targeted marketing Landing Pages is what we based our decision on to starting accepting Landing Pages that offer everything in One Page but link out to a checkout page. A few points to clear up here:

  • We strongly favour an in-page checkout process. WooCommerce have launched a brilliant One Page Checkout extension handling this.
  • We do accept Refunds, Returns & Shipping pages as long as the links are non-intrusive

Here is a great example of a Modal checkout window:

4. Support or Documentation

Often an app or product will have a beautiful One Pager but need in-depth documentation that would clutter the main site. A good example is the Vee for Video One Pager that includes a link in the footer to the documentation section that looks very different to the Singe Page website.

Final thoughts

One Page websites are normally aimed at conversions but we need to respect and accommodate the additional information that come packaged with various products, services and ideas.

It is difficult to cater for everyone but we want the terminology to be as clear as possible. I’d love to hear your thoughts in the comments if you agree or disagree.

Much love,