Return of the Single Page Web Site
A few years back web designers were head over heals for Flash. Not just for it’s ability to animate pages but for the first time we could create an entire website within one window without the annoying page refreshes (even more annoying during the days of dial-up). AJAX was a recent game-changer. After all, why wrap your entire site in Flash when many of the same effects could be achieved without the side effect of losing your search-engine ranking? But the promise of AJAX went beyond just replacing Flash’s neat animation effects. It was now possible (though not always desirable) to create one-page sites but this time Flash-free.
Like with Flash, portfolio sites and simple photo galleries seemed the first to gravitate toward the new web 2.0 trickery. However, other types of businesses are now testing the waters. It is usually transparent to the visitor that the entire site is contained on one web page. They simple marvel at how fast the pages appear to load even noting that the address bar URL changed (a little trick useful for bookmarking). But it’s all smoke and mirrors thanks to a little CSS and javascript manipulation. Content can be hidden and then produced on demand, pages auto-scrolled vertically based on a link click, content slid left and right keeping the visitor’s focus in one place on the page. Here are a number of sites employing these techniques:
- http://www.artbuilders.com/ (combination sliding and collapsing effects)
- http://youlove.us (vertical scrolling, seemless background)
- http://www.contreforme.ch/fr/project/ (vertical scrolling, collapsing)
- http://www.hotmeteor.com/ (vertical scroll, horizontal sliding)
- http://www.mariusroosendaal.com/ (accordian widget)
- http://www.webleeddesign.com/ (vertical scroll)
- http://www.simonamunteanu.com/ (vertical scroll)
- http://www.puneetsakhuja.com (vertical scroll)
- http://www.frojd.se/ (horizontal slide, hide/show content)
- http://www.iamtodd.com/ (hide/show content, manual scroll)
- http://www.studioespace.co.jp/index.html (hide/show, vertical scroll)
No comments yet.
Leave a comment
You must be logged in to post a comment.