<?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>优艾点(UiSpot.com)&#124;生活的乐趣在于折腾 &#187; 404页面</title>
	<atom:link href="http://www.uispot.com/tag/404%e9%a1%b5%e9%9d%a2/feed" rel="self" type="application/rss+xml" />
	<link>http://www.uispot.com</link>
	<description>又一个 WordPress 站点</description>
	<lastBuildDate>Tue, 17 Jan 2012 01:41:11 +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>Hello! 404-漂亮美观的404错误页面设计</title>
		<link>http://www.uispot.com/20100906343.html</link>
		<comments>http://www.uispot.com/20100906343.html#comments</comments>
		<pubDate>Mon, 06 Sep 2010 04:30:04 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[前端开发]]></category>
		<category><![CDATA[404错误页面]]></category>
		<category><![CDATA[404页面]]></category>
		<category><![CDATA[网页设计]]></category>

		<guid isPermaLink="false">http://www.uispot.com/?p=343</guid>
		<description><![CDATA[之前有给大家介绍过几篇关于404错误页面的文章《404错误页面欣赏》《404错误页面欣赏-one more time》，今天在Tencent CDC Blog看到了一篇关于404错误页面的文章，给大家转载过来了，说的很全面，希望对大家有帮助。 1. 什么是404         404是一个 http 错误代码，即请求的网页不存在。代码404的第一个“4”代表客户端的错误，如错误的网页位址；后两的数字码则代表着特定的错误讯息。就是当用户输入了错误的链接时，返回的页面。这样的目的是告诉浏览者其所请求的页面不存在或链接错误，同时引导用户使用网站其他页面而不是关闭窗口离开。 Google简洁的页面与的品牌精神是一致的，包涵基本的出错提示和问题描述 　　 2. 为什么需要404页面         搜索引擎蜘蛛在请求某个URL时得到“404”状态回应时，即知道该URL已经失效，便不再索引该网页，并向数据中心反馈将该URL表示的网页从索引数据库中删除，当然，删除过程有可能需要很长时间；而当搜索引擎得到“200”状态码时，则会认为该URL是有效的，便会去索引，并会将其收录到索引数据库。所以，自定义404错误页面不仅是增强用户体验的好做法，而且对搜索引擎也是相当重要的。 　 3. 良好的404页面应该遵循的理念 ①提供简明的问题描述，用轻松的话语消除访客的挫败感，使得访客转到某个地方而不是后退。 ②提供合理的解决方案，辅助访客完成访问目标。 ③提供个性化的友好界面，提升访问体验。 用幽默的语言和亲切的贴纸画面打消用户的挫败感 http://dict.qq.com/404.html 　 4. NO! 拒绝乏味         一个拥有良好设计的404错误页面可以帮你避免失去用户的信任，潜在地建立你的用户关系并能留住你的用户，使其在浏览你的网站的时间更长。下面给大家带来一些创意的404界面设计参考，希望你能喜欢它们并能从中获取灵感： 方法① ：整体一致性 404页面同样需要保留本站的基础元素，让它看起来还是你的网站，让用户迷茫的时候能够回想起自己为何身在此处；   方法②： 让用户跟你走 给用户有用的链接，避免过于简单和技术，用丰富设计把用户拉回来，报告错误原因或提供联系方式，减少挫败感，减少那些痛苦的、毫无帮助的信息。增加建议让用户跟着你走, 利用转向将用户导入指定的页面； 　 方法③： 用轻松的手绘涂鸦风格 用轻松的手绘，表达放松的心情，404错误并不可怕，请原谅我们美丽的错误； 　   方法④： 精致的细节刻画 精致的设计往往可惜吸引用户驻足观看，仔细观察，生怕漏掉细节，当用户被精致打动的时候，对你的网站就会平添更多的怜爱之情； 　 方法⑤： 楚楚可人的道歉 用情感打动用户，挽留它们的关闭和离开； 　   方法⑥： [...]<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="4"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">无觅猜您也喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="40个令人振奋的单页网站设计欣赏" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100160.html&from=http%3A%2F%2Fwww.uispot.com%2F20100906343.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/19/23494043.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">40个令人振奋的单页网站设计欣赏</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="20个创意名片设计欣赏" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100228%2Fcreative-business-card-design-appreciation%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100906343.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/27/25867143.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">20个创意名片设计欣赏</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="一群猴子——标志设计" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20110625696.html&from=http%3A%2F%2Fwww.uispot.com%2F20100906343.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/15/22924378.png" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">一群猴子——标志设计</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="圣诞设计资源：圣诞老人[设计图集]" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20101214%2Fchristmas-design-resources-santa-claus%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100906343.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/22/24064937.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">圣诞设计资源：圣诞老人[设计图集]</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="4" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></description>
			<content:encoded><![CDATA[<p>之前有给大家介绍过几篇关于404错误页面的文章《<a title="Permanent Link to 404错误页面欣赏" rel="bookmark" href="http://www.uispot.com/2010/02/07/404-error-pages-recommend/">404错误页面欣赏</a>》《<a title="Permanent Link to 404错误页面欣赏-one more time" rel="bookmark" href="http://www.uispot.com/2010/03/01/404-error-pages-one-more-time/">404错误页面欣赏-one more time</a>》，今天在<a href="http://cdc.tencent.com" target="_blank">Tencent CDC Blog</a>看到了一篇关于404错误页面的文章，给大家转载过来了，说的很全面，希望对大家有帮助。</p>
<p><img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404banner1.jpg" alt="" width="730" height="250" /></p>
<p><strong>1. 什么是404</strong></p>
<p>        404是一个 http 错误代码，即请求的网页不存在。代码404的第一个“4”代表客户端的错误，如错误的网页位址；后两的数字码则代表着特定的错误讯息。就是当用户输入了错误的链接时，返回的页面。这样的目的是告诉浏览者其所请求的页面不存在或链接错误，同时引导用户使用网站其他页面而不是关闭窗口离开。</p>
<p><img src="http://cdc.tencent.com/wp-content/uploads/2010/09/google.jpg" alt="" width="459" height="206" /><br />
Google简洁的页面与的品牌精神是一致的，包涵基本的出错提示和问题描述</p>
<p>　　<br />
<strong>2. 为什么需要404页面</strong></p>
<p>        搜索引擎蜘蛛在请求某个URL时得到“404”状态回应时，即知道该URL已经失效，便不再索引该网页，并向数据中心反馈将该URL表示的网页从索引数据库中删除，当然，删除过程有可能需要很长时间；而当搜索引擎得到“200”状态码时，则会认为该URL是有效的，便会去索引，并会将其收录到索引数据库。所以，自定义404错误页面不仅是增强用户体验的好做法，而且对搜索引擎也是相当重要的。<br />
　</p>
<p><strong>3. 良好的404页面应该遵循的理念</strong></p>
<p>①提供简明的问题描述，用轻松的话语消除访客的挫败感，使得访客转到某个地方而不是后退。</p>
<p>②提供合理的解决方案，辅助访客完成访问目标。</p>
<p>③提供个性化的友好界面，提升访问体验。<br />
<img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404页面-4-404.jpg" alt="" width="701" height="360" /><br />
用幽默的语言和亲切的贴纸画面打消用户的挫败感</p>
<p><a href="http://dict.qq.com/404.html">http://dict.qq.com/404.html</a><br />
　</p>
<p><strong>4. NO! 拒绝乏味</strong></p>
<p>        一个拥有良好设计的404错误页面可以帮你避免失去用户的信任，潜在地建立你的用户关系并能留住你的用户，使其在浏览你的网站的时间更长。下面给大家带来一些创意的404界面设计参考，希望你能喜欢它们并能从中获取灵感：</p>
<p><strong>方法</strong>①<strong> ：整体一致性</strong></p>
<p>404页面同样需要保留本站的基础元素，让它看起来还是你的网站，让用户迷茫的时候能够回想起自己为何身在此处；<br />
<img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-1.jpg" alt="" width="543" height="1208" /></p>
<p><strong> </strong></p>
<p><strong>方法</strong>②： <strong>让用户跟你走</strong></p>
<p>给用户有用的链接，避免过于简单和技术，用丰富设计把用户拉回来，报告错误原因或提供联系方式，减少挫败感，减少那些痛苦的、毫无帮助的信息。增加建议让用户跟着你走, 利用转向将用户导入指定的页面；</p>
<p><img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-2-1.jpg" alt="" width="536" height="800" /></p>
<p><img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-2-21.jpg" alt="" width="510" height="684" /><br />
　</p>
<p><strong>方法</strong>③： <strong>用轻松的手绘涂鸦风格</strong></p>
<p>用轻松的手绘，表达放松的心情，404错误并不可怕，请原谅我们美丽的错误；<br />
<img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-3-11.jpg" alt="" width="704" height="900" /></p>
<p><img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-3-21.jpg" alt="" width="704" height="1000" /><br />
　</p>
<p><strong> </strong></p>
<p><strong>方法</strong>④： <strong>精致的细节刻画</strong></p>
<p>精致的设计往往可惜吸引用户驻足观看，仔细观察，生怕漏掉细节，当用户被精致打动的时候，对你的网站就会平添更多的怜爱之情；<br />
<img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-7-11.jpg" alt="" width="704" height="817" /><br />
　</p>
<p><strong>方法</strong>⑤：<strong> 楚楚可人的道歉</strong></p>
<p>用情感打动用户，挽留它们的关闭和离开；<br />
<img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-41.jpg" alt="" width="704" height="1000" /><br />
　</p>
<p><strong> </strong></p>
<p><strong>方法</strong>⑥： <strong>拟物化的场景烘托</strong></p>
<p>用实际物体为元素设计的404页面，可以更好的和本站的主题契合，实物有不可比拟的真实感，是一种很好的表现手段；</p>
<p><img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-5-12.jpg" alt="" width="704" height="1000" /></p>
<p><img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-5-21.jpg" alt="" width="704" height="887" /><br />
　</p>
<p><strong> </strong></p>
<p><strong>方法</strong>⑦：<strong> 幽默的手段和趣味情节</strong></p>
<p>老奶奶找不到自己的宠物了！Oh~~原来坐在了屁股底下……</p>
<p>多么可爱的错误啊，看到这一切，您还会为404的小错误生气么？放松一下，给错误带上幽默的情节，原来错误也可以很美……<br />
<img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-6-11.jpg" alt="" width="704" height="832" /></p>
<p><img src="http://cdc.tencent.com/wp-content/uploads/2010/09/404pic-6-21.jpg" alt="" width="704" height="817" /></p>
<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="4"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">无觅猜您也喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="40个令人振奋的单页网站设计欣赏" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F2010012160.html&from=http%3A%2F%2Fwww.uispot.com%2F20100906343.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/19/23494043.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">40个令人振奋的单页网站设计欣赏</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="圣诞设计资源：圣诞老人[设计图集]" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F201012559.html&from=http%3A%2F%2Fwww.uispot.com%2F20100906343.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/22/24064937.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">圣诞设计资源：圣诞老人[设计图集]</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="一群猴子——标志设计" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20110625%2Flogo-design-monkeys%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100906343.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/15/22924378.png" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">一群猴子——标志设计</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="40个非常漂亮的3D字体设计欣赏" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100121%2F40-very-beautiful-font-design-3d-appreciate%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100906343.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/11/22096753.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">40个非常漂亮的3D字体设计欣赏</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="4" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></content:encoded>
			<wfw:commentRss>http://www.uispot.com/20100906343.html/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>404错误页面欣赏-one more time</title>
		<link>http://www.uispot.com/20100301243.html</link>
		<comments>http://www.uispot.com/20100301243.html#comments</comments>
		<pubDate>Mon, 01 Mar 2010 00:23:20 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[前端开发]]></category>
		<category><![CDATA[404错误页面]]></category>
		<category><![CDATA[404页面]]></category>
		<category><![CDATA[网页设计]]></category>

		<guid isPermaLink="false">http://www.uispot.com/?p=243</guid>
		<description><![CDATA[在404错误页面的设计往往被忽视和低估。然而，仔细设计这些网页可以让随机访客多停留在你的网站看看其他内容，并最终找到需要的信息。有效沟通的404错误页面主要是为某个特定的网页无法显示和哪些用户可以下一步的行动做提示用的。并且搜索框和有用的资源列表（可能与失踪页）可在这种情况下是有帮助的。 在之前我们已经介绍多次404错误页面的设计。在这里，我们会再介绍404错误页面网页设计的一些有趣的和有用的想法。现在，它将为404错误页面的设计提供新鲜的灵感。本文介绍了50个漂亮的404错误页面的设计的例子。其中有些是美丽的，但并不方便，有些是用户友好的，但没有真正美丽。请把他们当作灵感来源的例子来看待，并希望这些实例可以让需要的童鞋们都能各取所需。 [ 号外：404错误页面欣赏 ] 美丽的404错误页 Cut &#38; Taste 在搜索框中突出公告。 Beautiful!美丽的！ Productplanner ProductPlanner产品完美地结合在网站的整体品牌的404错误页面。 Mundofox.com Duoh.com Apartmenthomeliving.com 相当不寻常的404从一个网站，帮助人们寻找公寓错误页面。 Chrisglass.com Huwshimi.com ilovetypography.com Newspond Brightkit jhuskisson.com Gog.com User-Friendly 404 Error Pages RealMacSoftware.com InspirationBit 45royale Ma.gnolia.com 在404页面中获得乐趣！ 是的，有趣！因为404也是一个地方，你能证明你的幽默感。你有机会，所以利用好！ www.techkultura.com 关于帕维尔Opydo的博客：“金对武士编号规则：如果这不是您的网页寻找的，你必须做切腹。” Abduzeedo Abduzeedo建议为找到正确的思想和文章，并列出了最近流行的博客文章以及标签云。 Habrahabr CSS Remix 这家伙是很害怕！ Pattern Tap 不要生气，不要哭。 Pattern Tap将在对失踪页的负担。 New Yorker 纽约人杂志的创刊于1925年，但它肯定是与它有自己的404。 Frye/Wiles 弗莱/尔斯创意机构。 Heinz 404已知的最好的番茄酱。 Chelmsford Library [...]<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="4"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">无觅猜您也喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="在twitter你应该follow的设计师们" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20101212%2Fpeople-you-have-to-be-following-on-twitter%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100301243.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/13/22646416.png" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">在twitter你应该follow的设计师们</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="全球著名插画艺术家作品赏析(一)" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100306%2Fappreciation-of-world-renowned-illustrator-artists-part-one%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100301243.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/09/02/27141011.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">全球著名插画艺术家作品赏析(一)</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="怎样让自己变的更有主见？" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20110630%2Fhow-to-make-yourself-become-more-assertive%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100301243.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">怎样让自己变的更有主见？</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="[转]是什么浪费了我的上网时间？" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20110418%2Fwaste-internet-times%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100301243.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">[转]是什么浪费了我的上网时间？</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="4" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></description>
			<content:encoded><![CDATA[<p>在404错误页面的设计往往被忽视和低估。然而，仔细设计这些网页可以让随机访客多停留在你的网站看看其他内容，并最终找到需要的信息。有效沟通的404错误页面主要是为某个特定的网页无法显示和哪些用户可以下一步的行动做提示用的。并且搜索框和有用的资源列表（可能与失踪页）可在这种情况下是有帮助的。</p>
<p>在之前我们已经介绍多次404错误页面的设计。在这里，我们会再介绍404错误页面网页设计的一些有趣的和有用的想法。现在，它将为404错误页面的设计提供新鲜的灵感。本文介绍了50个漂亮的404错误页面的设计的例子。其中有些是美丽的，但并不方便，有些是用户友好的，但没有真正美丽。请把他们当作灵感来源的例子来看待，并希望这些实例可以让需要的童鞋们都能各取所需。</p>
<p>[ 号外：<a href="http://www.uispot.com/2010/02/07/404-error-pages-recommend/">404错误页面欣赏</a> ]</p>
<h3>美丽的404错误页</h3>
<p><a href="http://cutandtaste.com/404">Cut &amp; Taste</a><br />
在搜索框中突出公告。 Beautiful!美丽的！</p>
<p><a href="http://cutandtaste.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/cut.gif" alt="Cut in 404 Error Pages, One More Time" width="500" height="353" /></a></p>
<p><a href="http://productplanner.com/404">Productplanner</a><br />
ProductPlanner产品完美地结合在网站的整体品牌的404错误页面。</p>
<p><a href="http://productplanner.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/chalk.jpg" alt="Chalk in 404 Error Pages, One More Time" width="480" height="280" /></a></p>
<p><a href="http://mundofox.com/404">Mundofox.com</a></p>
<p><a href="http://mundofox.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/simp.gif" alt="Simp in 404 Error Pages, One More Time" width="480" height="386" /></a></p>
<p><a href="http://www.duoh.com/404">Duoh.com</a></p>
<p><a href="http://www.duoh.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/duoh.jpg" alt="Duoh in 404 Error Pages, One More Time" width="480" height="364" /></a></p>
<p><a href="http://www.apartmenthomeliving.com/404.html">Apartmenthomeliving.com</a><br />
相当不寻常的404从一个网站，帮助人们寻找公寓错误页面。</p>
<p><a href="http://www.apartmenthomeliving.com/404.html"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/apa.jpg" alt="Apa in 404 Error Pages, One More Time" width="480" height="379" /></a></p>
<p><a href="http://chrisglass.com/404">Chrisglass.com</a></p>
<p><a href="http://chrisglass.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/chris.jpg" alt="Chris in 404 Error Pages, One More Time" width="480" height="400" /></a></p>
<p><a href="http://huwshimi.com/404/">Huwshimi.com</a></p>
<p><a href="http://huwshimi.com/404/"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/ninja.jpg" alt="Ninja in 404 Error Pages, One More Time" width="480" height="472" /></a></p>
<p><a href="http://ilovetypography.com/404">ilovetypography.com</a></p>
<p><a href="http://ilovetypography.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/ilt.gif" alt="Ilt in 404 Error Pages, One More Time" width="480" height="399" /></a></p>
<p><a href="http://www.newspond.com/404">Newspond</a></p>
<p><a href="http://www.newspond.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/newspond.gif" alt="Newspond in 404 Error Pages, One More Time" width="480" height="455" /></a></p>
<p><a href="http://brightkit.com/404">Brightkit</a></p>
<p><a href="http://brightkit.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/milk.jpg" alt="Milk in 404 Error Pages, One More Time" width="480" height="300" /></a></p>
<p><a href="http://www.jhuskisson.com/404/">jhuskisson.com</a></p>
<p><a href="http://www.jhuskisson.com/404/"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/14.jpg" alt="14 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.gog.com/en/error/404">Gog.com</a></p>
<p><a href="http://www.gog.com/en/error/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/gog.jpg" alt="Gog in 404 Error Pages, One More Time" width="480" height="281" /></a></p>
<h3>User-Friendly 404 Error Pages</h3>
<p><a href="http://www.realmacsoftware.com/rapidweaver/overview/404">RealMacSoftware.com</a></p>
<p><a href="http://www.realmacsoftware.com/rapidweaver/overview/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/rapid.jpg" alt="Rapid in 404 Error Pages, One More Time" width="480" height="435" /></a></p>
<p><a href="http://www.inspirationbit.com/404">InspirationBit</a></p>
<p><a href="http://www.inspirationbit.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/bit.gif" alt="Bit in 404 Error Pages, One More Time" width="480" height="339" /></a></p>
<p><a href="http://www.45royale.com/404">45royale</a></p>
<p><a href="http://www.45royale.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/uh.gif" alt="Uh in 404 Error Pages, One More Time" width="480" height="248" /></a></p>
<p><a href="http://ma.gnolia.com/404">Ma.gnolia.com</a></p>
<p><a href="http://ma.gnolia.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/mag.gif" alt="Mag in 404 Error Pages, One More Time" width="480" height="309" /></a></p>
<h3>在404页面中获得乐趣！</h3>
<p>是的，有趣！因为404也是一个地方，你能证明你的幽默感。你有机会，所以利用好！</p>
<p><a href="http://www.techkultura.com/404">www.techkultura.com</a><br />
关于帕维尔Opydo的博客：“金对武士编号规则：如果这不是您的网页寻找的，你必须做切腹。”</p>
<p><a href="http://www.techkultura.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/02.jpg" alt="02 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://abduzeedo.com/404">Abduzeedo</a><br />
Abduzeedo建议为找到正确的思想和文章，并列出了最近流行的博客文章以及标签云。<a href="http://abduzeedo.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/houston.gif" alt="Houston in 404 Error Pages, One More Time" width="480" height="426" /></a></p>
<p><a href="http://habrahabr.ru/showme404/">Habrahabr</a></p>
<p><a href="http://habrahabr.ru/showme404/"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/habr.gif" alt="Habr in 404 Error Pages, One More Time" width="480" height="350" /></a></p>
<p><a href="http://cssremix.com/archives/1353">CSS Remix</a></p>
<p>这家伙是很害怕！</p>
<p><a href="http://cssremix.com/archives/1353"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/remix.gif" alt="Remix in 404 Error Pages, One More Time" width="480" height="314" /></a></p>
<p><a href="http://patterntap.com/404">Pattern Tap</a><br />
不要生气，不要哭。 Pattern Tap将在对失踪页的负担。</p>
<p><a href="http://patterntap.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/07.jpg" alt="07 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.newyorker.com/404">New Yorker</a><br />
纽约人杂志的创刊于1925年，但它肯定是与它有自己的404。</p>
<p><a href="http://www.newyorker.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/26.jpg" alt="26 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://fryewiles.com/templateserrors/404.html">Frye/Wiles</a><br />
弗莱/尔斯创意机构。</p>
<p><a href="http://fryewiles.com/templateserrors/404.html"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/08.jpg" alt="08 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://heinz.com/404.aspx">Heinz</a><br />
404已知的最好的番茄酱。</p>
<p><a href="http://heinz.com/404.aspx"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/37.jpg" alt="37 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.chelmsfordlibrary.org/smashing_magazine">Chelmsford Library</a><br />
 OMG，碎杂志中缺少斯福德公共图书馆！</p>
<p><a href="http://www.chelmsfordlibrary.org/smashing_magazine"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/22.jpg" alt="22 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://sfbay.craigslist.org/404/">Craigslist</a><br />
一个ASCII Craigslist的404错误页面。</p>
<p><a href="http://sfbay.craigslist.org/404/"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/ascii.gif" alt="Ascii in 404 Error Pages, One More Time" width="307" height="211" /></a></p>
<p><a href="http://www.thetruth.com/404">The Truth</a><br />
这是事实果真如此吗？</p>
<p><a href="http://www.thetruth.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/01.jpg" alt="01 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.wulffmorgenthaler.com/error.htm">Wulffmorgenthaler</a><br />
归咎于Wulffmorgenthaler奇怪的海狸。</p>
<p><a href="http://www.wulffmorgenthaler.com/error.htm"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/17.jpg" alt="17 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://henrikhedegaard.com/404/404.html">Henrik Hedegaard</a><br />
亨里克赫泽高似乎像辛普森。</p>
<p><a href="http://henrikhedegaard.com/404/404.html"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/woop.jpg" alt="Woop in 404 Error Pages, One More Time" width="480" height="289" /></a></p>
<p><a href="http://notaniche.com/404">NotaNiche</a><br />
刷新，看到了未来有趣的图片。 A blog by Alexander Frison.由亚历山大弗里松博客。</p>
<p><a href="http://notaniche.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/04.jpg" alt="04 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.dazeofourlives.com/404">Daze of Our Lives</a><br />
 “无论狄更斯所谓的”错误404“是我没有在foggiest的想法，但有发生。 You can&#8217;t trust this wretched technology, can you?”你不能相信这个倒霉的技术，可以吗？“</p>
<p><a href="http://www.dazeofourlives.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/dickens.gif" alt="Dickens in 404 Error Pages, One More Time" width="480" height="246" /></a></p>
<p><a href="http://www.limpfish.com/404">Limpfish</a><br />
通缉：一个网页。</p>
<p><a href="http://www.limpfish.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/wanted.gif" alt="Wanted in 404 Error Pages, One More Time" width="366" height="392" /></a></p>
<p><a href="http://www.orangecoat.com/404">Orangecoat</a><br />
“尽管在您的点击中出了一点小小的意外。但是这些事情发生，我们将竭尽所能，以确保您保持正确的方向前进。Orangecoat给出了404错误思想的地图。</p>
<p><a href="http://www.orangecoat.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/dear.gif" alt="Dear in 404 Error Pages, One More Time" width="511" height="339" /></a></p>
<p><a href="http://www.kochatelier-berlin.de/404-fehler/">Kochatelier Berlin</a><br />
 404面包的烹饪机构的网站。</p>
<p><a href="http://www.kochatelier-berlin.de/404-fehler/"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/bread.gif" alt="Bread in 404 Error Pages, One More Time" width="480" height="379" /></a></p>
<p><a href="http://www.dawdle.com/404">Dawdle</a><br />
马里奥偶尔进入了错误的城堡。</p>
<p><a href="http://www.dawdle.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/mario.gif" alt="Mario in 404 Error Pages, One More Time" width="480" height="316" /></a></p>
<p><a href="http://css-tricks.com/0404">CSS-Tricks</a><br />
克里斯Coyier需要在代码仔细看看。</p>
<p><a href="http://css-tricks.com/0404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/uh2.gif" alt="Uh2 in 404 Error Pages, One More Time" width="401" height="418" /></a></p>
<p><a href="http://nikibrown.com/404">Niki Brown</a><br />
尼基布朗鼓励她旅客“不要害怕”，并告诉他们一个美丽的鼠标的例证。</p>
<p><a href="http://nikibrown.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/niki.gif" alt="Niki in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.twitter.com/404">Twitter</a><br />
 Twitter的使用简约而诱人的404错误页面。</p>
<p><a href="http://www.twitter.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/twitter.gif" alt="Twitter in 404 Error Pages, One More Time" width="480" height="356" /></a></p>
<p><a href="http://livadaru.net/404">Livadaru</a><br />
荷马的克里斯蒂安利瓦达鲁博客。</p>
<p><a href="http://livadaru.net/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/05.jpg" alt="05 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.artthugstudios.com/error404.html">ARTTHUG Studios</a><br />
还是荷马，这次是在ARTTHUG工作室。</p>
<p><a href="http://www.artthugstudios.com/error404.html"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/10.jpg" alt="10 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.cubeecraft.com/character404.html">Cubeecraft</a><br />
错误Cubee（你可以下载并让自己）在Cubeecraft。</p>
<p><a href="http://www.cubeecraft.com/character404.html"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/06.jpg" alt="06 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.d20srd.org/404-not-found">d20 SRD</a><br />
一个残酷的 d20 SDR  错误!</p>
<p><a href="http://www.d20srd.org/404-not-found"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/19.jpg" alt="19 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://homestarrunner.com/404">HomeStar Runner</a></p>
<p><a href="http://homestarrunner.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/40.jpg" alt="40 in 404 Error Pages, One More Time" /></a></p>
<h3>动画？ Sure!当然！</h3>
<p> 404不仅要对图形。下面，你会发现404动画的例子。</p>
<p><a href="http://www.markfennell.com/404.html">Mark Fennell</a><br />
在Mark Fennell他404提供&#8230;游戏！</p>
<p><a href="http://www.markfennell.com/404.html"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/12.jpg" alt="12 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.project-euh.com/404/?">Project Euh</a><br />
Project Euh? 只要按一下，进入一个随机的网站。</p>
<p><a href="http://www.project-euh.com/404/?"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/11.jpg" alt="11 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.tinsanity.net/404.shtml">Total Insanity</a><br />
Total Insanity 为我们展示了疯狂的真正意义。</p>
<p><a href="http://www.tinsanity.net/404.shtml"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/24.jpg" alt="24 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.herr-nilsson.com/404">Herr Nilsson</a><br />
这404错误页面提取404鸣叫，实时显示他们。</p>
<p><a href="http://www.herr-nilsson.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-error-pages/404.gif" alt="404 in 404 Error Pages, One More Time" width="480" height="347" /></a></p>
<p><a href="http://cricketfeet.com/error">Cricket Feet</a><br />
一款类似会谈记录的404错误页面。</p>
<p><a href="http://cricketfeet.com/error"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/18.jpg" alt="18 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.bluedaniel.com/404">Bluedaniel</a><br />
Daniel Karcher的电影设计工作室。</p>
<p><a href="http://www.bluedaniel.com/404"><img src="http://media.smashingmagazine.com/cdn_smash/images/404-errors-reloaded/03.jpg" alt="03 in 404 Error Pages, One More Time" /></a></p>
<p><a href="http://www.smashingmagazine.com/2009/01/29/404-error-pages-one-more-time/">via</a></p>
<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="4"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">无觅猜您也喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="全球著名插画艺术家作品赏析(一)" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100306%2Fappreciation-of-world-renowned-illustrator-artists-part-one%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100301243.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/09/02/27141011.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">全球著名插画艺术家作品赏析(一)</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="在twitter你应该follow的设计师们" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20101212%2Fpeople-you-have-to-be-following-on-twitter%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100301243.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/13/22646416.png" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">在twitter你应该follow的设计师们</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="[转]是什么浪费了我的上网时间？" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20110418%2Fwaste-internet-times%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100301243.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">[转]是什么浪费了我的上网时间？</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="怎样让自己变的更有主见？" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20110630%2Fhow-to-make-yourself-become-more-assertive%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100301243.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">怎样让自己变的更有主见？</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="4" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></content:encoded>
			<wfw:commentRss>http://www.uispot.com/20100301243.html/feed</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>404错误页面欣赏</title>
		<link>http://www.uispot.com/20100207166.html</link>
		<comments>http://www.uispot.com/20100207166.html#comments</comments>
		<pubDate>Sun, 07 Feb 2010 07:13:07 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[佳作欣赏]]></category>
		<category><![CDATA[404错误页面]]></category>
		<category><![CDATA[404页面]]></category>
		<category><![CDATA[小沈阳]]></category>
		<category><![CDATA[网站设计]]></category>

		<guid isPermaLink="false">http://www.uispot.com/?p=166</guid>
		<description><![CDATA[今天收集上来10个我觉得较有意思的404页面，大家在需要制作404的时候可以参考参考。 404错误页面经常被人忽略，在我们身边的网站有太多千篇一律的404错误页面，其实一个好看的404错误页面对一个网站来说是很重要的！它能吸引和引导那些初次访问你错误页面的访客，使之成为你的读者，甚至是订阅者。从404错误页面的设计中也可以看出整个网站的风格。 1、Chairboy 流着眼泪的男孩。   2、CurtGranger   3、Duoh 看起来挺抽象的一个。 4、Foto Union 。 5、Scrnshots   6、Shockmesane 7、The Brand Surgery 那俩老外貌似想抓什么东西。   8、The Truth 真相在404错误页面之后，大概意思是这样吧？ 9、Walking Limb 10、HomeStar Runner 手写文字+手绘图片，打开还有声音。挺有趣的。 &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8211;  童鞋们补充收集（谢谢分享哦~） &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;- 小沈阳版404页面（分享者：喂喂）   无觅猜您也喜欢： Hello! 404-漂亮美观的404错误页面设计 404错误页面欣赏-one more time 应该怎么做一个友好的404错误页面 40个令人振奋的单页网站设计欣赏 无觅<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="4"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">无觅猜您也喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="Hello! 404-漂亮美观的404错误页面设计" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100906%2Fhello-404-design%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100207166.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/09/16/31265666.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">Hello! 404-漂亮美观的404错误页面设计</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="404错误页面欣赏-one more time" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100301%2F404-error-pages-one-more-time%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100207166.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/05/21168511.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">404错误页面欣赏-one more time</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="应该怎么做一个友好的404错误页面" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20110801569.html&from=http%3A%2F%2Fwww.uispot.com%2F20100207166.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">应该怎么做一个友好的404错误页面</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="40个令人振奋的单页网站设计欣赏" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100121%2F40-inspiring-single-page-websites%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100207166.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/19/23494043.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">40个令人振奋的单页网站设计欣赏</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="4" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></description>
			<content:encoded><![CDATA[<p>今天收集上来10个我觉得较有意思的404页面，大家在需要制作404的时候可以参考参考。</p>
<p><strong>404错误页面</strong>经常被人忽略，在我们身边的网站有太多千篇一律的404错误页面，其实一个好看的404错误页面对一个网站来说是很重要的！它能吸引和引导那些初次访问你错误页面的访客，使之成为你的读者，甚至是订阅者。从404错误页面的设计中也可以看出整个网站的风格。</p>
<p>1、<a href="http://www.chairboy.com/File_Not_Found/vale_of_tears.html" target="_blank">Chairboy</a> 流着眼泪的男孩。</p>
<div><a id="spPreviewLink" rel="nofollow" href="http://yjwwew.blu.livefilestore.com/y1pOa2cOL37umwnr64BosnTgu_ygizcXwioa8MfFA3gaeqM2xp-j9kTMFu8hffmWUOlhf8ZIncVNRFKnO36vOOzNs7Uci0ENxF4/1.jpg"><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1pOa2cOL37umwnr64BosnTgu_ygizcXwiok6IHYvrsksufXzaX22fesBs20VJHjvvwd7sLNwIfy4Kawj9vWwkbh4eux6Y3Egft/1.jpg" alt="" width="500" height="400" /> </a><a href="http://www.monkeyis.cn/upload/201001290045496722.jpg"></a></div>
<div> </div>
<div>2、<a href="http://www.curtgranger.com/404" target="_blank">CurtGranger</a></div>
<div><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1pYZ3aGDrvtUVj-RWx6edjoJEyPt00oe_kSXfv7c3G1tFZQHumnvUDYhY4qI2bbVHWW48GIJD4hWzWZ1EZzgyyXULNhZAJCKkB/2.jpg" alt="" width="500" height="400" /></div>
<div> </div>
<div><a href="http://www.monkeyis.cn/upload/201001290046435861.jpg"></a>3、<a href="http://www.duoh.com/404" target="_blank">Duoh</a> 看起来挺抽象的一个。</div>
<div><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1pcwUlFfzcnHkt5tnvPBhsy_WjpSlxie7MCYCZe5CBDav-qEZsH4wc5oSftQ5VcI-fzGpIiGFh-rSvozVAC6ssKpfx-v3d6MHo/3.jpg" alt="" width="500" height="400" /></div>
<p>4、<a href="http://www.foto-union.de/404" target="_blank">Foto Union</a> 。</p>
<p><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1p3iWm0vSxn3SP9-La0RwsMHDTq3sED9v3VLbqMOEcXv5RDW3vfv4o5JCMak_19zEx9k2lNzn5D3OvXVeapt30lGTXdCPffb0i/4.jpg" alt="" width="500" height="400" /></p>
<p>5、<a href="http://www.scrnshots.com/404" target="_blank">Scrnshots</a></p>
<div><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1pwLfEBCm_5CRaIdBudXdhIiFja_cA1MLus_muYdqRz_ncbkSC-h6mdm9kTDRW8_QyZNzO_13IfrAjb-8mrM-63jGk3VfLJvZn/5.jpg" alt="" width="500" height="400" /><a href="http://www.monkeyis.cn/upload/201001290050566276.jpg"></a></div>
<div> </div>
<div>6、<a href="http://shockmesane.net/404.htm" target="_blank">Shockmesane</a></div>
<div><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1pvW_KpGM-1R8eNv-Y7U0Oobuo3jjWHBXusE5E8lA0sX81jBb2nuW0Aq3OJTn351hNH_2MNpaVXeX9TwAdXXm5IJuSNRvtKp-j/6.jpg" alt="" width="500" height="400" /></div>
<p>7、<a href="http://www.thebrandsurgery.co.uk/404" target="_blank">The Brand Surgery</a> 那俩老外貌似想抓什么东西。</p>
<div><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1p-bgyYW-ybiINUFWrT41teMrQOkLBLNR6Pv-v4iuIhMU4K5UaFRiK95pY0VRMsytG5cp5W_gFoYnnPMYdD2oRqAz90g6p3yJx/7.jpg" alt="" width="500" height="400" /></div>
<div> </div>
<div><a href="http://www.monkeyis.cn/upload/201001290052388681.jpg"></a>8、<a href="http://www.thetruth.com/404" target="_blank">The Truth</a> 真相在404错误页面之后，大概意思是这样吧？</div>
<p><a href="http://www.monkeyis.cn/upload/201001290053257243.jpg"></a></p>
<div id="spPreviewContainer"><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1pSN8pHbP9hwBv6FN6ZZL-sCnMlwV5lPJ6lLCd3H1_amAs9KKwb1mTcPXdBc5gVV4iUHZeXWKmPA2xHNvcrZ-35vPnrkeEoNEX/8.jpg" alt="" width="500" height="400" /></div>
<p>9、<a href="http://wakinglimb.com/404/" target="_blank">Walking Limb</a></p>
<p><a href="http://www.monkeyis.cn/upload/201001290054276570.jpg"></a></p>
<div id="spPreviewContainer"><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1pHJRYUEF8EL0U_nUx0lAclFbCMgnwBjNzuYNU53ml-72P9cgGxTMgsdTcT9jYxBXKkVAmu1LfPTQXCFkOVe_Vg8W_b97VqlEV/9.jpg" alt="" width="500" height="400" /></div>
<p>10、<a href="http://homestarrunner.com/404" target="_blank">HomeStar Runner</a> 手写文字+手绘图片，打开还有声音。挺有趣的。</p>
<div id="spPreviewContainer"><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1pe15bnGRDsEPg6g8RCNq-k8MqUbQJxHAhP-OW2bZ2nJTFBSobET5cBbOStWk3ZDqcAAzvE1qFyBdXCe2okZxfM_-4P4Ft6Qjt/10.jpg" alt="" width="500" height="400" /></div>
<p>&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8211;  <span style="color: #ff0000;">童鞋们补充收集（谢谢分享哦~） </span>&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;-</p>
<p>小沈阳版404页面（分享者：<a href="http://penfanbaike.com/" target="_blank">喂喂</a><em>）</em></p>
<p><img id="spPreviewImage" src="http://yjwwew.blu.livefilestore.com/y1p1-fICbdBmb3gtAna9GgHmN9dnpqIKURx4E77JB0qt6yhRf0LG29NzMOKWkuNDewLXI2GRLvdXwC5CdMJpUsvjMsJzB-nZkdN/404.jpg" alt="" width="557" height="600" /></p>
<p><em> </em></p>
<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="4"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">无觅猜您也喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="Hello! 404-漂亮美观的404错误页面设计" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100906%2Fhello-404-design%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100207166.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/09/16/31265666.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">Hello! 404-漂亮美观的404错误页面设计</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="404错误页面欣赏-one more time" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100301%2F404-error-pages-one-more-time%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100207166.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/05/21168511.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">404错误页面欣赏-one more time</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="应该怎么做一个友好的404错误页面" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20110801569.html&from=http%3A%2F%2Fwww.uispot.com%2F20100207166.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">应该怎么做一个友好的404错误页面</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="40个令人振奋的单页网站设计欣赏" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.uispot.com%2F20100121%2F40-inspiring-single-page-websites%2F&from=http%3A%2F%2Fwww.uispot.com%2F20100207166.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/08/19/23494043.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">40个令人振奋的单页网站设计欣赏</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="4" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></content:encoded>
			<wfw:commentRss>http://www.uispot.com/20100207166.html/feed</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
	</channel>
</rss>

