What is Single-Page Design? Single-Page Design is more than meets the eye. Read this page and be amazed

Many Web design apply to Single-Page Website design, just as they apply to more traditional sites—but there are definitely some special considerations, which are discussed in detail here...

This is a single-page Website, a design approach that works very well for sites that would, in conventional terms, comprise three to six pages of closely related content. Single page Websites work will in the following examples:

  • A brochure site for an artist, an author, small business, or a typical restaurant.
  • When there isn't a tremendous amount of content
  • When all the content is closely related
  • A particular design approach simply works best on a single page

A Single page Website is trendy and can be very engaging—especially when combined with smooth Scrolling. While smooth scrolling is very engaging, this page can also be scrolled by using your mouse wheel, the default browser scrollbars, or your keyboard's arrow keys.

It's about forward thinking which is often considerably better than backwards thinking

Luna uses modern CSS such as fixed position navigation, embedded fonts, column layout, rounded corners, CSS gradients, and shadows—but not a single background image is used. This makes it extremely easy for you to maintain and customize your site.

The advanced CSS we use is deployed in ways that enhance modern browsers while assuring an attractive and accessible presentation in older ones. The idea is to start with a solid foundation that is accessible to all browsers and devices and then enhance it for those that support advanced CSS. The result is that your page is accessible to all, attractively designed for all, and absolutely gorgeous for many. Some techniques, such as the embedded fonts used for section headings, work in almost all browsers—even back to Internet Explorer version 5.

Advanced techniques you'll learn

The Luna user guide will teach you how to use these CSS 2 and CSS 3 techniques:

  • Font Embedding
  • Rounded Corners
  • Box Shadows
  • Linear Gradients
  • CSS Columns

When to use a Single-Page site

There are endless possibilities for unique designs that can only be done on a single page. Certain types of sites lend themselves to a single-page format, such as brochure sites. What are some benefits of a single-page site?

Single-page designs can have certain benefits over a traditional multi-page site. Here are several things for you to consider:

  • Speed: Only one page needs to load
  • Maintenance: Only one page to manage and maintain
  • Search Engines: Only one page to be indexed
  • Uniqueness: Single-page sites will make your viewers take notice
  • Mobile Devices: Single-page sites are well-suited to iPhones and iPads

Some things to keep in mind

When planning your site, it's important to limit the amount of your content because it all needs to load at one time. Four to six separate content areas or "pages" seem to be about the norm for many single-page sites.

The amount of content in each section should be sufficient to fill a maximized browser window running at high resolution. You may want to consider the visible area your visitors likely see within their browser. Crafting your sections to fit comfortably within that space can minimize scrolling while viewing individual sections. Keep in mind that the smooth scroll is designed to scroll the page up so that the target heading is at the top of the window, which means that your last section should have sufficient content to allow it to scroll all the way to the top. If that's not possible, all you need to do is to assign the last section a large amount of padding on the bottom. Don't worry about small screen users having to scroll within sections. Remember, we are not hiding the browser's scroll bars—they are still usable, as are mouse wheels and arrow keys.

Some things to keep in mind

When planning your site, it's important to limit the amount of your content because it all needs to load at one time. Four to six separate content areas or "pages" seem to be about the norm for many single-page sites.

The amount of content in each section should be sufficient to fill a maximized browser window running at high resolution. It is good minimize scrolling while viewing individual sections. Don't worry about small screen users having to scroll within sections. Remember, we are not hiding the browser's scroll bars—they are still usable.