Every website has to perform maintenance at some point or another. Whether it’s just to upgrade a portion of the site or because of some problem with the site, it’s an inevitable fact of website ownership. And in many cases, maintenance requires taking your site offline for at least a few minutes.
So what should you do if your site is going to be down for maintenance? You don’t want users coming to a 404 or other error page. And hopefully you’d like to encourage them to come back to your site sooner rather than later, right? If that’s the case, you’ll need to build a custom maintenance page. Below we present a list of best practices to building effective maintenance pages that will help keep your visitors, whether new or returning, happy.
You may want to take a look at the following related posts:
1. Keep you maintenance pages simple and useful. Link
The entire point of a maintenance page is to let visitors know that your site is still around and that the maintenance is only temporary. It doesn’t need to do anything beyond that. Make sure it’s immediately apparent what your page is about and provides your visitors with the information they’re interested in.
Another useful function for simple maintenance pages is to include your maintenance message in multiple languages. The Web is global, and while many of your visitors are likely to speak at least some English, providing multiple languages is helpful. Just be wary of using online translators, as sometimes they’re less-than-accurate. The last thing you want your maintenance page to do is further confuse people, or worse – offend them.
…and sometimes Google Adsense just explains in plain language what is happening and when the page will be online again. Notice that Google also reassures the users that earnings will continue to be tracked as normal, and ad targeting will not be affected during this downtime.
2. Realize it’s an inconvenience to your visitors. Link
When your site is down, your regular visitors are inconvenienced. It’s a simple fact. But don’t let inconvenienced visitors turn into alienated visitors. Simply acknowledging that your site’s downtime is a pain for your visitors is often enough to satisfy them. Apologize for the downtime, give them information that’s useful to them, and make them feel like you realize what this means to them.
3. Don’t be afraid to use humor. Link
There’s no need to get all serious just because your site is down. Using a bit of humor or otherwise making your maintenance page entertaining helps to improve your site’s image in the eyes of visitors inconvenienced by the downtime. Think about different angles related to your site’s content that could be portrayed in a humorous light. Whether it’s doing something with your site’s logo or mascot, or even something seemingly unrelated to your site, there’s surely an angle out there for making your maintenance page funny.
FlashDen claims a 10 second downtime and offers up a cartoonish character doing maintenance on himself to make visitors smile.
Bloglines uses an image of a plumber to lighten things up when their site is down.
4. Give your maintenance page the same look and feel as your regular site. Link
You want visitors to immediately realize that they have arrived at the correct place, even if your site doesn’t quite look the same as always. If your maintenance page bears no resemblance to your regular site, many visitors may just assume they’ve gone to the wrong URL without bothering to read what your page says.
Make sure your maintenance page includes your logo and keeps the same general color scheme as your site. Even these two simple things can make visitors feel more at ease when they reach an unexpected page.
5. Let visitors know when your site will be back. Link
Maintenance times can vary greatly. Sometimes a site might be down for only a few minutes. Other times it could be an hour or two, or even longer. Let your visitors know what time you expect to be back up and running. This way they’ll have an idea of when to come back. An open-ended maintenance page encourages them to put a return visit off for hours or even days. Something that says you’ll be back in five minutes encourages them to do the same.
6. Provide recommended content. Link
Keeping a few articles from your site on a static page for maintenance downtime is one way to offer your visitors something to look at while you’re performing maintenance. Other sites even recommend content from other websites, generally that they think would be of interest to their visitors. Giving your visitors something else to do while they wait for your site to come back online is a great way to show them that you care, and that you realize it’s inconvenient for them (see number 2 above).
Mixx provides a few of their favorite “Mixxed” stories for visitors to check out.
Sears63 had to be closed for site enhancements during the Black Friday. The maintenance page provides users with further navigation options – such as Lands’ End, Parts Direct and Sears Credit (via64).
7. Invite your visitors to come back when the site is online again Link
Since your users actually have visited your service during the downtime, they, of course, would like to use the service. Therefore it makes sense to notify them when the site is online again. Obviously, you wouldn’t want to notify all users of the service that the site is back online. So it’s a good idea to make it possible for users to get notified when the service can be used again. The latter can be done either via e-mail, SMS or a tweet.
Soindustry makes offers its users to submit their e-mails to get notified when the site is online again.
8. Inform your visitors about the progress of the maintenance Link
Of course, many unexpected problems can occur during the maintenance, and it’s a good idea to keep your users informed about the progress. An instant feedback is important and let the user know that everything is going just fine and someone on the other side is working on the problem and that just a little portion of patience is required.
Further Resources Link
- Create a Memorable Maintenance Page71
Offers a brief overview of good maintenance pages as well as examples.
- Rails Maintenance Pages Done Right72
Tutorial for creating Rails maintenance pages.
- Creating a Down for Maintenance Page
From the Pylons Cookbook.
- Maintenance Mode Plugin73
Creates a splash page for maintenance in WordPress.
- Web 2.0 Error Pages Flickr Pool74
- Web 2.0 Offline Sightings Flickr Group75
- 1 /2007/07/25/wanted-your-404-error-pages/
- 2 /2007/08/17/404-error-pages-reloaded/
- 3 /2009/01/29/404-error-pages-one-more-time/
- 4 http://www.delicious.com
- 5 http://www.searchenginepeople.com/blog/social-communities-going-down-whos-got-personality.html
- 6 http://www.delicious.com/
- 7 http://twitter.com/
- 8 http://twitter.com/
- 9 http://google.com/adsense/
- 10 http://google.com/adsense/
- 11 http://apple.com
- 12 http://apple.com
- 13 http://mobileme.com
- 14 http://www.roughlydrafted.com/2008/07/11/mobileme-mac-rebranding-runs-into-snafus/
- 15 http://mobileme.com
- 16 http://last.fm/
- 17 http://last.fm/
- 18 http://twitter.com
- 19 http://twitter.com
- 20 http://www.etsy.com
- 21 http://www.etsy.com/
- 22 http://www.soundcloud.com/
- 23 http://www.soundcloud.com/
- 24 http://www.ning.com/
- 25 http://www.thecontentwrangler.com/article/software_as_a_service_changing_the_benefit_packages_it_organizations_offer/
- 26 http://www.ning.com/
- 27 http://www.reddit.com
- 28 http://www.reddit.com/
- 29 http://www.youtube.com
- 30 http://www.searchenginepeople.com/blog/social-communities-going-down-whos-got-personality.html
- 31 http://www.youtube.com/
- 32 http://www.mozilla.com/
- 33 http://www.flickr.com/photos/28791486@N03/2881731945/
- 34 http://www.mozilla.com/
- 35 http://www.flickr.com/photos/escapist/315166334/sizes/o/
- 36 http://www.flickr.com
- 37 http://www.flickr.com/
- 38 http://www.apartmentguide.com/
- 39 http://www.apartmentguide.com
- 40 http://www.grooveshark.com/
- 41 http://www.grooveshark.com/
- 42 http://www.stumbleupon.com
- 43 http://www.stumbleupon.com
- 44 http://www.naturalinstinct.com.au
- 45 http://www.naturalinstinct.com.au
- 46 http://www.istockphoto.com/
- 47 http://www.istockphoto.com/
- 48 http://blogger.com
- 49 http://blogger.com
- 50 http://www.linkedin.com/
- 51 http://geekswithblogs.net/yowhann/Default.aspx
- 52 http://www.linkedin.com/
- 53 http://www.studivz.de/
- 54 http://adriansauer.com/tag/service/
- 55 http://www.studivz.de/
- 56 http://www.librarything.com/
- 57 http://www.flickr.com/photos/etches-johnson/544274326/in/pool-web20error
- 58 http://www.librarything.com/
- 59 http://www.digg.com
- 60 http://www.digg.com
- 61 http://github.com
- 62 http://github.com
- 63 http://www.sears.com/
- 64 http://royal.pingdom.com/2008/12/01/sears-website-buckled-on-black-friday/
- 65 http://www.sears.com/
- 66 http://www.habbo.com/
- 67 http://www.habbo.com/
- 68 http://www.37signals.com/
- 69 http://www.techcrunch.com/tag/37signals/
- 70 http://www.37signals.com/
- 71 http://www.cssgirl.com/articles/2008/06/16/create-a-memorable-maintenance-page/
- 72 http://onehub.com/past/2009/3/6/rails_maintenance_pages_done_right/
- 73 http://sw-guide.de/wordpress/plugins/maintenance-mode/
- 74 http://www.flickr.com/groups/web20error/pool/
- 75 http://www.flickr.com/groups/offline/
Hold on, Tiger! Thank you for reading the article. Did you know that we also publish printed books and run friendly conferences – crafted for pros like you? Like SmashingConf New York, on June 14–15, with smart design patterns and front-end techniques.