<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>前端观察 &#187; 实践</title>
	<atom:link href="http://www.qianduan.net/tag/%e5%ae%9e%e8%b7%b5/feed" rel="self" type="application/rss+xml" />
	<link>http://www.qianduan.net</link>
	<description>专注于网站前端设计与前端开发</description>
	<lastBuildDate>Wed, 08 Feb 2012 05:05:28 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>404页面最佳实践</title>
		<link>http://www.qianduan.net/404-best-practices.html</link>
		<comments>http://www.qianduan.net/404-best-practices.html#comments</comments>
		<pubDate>Tue, 23 Jun 2009 15:02:22 +0000</pubDate>
		<dc:creator>神飞</dc:creator>
				<category><![CDATA[Tips]]></category>
		<category><![CDATA[404]]></category>
		<category><![CDATA[实践]]></category>
		<category><![CDATA[最佳]]></category>

		<guid isPermaLink="false">http://www.qianduan.net/?p=10764</guid>
		<description><![CDATA[一个网站上的404错误是服务器在请求资源找不到的时候发生的。一个设计合理的404错误页面不仅仅是网站完整性的一部分，还是网站的可用性的重要体现。好的404错误页面设计可以大大的增强... ]]></description>
			<content:encoded><![CDATA[<div> 原文：<a href="http://www.qianduan.net/404-best-practices.html">404页面最佳实践</a><br />
	译自：<a href="http://css-tricks.com/404-best-practices/" target="_blank">404 Best Practices</a><br />
	版权所有，转载请注明出处，多谢！</p>
<hr />
</div>
<p>一个网站上的<strong>404 错误</strong>是服务器在请求资源找不到的时候发生的。一个设计合理的404错误页面不仅仅是网站完整性的一部分，还是网站的可用性的重要体现。好的404错误页面设计可以大大的增强网站的用户体验。</p>
<p><span id="more-10764"></span></p>
<h3>1. 它应该看起来还是你的网站</h3>
<p>如果你不明确的告诉你的服务器如何处理404错误，它将默认提供一个单调而普通的错误页面。比如在一个白色的页面上显示&#8220;<strong>没找到</strong> &#8211;  请求的URL不能被找到&#8221;云云。对用户来说，这是毫无帮助的和相当痛苦的。一个404页面应该开起来像个错误页面，但是它也应该看起来仍然是你的网站。如果你在是用一个CMS，一般来说这已经为你处理好了。如果你使用一个静态网站，你可以通过你的.htaccess(Apache服务器)文件指定一个404模板。</p>
<p><img src="http://www.qianduan.net/wp-content/uploads/2009/06/looklikesite.jpg" alt="" title="" /></p>
<h3>2. 道歉</h3>
<p>没有人会<strong>主动</strong>访问你的404页面。最常见的是他们来自于你的网站或外部网站的一个坏链接。也许这个页面会让用户很不高兴，所以道歉是一个可以让他们皱着的眉头舒缓的绝佳方式。这也可以让用户减少对你的网站的抱怨。</p>
<p><a href="http://www.deviantart.com/404" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/dev404.jpg" alt="" title="" /></a></p>
<h3>3. 搜索</h3>
<p>可能用户寻找的页面依然存在，只是URL被改变了或者它的URL在某个地方被拼错了。由于你的网站应该已经拥有搜索功能了，这是一个非常重要的提供搜索框的好机会。这可以让用户很方便的搜索他们试图链接的内容并让他们自己找到正确的URL。</p>
<p><a href="http://github.com/404" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/git404.jpg" alt="" title="" /></a></p>
<h3>4. 给用户有用的链接</h3>
<p>或许他们链接进来的页面不是坏掉了，而是已经不存在了。除了搜索，你还可以想用户展示一些他们可能觉得有用的链接。或许链接到首页，或者是归档页面，或者是其它你已知的通常会访问或者在你的网站上很热门的页面？</p>
<p><a href="http://www.smashingmagazine.com/098324908234" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/sm404.png" alt="" title="" /></a></p>
<h3>5. 报告错误或联系的方式</h3>
<p>可能一个用户在遇到一个404页面的时候会有某种非常强烈的情绪。他们可能会很焦虑、担心，或者他们会被气疯了……让用户发泄是个不错的主意，因为你不可能成为他们的出气筒，所以一个联系表单可能就会凑效。当然，这不仅仅对他们有好处，对你也有好处，因为你可以找到问题然后去修正它或者预防它再次发生。</p>
<p><a href="http://www.carsonified.com/carsonified/goodbye-old-500-page" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/carson404.jpg" alt="" title="" /></a></p>
<h3>6. 自动报告</h3>
<p>让用户通过联系表单帮你报告错误是很不错的，但是只有很小比例的用户才可能会这样做。一个替代的方法是让你的404页面自动的将错误报告给你。有很多种方法可以实现。一个快速而且简洁的方式是将你的错误页面做成PHP文件，然后使用mail函数发送一封包括该URL的邮件给你。</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">&lt;?php</span>
  <span style="color: #990000;">mail</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;chriscoyier@gmail.com&quot;</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">&quot;404 report&quot;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$_SERVER</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'REQUEST_URI'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">&quot;From: chriscoyier@gmail.comn&quot;</span><span style="color: #009900;">&#41;</span>
<span style="color: #000000; font-weight: bold;">?&gt;</span></pre></div></div>

<p><em>注意:</em> 上面的代码可能对于小网站是合适的，但是并不适合大流量的网站。在这种情况下，将错误写入一个数据库可能更加有效。</p>
<h3>7. 幽默</h3>
<p>即便是严肃的网站也可以在404也页面上添加一些小幽默。这显然是一个放松和做一些有趣的事情的好机会。</p>
<p><a href="http://slonky.com/404" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/ohsnap.jpg"  alt="" title="" /></a></p>
<h3>8. 转向?</h3>
<p>事实上，我对此种做法持观望态度，但是自动的将404页面转向到其它页面是可行的。或许首页正显示一条关于这个错误的提示信息呢？或许一个包含来自于该页面的关键词的搜索页面被传递？</p>
<h3>9. 文件大小</h3>
<p>你可能会惊讶于你的服务器序号处理如此多的错误活动。不久前的意见令我惊讶的是有那么多的对<a href="http://css-tricks.com/weird-file-requests-and-easing-server-stress-with-htaccess/" target="_blank">“怪异”文件</a>的请求，比如在陌生的子目录请求或寻找并不存在的随机文件。当这些内容不出现的时候，服务器就会加载你的404页面。不必说，为所有的这些请求发送一个完整的页面会增加大量的带宽。最好的方法是与这些不好的请求做斗争，但是你也应该关注一下404页面的总大小并减小它——如果带宽是件很重要的事情的话，在错误请求很多的时候，404页面显然会浪费很多流量。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.qianduan.net/404-best-practices.html/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>有效的维护页面：实例与最佳实践</title>
		<link>http://www.qianduan.net/effective-maintenance-pages-examples-and-best-practices.html</link>
		<comments>http://www.qianduan.net/effective-maintenance-pages-examples-and-best-practices.html#comments</comments>
		<pubDate>Sat, 13 Jun 2009 08:27:10 +0000</pubDate>
		<dc:creator>神飞</dc:creator>
				<category><![CDATA[Resource]]></category>
		<category><![CDATA[ShowCase]]></category>
		<category><![CDATA[Tips]]></category>
		<category><![CDATA[实例]]></category>
		<category><![CDATA[实践]]></category>
		<category><![CDATA[维护]]></category>
		<category><![CDATA[设计]]></category>

		<guid isPermaLink="false">http://www.qianduan.net/?p=10578</guid>
		<description><![CDATA[每个网站在某个时间点或其它情况下都必须执行维护。无论仅仅是网站的部分升级还是因为网站的某些原因，这对网站所有者来说，都是不可避免的事实。而且，很多时候，维护需要你的网站... ]]></description>
			<content:encoded><![CDATA[<div>原文：<a href="http://www.qianduan.net/effective-maintenance-pages-examples-and-best-practices.html">有效的维护页面：实例与最佳实践</a><br />
译自：<a href="http://www.smashingmagazine.com/2009/06/12/effective-maintenance-pages-examples-and-best-practices/" target="_blank">Effective Maintenance Pages: Examples and Best Practices</a><br />
版权所有，转载请注明出处，多谢！<br />
<hr /></div>
<p>每个网站在某个时间点或其它情况下都必须执行<strong>维护</strong> 。无论仅仅是网站的部分升级还是因为网站的某些原因，这对网站所有者来说，都是不可避免的事实。而且，很多时候，维护需要你的网站至少断网几分钟。</p>
<p>那么，在你的网站将要关机维护的时候，你该做些什么呢？你当然不希望用户看到404页面或其它错误页面，而且你很希望可以鼓励他们很快回访你的网站而不是“稍后”，是吧？如果是这样的话，你将需要创建一个定制的维护页面。下面我们准备了一个<strong>制作有效的维护页面的</strong>的列表，它将有助于保留你的浏览者，无论是新访问者还是回访者。</p>
<p><span id="more-10578"></span></p>
<h3>1. 保持你的维护页面简单而又用</h3>
<p>维护页面的全部功能就是让用户知道你的网站还在运转而且<strong>维护只是临时的</strong>。不需要做任何超出这个的事情。确认一眼就能看懂你的这个页面是干嘛的，并为访问者提供他们感兴趣的信息。</p>
<p>另外一个对简单的维护页面很有用的功能是用多种语言展示你的维护信息。网站是国际化的，而且尽管你的很多浏览者可能能说一些英语，但是提供多种语言是很有帮助的。请谨慎使用在线翻译工具，因为很多时候，它们很不准确。你想让你的维护页面做的最后一件事情可能是进一步的迷惑人们——或者更坏——让他们反感。</p>
<p><a href="http://www.delicious.com" target="_blank">Delicious</a> 使用一条简单的信息(<a href="http://www.searchenginepeople.com/blog/social-communities-going-down-whos-got-personality.html" target="_blank">来源&#8230;</a>).</p>
<p><a href="http://www.delicious.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/del.jpg" alt="Maintenance Page Screenshot" width="464" height="176" /></a></p>
<p><a href="http://twitter.com/" target="_blank">Twitter</a> 维护页面提供直接的最少的信息，并保持一个简洁的设计，而且对用户依然是吸引人和友好的。</p>
<p><a href="http://twitter.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/twittermaintenance.jpg" alt="Maintenance Page Screenshot" width="480" height="388" /></a></p>
<p><a href="http://google.com/adsense/" target="_blank">Google的Adsense页面</a> 用多种语言提供了简洁的维护信息。</p>
<p><a href="http://google.com/adsense/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/adsense.jpg" alt="Maintenance Page Screenshot" width="480" height="199" /></a></p>
<p>而且有的时候，Google Adsense 仅仅用清晰的语言解释发生了什么事情和页面什么时候会重新上线。注意Google 同样消除用户的疑虑：收益将像平时一样被跟踪，而且在宕机时间广告目标不会受到影响。</p>
<p><a href="http://google.com/adsense/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/ga.gif" alt="Maintenance Page Screenshot" width="642" height="174" /></a></p>
<p>来自于<a href="http://apple.com" target="_blank">苹果店</a>的维护界面抓住了要点。</p>
<p><a href="http://apple.com" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/apple-store-down.jpg" alt="Maintenance Page Screenshot" width="480" height="161" /></a></p>
<p><a href="http://mobileme.com" target="_blank">MobileMe</a> 使用一个在视觉上吸引人的多语言的维护屏幕。</p>
<p><a href="http://mobileme.com" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/mob1.jpg" alt="Maintenance Page Screenshot" width="395" height="321" /></a></p>
<h3>2. 认识到这对你的用户是一种不便</h3>
<p>当你的网站宕机，对你的通常用户会很不方便。这是个简单的事实。但是不要让感到不便的用户变为疏远的用户。简单的承认你的网站的宕机对你的用户是件痛苦的事情常常就能够让他们满意了。为宕机道歉，为他们提供有用的信息，让他们感到你已经意识到了这对于他们意味着什么。</p>
<p><a href="http://last.fm/" target="_blank">Last.fm</a> 在他们的维护页面的上面的右侧放了个醒目的道歉。</p>
<p><a href="http://last.fm/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/last-fm-maintenance.jpg" alt="Maintenance Page Screenshot" width="480" height="282" /></a></p>
<p><a href="http://twitter.com" target="_blank">Twitter</a>提供了一种颇轻松的方式，不过依然致歉了，因为用户可能无法忍受宕机。</p>
<p><a href="http://twitter.com" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/twittermaintenance2.jpg" alt="Maintenance Page Screenshot" width="480" height="407" /></a></p>
<h3>3. 不要顾虑使用幽默</h3>
<p>没有必要因为你的网站当掉了就把一起搞的很严肃。使用一些小幽默或许可以然你的维护页面变得有趣，并帮助提高你的网站在那些因为宕机而感到不便的访问者眼中的印象。想象一下和你的网站内容有关的小天使可以被用幽默的手法描绘出来。无论它是在你的标志或吉祥物上做些小动作，或甚至是与你的网站没有一点儿关系的东西，肯定会有一个天使可以让你的维护页面变得有趣的。</p>
<p><a href="http://www.etsy.com" target="_blank">Etsy</a> 显示Halm 正在处理当前技术问题。主意Etsy 也传达了正在发生什么以及预计恢复时间。</p>
<p><a href="http://www.etsy.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/etsy.jpg" alt="Maintenance Page Screenshot" width="501" height="436" /></a></p>
<p><a href="http://www.soundcloud.com/" target="_blank">Soundcloud</a> 许诺会很快恢复并使用了一个双关来让维护页面变得醒目。(<a href="http://sublog.subimage.com/2008/08/26/when-it-rains-it-pours" target="_blank">来源&#8230;</a>).</p>
<p><a href="http://www.soundcloud.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/sound.gif" alt="Maintenance Page Screenshot" width="500" height="346" /></a></p>
<p><a href="http://www.ning.com/" target="_blank">Ning</a> 使用一个可爱的插画并且声明有经验的技术人员(图片)正在为了尽管让Ning上线而努力工作。(<a href="http://www.thecontentwrangler.com/article/software_as_a_service_changing_the_benefit_packages_it_organizations_offer/" target="_blank">来源&#8230;</a>).</p>
<p><a href="http://www.ning.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/ning.jpg" alt="Maintenance Page Screenshot" width="500" height="395" /></a></p>
<p><a href="http://www.reddit.com" target="_blank">Reddit</a>的维护页面使用了更多的信息，Reddits 可能不会停止使用Lisp&#8230;</p>
<p><a href="http://www.reddit.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/reddit.jpg" alt="Maintenance Page Screenshot" width="450" height="390" /></a></p>
<p><a href="http://www.youtube.com" target="_blank">YouTube</a> 貌似正忙于推出一些新的组合和配方。(<a href="http://www.searchenginepeople.com/blog/social-communities-going-down-whos-got-personality.html" target="_blank">来源&#8230;</a>)</p>
<p><a href="http://www.youtube.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/tube.jpg" alt="Maintenance Page Screenshot" width="500" height="259" /></a></p>
<p><a href="http://www.mozilla.com/" target="_blank">Mozilla</a>: 维修中&#8230;(<a href="http://www.flickr.com/photos/28791486@N03/2881731945/" target="_blank">来源&#8230;</a>).</p>
<p><a href="http://www.mozilla.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/mozilla.jpg" alt="Maintenance Page Screenshot" width="500" height="328" /></a></p>
<p><a href="http://revver.com/" target="_blank">Revver</a> (<a href="http://www.flickr.com/photos/escapist/315166334/sizes/o/" target="_blank">来源&#8230;</a>).</p>
<p><a href="http://revver.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/revv.jpg" alt="Maintenance Page Screenshot" width="347" height="387" /></a></p>
<p><a href="http://www.flickr.com" target="_blank">Flickr</a>的维护页面似乎不是很信息化的，但是很有趣。Flickr 正在享受按摩。</p>
<p><a href="http://www.flickr.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/flickr.gif" alt="Maintenance Page Screenshot" width="433" height="196" /></a></p>
<p><a href="http://www.flashden.net" target="_blank">FlashDen</a> 声明一个10秒中的宕机并提供一个在维护自己的卡通角色以博取访问者的笑容。</p>
<p><a href="http://www.flashden.net" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/flashden.jpg" alt="Maintenance Page Screenshot" width="480" height="338" /></a></p>
<p><a href="http://www.bloglines.com" target="_blank">Bloglines</a> 在网站宕机的时候使用一个管工的图片来做出解释。</p>
<p><a href="http://www.bloglines.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/bloglines.jpg" alt="Maintenance Page Screenshot" width="480" height="413" /></a></p>
<p><a href="http://www.apartmentguide.com/" target="_blank">Apartmentguide.com</a>: 在维护页面上使用维修工人的有一个例子。</p>
<p><a href="http://www.apartmentguide.com" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/apartmentguide_maintenance.jpg" alt="Maintenance Page Screenshot" width="480" height="333" /></a></p>
<h3>4. 为维护页面设计同样的外观</h3>
<p>你希望访问者立即意识到他们来到了正确的地方，即使你的网站和往常看起来灰常不一样。如果你的维护页面与你的正常网站没有相似性，那么很多访问者会觉得他们到了一个错误的URL，而可能不会去关注你的页面上说了些什么。</p>
<p>请确保你的维护页面包含了你的logo并和你的网站保持同样的用色。即使只用这两件事情就可以让访问者在遇到一个意外的页面的时候感到比较释然。</p>
<p><a href="http://www.grooveshark.com/" target="_blank">Grooveshark</a> 完整的保留了他们的头部和基本的色彩。</p>
<p><a href="http://www.grooveshark.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/maintenance-grooveshark.jpg" alt="Maintenance Page Screenshot" width="480" height="325" /></a></p>
<p><a href="http://www.stumbleupon.com" target="_blank">StumbleUpon</a>同样完整的保留了他们的头部和logo，甚至插画也是使用的他们的招牌色彩。</p>
<p><a href="http://www.stumbleupon.com" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/su.jpg" alt="Maintenance Page Screenshot" width="550" height="294" /></a></p>
<p><a href="http://www.naturalinstinct.com.au" target="_blank">Naturalinstinct</a> 使用了同样的配色方案并提供给用户替代的联系选项。</p>
<p><a href="http://www.naturalinstinct.com.au" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/naturalinstinct.jpg" alt="Maintenance Page Screenshot" width="480" height="339" /></a></p>
<h3>5. 告诉访问者你的网站什么时候可以恢复</h3>
<p>维护时间可能会有较大的变化。有的时候一个网站可能仅仅宕机几分钟，也可能会有一两个小时，甚至更长的时间。让用户知道你预计网站什么时候能够恢复并运行。这样他们将会了解什么时候他们在什么时候可以回来访问。一个公开的维护页面可以鼓励用户在几个小时甚至几天后会回访一下，看看网站是否恢复了。有些事情比如你将在5分钟后恢复会鼓励他们这样做的。</p>
<p><a href="http://www.istockphoto.com/" target="_blank">iStockPhoto</a>的维护页面告知访问者网站可能恢复正常的预计时间。</p>
<p><a href="http://www.istockphoto.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/istockphoto.jpg" alt="Maintenance Page Screenshot" width="480" height="218" /></a></p>
<p><a href="http://blogger.com" target="_blank">Blogger</a>使用一个包含网站预计恢复的时间的简单的页面。</p>
<p><a href="http://blogger.com" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/blogger.jpg" alt="Maintenance Page Screenshot" width="480" height="214" /></a></p>
<p><a href="http://www.linkedin.com/" target="_blank">Linkedin</a>让用户知道网站什么适合可以上线(<a href="http://geekswithblogs.net/yowhann/Default.aspx" target="_blank">来源&#8230;</a>).</p>
<p><a href="http://www.linkedin.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/linkedin.gif" alt="Maintenance Page Screenshot" width="550" height="316" /></a></p>
<p><a href="http://www.studivz.de/" target="_blank">StudiVZ</a>建议用户先喝杯茶（等一下），然后告知访问者网站将在8点钟上线。(<a href="http://adriansauer.com/tag/service/" target="_blank">来源&#8230;</a>).</p>
<p><a href="http://www.studivz.de/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/sv.jpg" alt="Maintenance Page Screenshot" width="563" height="389" /></a></p>
<h3>6. 提供推荐的内容</h3>
<p>在你的网站宕机的时候，将网站上的一些文章保存为静态页面，是一种在执行维护的时候为用户提供一些内容来阅读的方式。有些别的网站甚至推荐其它网站上的内容，通常他们认为这些内容他们的浏览器可能会比较感兴趣。在你的访问者等待你的网站恢复的时候为他们提供一些别的事情来做是向他们展示你的关怀以及你意识到这对他们造成了不便（上面第二条）的一个很棒的方法。</p>
<p><a href="http://www.librarything.com/" target="_blank">Librarything</a>宕机的图片建议在宕机的时候读一些书(<a href="http://www.flickr.com/photos/etches-johnson/544274326/in/pool-web20error" target="_blank">来源&#8230;</a>).</p>
<p><a href="http://www.librarything.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/lib.jpg" alt="Maintenance Page Screenshot" width="329" height="350" /></a></p>
<p><a href="http://www.digg.com" target="_blank">Digg</a> 提供一个他们认为用户会比较感兴趣的别的网站的内容列表。</p>
<p><a href="http://www.digg.com" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/digg.jpg" alt="Maintenance Page Screenshot" width="480" height="415" /></a></p>
<p><a href="http://github.com" target="_blank">Github</a> 在宕机的时候为用户提供一个有趣的YouTube视频来看。</p>
<p><a href="http://github.com" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/github-maintenance.jpg" alt="Maintenance Page Screenshot" width="480" height="289" /></a></p>
<p><a href="http://www.mixx.com" target="_blank">Mixx</a> 为用户提供一些他们的最受欢迎的Mixx的的故事</p>
<p><a href="http://www.mixx.com" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/mixx.jpg" alt="Maintenance Page Screenshot" width="480" height="433" /></a></p>
<p><a href="http://www.sears.com/" target="_blank">Sears</a> 不得不在黑色星期五关闭以增强网站。这个维护页面为用户提供更多的导航选项——比如Lands&#8217; End， Parts Direct 和Sears Credit (<a href="http://royal.pingdom.com/2008/12/01/sears-website-buckled-on-black-friday/" target="_blank">来源&#8230;</a>).</p>
<p><a href="http://www.sears.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/sears.gif" alt="Maintenance Page Screenshot" width="500" height="310" /></a></p>
<h3>7. 邀请你的访问者在网站恢复的时候回访</h3>
<p>因为你的用户确实在宕机的时候访问了你的服务，他们，当然会使用你们的服务。因此在网站恢复的时候提醒他们是有效的。显然，在网站恢复的时候，你可能不想告知服务的所有用户。所以，在网站恢复服务的时候让有需要的用户用户能够获得通知是个很好的主意。通知信件可以通过e-mail、手机短信或Twitter。</p>
<p><a href="http://soindustry.com" target="_blank">Soindustry</a> 允许用户通过提交他们的Email地址来获取网站恢复通知。</p>
<p><a href="http://soindustry.com" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/so.gif" alt="Maintenance Page Screenshot" width="428" height="290" /></a></p>
<h3>8. 告知你的访问者目前维护的进展情况</h3>
<p>当然，许多维护中未预料到的情况会发生，那么让你的用户了解进展情况也是个很好的主意。一个及时的反馈是很重要的，让用户知道一切很好而且在另一方面一些人正在解决这个问题，大家需要多一些耐心……云云。</p>
<p><a href="http://www.habbo.com/" target="_blank">Habbo</a>, 你可以约见朋友或交友的虚拟世界，在其维护页面提供了一个可爱的插画，并告知用户当前的维护进度。</p>
<p><a href="http://www.habbo.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/habbo.gif" alt="Maintenance Page Screenshot" width="545" height="495" /></a></p>
<p><a href="http://www.37signals.com/" target="_blank">37signals</a> 同样让用户跟进维护的状态。(<a href="http://www.techcrunch.com/tag/37signals/" target="_blank">来源&#8230;</a>).</p>
<p><a href="http://www.37signals.com/" target="_blank"><img src="http://www.qianduan.net/wp-content/uploads/2009/06/37s.gif" alt="Maintenance Page Screenshot" width="558" height="558" /></a></p>
<h4>关于原作者</h4>
<p><em>Cameron Chapman 是一个有六年经验的网站和图形设计师，她同时也写一些博客，包括她自己的博客<a href="http://cameronchapman.com" target="_blank">Cameron Chapman On Writing</a>。</em></p>
]]></content:encoded>
			<wfw:commentRss>http://www.qianduan.net/effective-maintenance-pages-examples-and-best-practices.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

