<?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.ishowsky.cn/tag/%e8%89%b2%e5%bd%a9/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.ishowsky.cn</link>
	<description>秀出网络的精彩</description>
	<lastBuildDate>Fri, 03 Feb 2012 06:25:06 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>用户体验呓语</title>
		<link>http://www.ishowsky.cn/2010/11/user-experience/</link>
		<comments>http://www.ishowsky.cn/2010/11/user-experience/#comments</comments>
		<pubDate>Wed, 17 Nov 2010 07:53:01 +0000</pubDate>
		<dc:creator>Ghost</dc:creator>
				<category><![CDATA[技术]]></category>
		<category><![CDATA[用户体验]]></category>
		<category><![CDATA[网站]]></category>
		<category><![CDATA[色彩]]></category>
		<category><![CDATA[设计]]></category>

		<guid isPermaLink="false">http://www.ishowsky.cn/?p=429</guid>
		<description><![CDATA[最近由于自己要做一个小网站，但是还苦于找不到一个合适的美工和设计，只能自己上了。于是便看了一些关于用户体验和UI方面的书。 这个就当是个读书笔记吧。 1、常规的页面布局 常规上... <table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">您或许对这些文章有兴趣：</font></b></td>
    </tr>
    
        <tr>
                <td width="111" 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.ishowsky.cn%2F2010%2F10%2Fuser-operation%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31432736.bmp" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !important;">
                    <a target="_blank" title="Web设计色彩速查表" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/11/01/8020582.png" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">Web设计色彩速查表</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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.ishowsky.cn%2F2011%2F12%2Fuser-data-is-valueless%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/12/27/13120992.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !important;">
                    <a target="_blank" title="100大最佳古怪网站" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F11%2F100%25E5%25A4%25A7%25E6%259C%2580%25E4%25BD%25B3%25E5%258F%25A4%25E6%2580%25AA%25E7%25BD%2591%25E7%25AB%2599%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/08/05/21103300.gif" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">100大最佳古怪网站</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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.ishowsky.cn%2F2010%2F01%2F%25E4%25B8%25AA%25E4%25BA%25BA%25E7%25BD%2591%25E7%25AB%2599%25E5%2591%258A%25E5%2588%25AB%25E4%25B8%25AD%25E5%259B%25BD%25E4%25BA%2592%25E8%2581%2594%25E7%25BD%2591%25EF%25BC%259F%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31433138.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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="5" 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 style="text-align: center;"><img class="size-full wp-image-430 aligncenter colorbox-429" title="UE" src="http://www.ishowsky.cn/wp-content/uploads/2010/11/UE.jpg" alt="" width="500" height="200" /></p>
<p>最近由于自己要做一个小网站，但是还苦于找不到一个合适的美工和设计，只能自己上了。于是便看了一些关于用户体验和UI方面的书。</p>
<p>这个就当是个读书笔记吧。</p>
<p><strong>1、常规的页面布局</strong></p>
<p>常规上来说，我们把网页布局按照分栏的多少分为一栏式，二栏式和三栏式。</p>
<p>对于一栏式页面布局来说，一般在页面上放置一个具有冲击力的图片或者Flash来给用户留下深刻的印象，但是，这样的页面所能够容纳的信息量非常有限。所以常用于企业网站，以及一些小网站的首页，用于让用户记住你的站。此外，对于功能性比较单一的页面，也一般用一栏式布局，比如搜索引擎，注册和登录页面等等。</p>
<p>二栏式布局是最为常见的布局方式，二栏式又分为左宽右窄和左窄右宽式。这两种模式的选择是由于网站的性质所决定的。对于用户来说，他的浏览关注顺序是从左到右，那么窄的部分一般来说都是导航栏，而宽的部分则是主体内容部分，那么用哪一种方式将取决于你的站是内容占主体还是导航占主体，换句话说，是内容驱动导航还是导航来驱动内容。</p>
<p>举个例子，拿当当网来说，一般用户来买东西是有着明确目的的，他知道自己要买的东西是哪个类别，而对于主站的内容只是给用户的一个推荐。但是对于cnblogs来说，显然内容应该是大于导航的。所以其实在我看来，博客园的设计其实是并不合理的。</p>
<p><span id="more-429"></span></p>
<p style="text-align: center;"><img class="aligncenter colorbox-429" style="border: 0px;" src="http://www.chinaz.com/upimg/userup/1011/1G35223A52_lit.jpg" border="0" alt="" width="520" height="326" /> </p>
<p style="text-align: center;">当当网首页</p>
<p style="text-align: center;"><img class="aligncenter colorbox-429" style="border: 0px;" src="http://www.chinaz.com/upimg/userup/1011/1G3534T933_lit.jpg" border="0" alt="" width="520" height="203" /> </p>
<p style="text-align: center;">cnblogs首页</p>
<p>对于三栏式布局来说，最大的好处就在于容纳的信息量比较大，但是重点不突出，降低了用户对网站的可控性，因此一般意义上不推荐。</p>
<p>当然，如果当用户需要比较多样化的时候，也可以让用户自由来设计布局，多常见于个人博客。</p>
<p><strong>2、页面的通透性</strong></p>
<p>页面的通透性是指尽量使整个页面的模块比例统一，同时通过线条，颜色等视觉元素增加各模块间的区分度，使得用户的视线轨迹可以有规则地通过各个模块，而不会被模块之间不规则的交叉所打断。</p>
<p>此外，根据“F”原则，也应该尽量将重要地，用户所关系地内容放在页面的左上角位置。</p>
<p><strong>3、页面的配色方案</strong></p>
<p>每个网站都要有自己的主色调，主色调指的就是页面色彩的主要色调，总趋势，其他配色的综合不能超过主色调的50%（白色背景除外）。</p>
<p>在选择颜色的时候，不仅仅要考虑颜色本身所代表的含义，如安全，浪漫等，还有考虑以下几种因素。</p>
<p>A. 目标用户群体。不同的用户群体对于颜色的审美爱好以及理解都不同，其中包括性别，年龄，职业等。</p>
<p>B. 当地文化风俗。如中国把红色作为喜庆的颜色，而欧洲大部分却把红色作为杀戮的象征。</p>
<p>C. 网站的类型。如电子商务站一般用暖色调来刺激用户购买，而SNS站则营造一个轻松的氛围。而垂直类网站一般都与自己的领域特色相关。</p>
<p>D. 品牌形象。我总结一句话就是根据自己的Logo以及企业形象来选择色调。比如IBM就一定会选择蓝色作为主色调。</p>
<p><strong>4、页头和页尾</strong></p>
<p>页头分为设计型头部和简约型头部。一般的大型网站，由于已经有着一定的网站知名度，所以无需在通过渲染头部来提高网站对用户的吸引力，加深印象。所以一般采用比较简单的简约型头部，比如新浪，腾讯，都是这样的效果。对于一些小网站来说，采用设计性头部给用户留下深刻印象，创造品牌效应，但是当设计性头部过于繁杂时，却使得内容的容纳量变小，从而造成一种头重脚轻的感觉。所以这个需要设计师的一种折中。</p>
<p>在页头上最重要的就是Logo，在现代网站的设计中，Logo起到两个作用，一个是标识，一个是让用户回到首页。</p>
<p>页尾一般来说并不重要，用户可到达的机会也少，所以尽量地去简化它，避免它占用内容所占据的位置。</p>
<p><strong>5、搜索区</strong></p>
<p>现在的网站一般都带有站内搜索的功能，目前有两种设计方式。</p>
<p>一种将搜索淡化，因为搜索只是一种手段，适用于浏览型网站，我并不鼓励你搜索，而是希望你一条一条地看下去。比如说豆瓣。我希望你去看社区的动态，而不是希望你来豆瓣为了找人。</p>
<p>一种是搜索为主，最简单的就是淘宝。一般来说用户来电子商务站都是有着明确的目的，所以搜索是用户找到他想要商品的最主要方式。</p>
<p>另外，对于搜索框来说，如果你鼓励用户使用搜索框，在页面刚刚打开的时候，就可以让光标在搜索框上，这样用户可以直接搜索内容，而省去了一次操作。但是如果并非如此，就不要让光标在文本框上，因为这样用户变没有办法使用键盘来让整个页面下移。</p>
<p><strong>6、登陆和注册</strong></p>
<p>首先是究竟是淡化登陆注册还是强调登陆注册，这个取决于该站点的目的。两个典型便是新浪和豆瓣。对于新浪来说，需要的只是网站的浏览量，与是否注册关系不大，所以只是将登陆弱化，没有登录一样可以享受基本所有权利，其中包括“匿名”评论等功能。而豆瓣以及很多SNS站点都需要来通过用户注册来扩展好友关系，所以在豆瓣的首先都是将登陆注册放在最显眼的位置，然后用一些优点来煽动用户注册。</p>
<p>但是个人认为随着SNS站点的逐渐做大，虽然不会像新浪等资讯站一样如此弱化用户的登陆注册，但是也不会在将登陆注册变为浏览，发帖等必须的一部，而会将匿名作为可选的一项。而新浪等资讯站随着发展，也会逐渐地走向社交网络，从而在网络中达到一种资讯站与SNS的折中。</p>
<p><strong>7、关于广告</strong></p>
<p>广告从来都是互联网的主要盈利手段之一。可是不得不承认，没有人喜欢看广告。因此广告主和用户之间总是存在着无可避免的直接矛盾，而且一定意义上，网络广告没有任何约束，这也就导致了网站广告的混乱和不合理性。</p>
<p>但是我们在网站中穿插广告时，应该保证我们自己网站不会影响用户的浏览。</p>
<p>首先，据调查，用户最能接受的广告形式是游动式广告和横幅式广告，而弹出广告和邮件广告是用户最讨厌的。</p>
<p>其次，从布局上看，我们不能让广告切断页面的相关内容，因为很多用户一旦看到广告就会习惯性地认为该页面的内容已经中止，不在继续浏览了，所以这样的话会影响整个网站内容的关联性。</p>
<p>然后，我们要避免过多的广告同时出现。也要规范网站广告的尺寸大小。</p>
<p><strong>8、表单的布局设计</strong></p>
<p>这里就从注册来看，这个是最典型的表单。</p>
<p>从布局上讲分为三种方式，其中包括垂直对齐，左对齐和右对齐。</p>
<p>垂直对齐的优势在于可大量减少眼睛一动和填写表单的时间，但是缺点在于增加了垂直的空间，当注册项较多时，会增加页面的滚动。适用于搜集的信息和资料是熟悉的，需要较少的完成时间。</p>
<p>左对齐便于用户浏览标签，同时会减少垂直空间。但是如果某标签过长，则会造成文字与文本框距离过远。适用于对所需的信息不熟悉，而且标签文字不会太长。</p>
<p>右对齐则让左边参差不齐的空包让用户很难快速检索表单要填写的内容。</p>
<p>另外，在设计时，最好将注册时相关的项进行分组，这样可以让用户以尽可能少的视觉元素来分出关系，避免视觉噪音。</p>
<p>对于很多选项来说，不妨提供默认选项，来尽量减少用户的操作。并且给予适当的提示来给予用户帮助，记得一定是适当的，不要过多。</p>
<p>此外，还可用一些较大的字体以及间距，不要让用户产生局促感。</p>
<p><strong>9、模块标签</strong></p>
<p>模块标签，就是用于页面内某模块中，在内容上方使用一列标签形式的链接进行切换。</p>
<p>使用模块标签时，首先一定要具备一个最基本的前提，内容必须都相对独立，不能存在上下文的关系。</p>
<p>在设计模块标签与下面模块内容时，我总结为两点：突出对比和加强关联。</p>
<p>突出对比是说，突出已选中标签和未选中标签的对比，而加强关联是说加强以选中标签和其内容模块的关联。</p>
<p><strong>10、按钮</strong></p>
<p>首先要用较大的，与背景色形成鲜明对比的按钮来使所需主要强调的按钮从网页中跳跃出来。</p>
<p>其次，我们需要根据按钮的主次来选择性强调和弱化某按钮。但是同一个方式的弱化，可能到另一个方面则会是强调。这个需要根据经验来结合之前的知识来考虑。</p>
<p>还有也要注意按钮的摆放位置，比如说用户的视线是从上向下，从左至右，这样用户也会依照这样的顺序做出选择。</p>
<p><strong>11、反馈</strong></p>
<p>Nielsen可用性原则中有一条痕重要的原则，就是系统必须提供必要的反馈。其中包括成功提示和失败提示。</p>
<p>成功提示是最简单的一种提示，他应该仅仅起到提示的作用，而不该中断用户的操作。我们应该只需要让用户知道就可以了。不应该让用户进行任何不必要的操作，比如弹层就是一个非常愚蠢的做法。</p>
<p>失败提示是很重要的提示，从理论上说分为两种方式，一种是直接在网页上用文字提示，一种是弹出警告框来提示。但是我个人认为弹出警告框是非常不可取的，因为最重要的一点是alert的时候会发出声音，这样的用户体验是非常差的，所以自己做一个弹出层倒是一个折中的做法。</p>
<p>还有一个很重要的是错误页面，比如说404页面，优秀的404页面应该能够改善用户的不良体验，减少用户的挫败感，还应该将用户引导到他原本打算去往的相关联的去处，以减少用户的流失率。</p>
<p>关于进度条，据研究表明，超过1秒就要提供相应的提示信息，比如进度条，而超过10秒就不仅仅需要提示信息，还需要提供完成的百分比。</p>
<p><strong>12、其他个人想法About验证码</strong></p>
<p>比如说验证码，验证码是用来防止恶意注册的，但是不是用来防止正常用户的，我们不应该让用户因为验证码产生挫败感。如果让我设计一个验证码，我会将英文的“O”和数字的“0”，英文的“L”和数字的“1”都排除在验证码之外。</p>
<p>此外我有个想法是觉得，首先，密码是在post回去的过程中是无法保存原有状态的，所以唯一的办法只能是ajax回发验证。但是在何时Ajax，只能是在失去焦点时。所以我认为最好把验证码放在页面最顶端，这样用户比较容易离开焦点从而触发Ajax验证。</p>
<p>本文来源：<a href="http://www.chinaz.com/Webbiz/Exp/111G43I42010.html">http://www.chinaz.com/Webbiz/Exp/111G43I42010.html</a></p>
<div class="related_box"><h2  class="related_post_title">您也许也会喜欢这些：</h2><ul class="related_post"><li><a href="http://www.ishowsky.cn/2011/12/user-data-is-valueless/" title="黑客：泄露的用户数据已无利用价值">黑客：泄露的用户数据已无利用价值</a></li><li><a href="http://www.ishowsky.cn/2011/12/personal-passowrd-security-policy/" title="个人密码安全策略">个人密码安全策略</a></li><li><a href="http://www.ishowsky.cn/2011/11/36-css-frame/" title="36个精品CSS框架推荐！提高设计开发效率！">36个精品CSS框架推荐！提高设计开发效率！</a></li><li><a href="http://www.ishowsky.cn/2011/08/night/" title="{夜之魅} 美丽都市建筑快照">{夜之魅} 美丽都市建筑快照</a></li><li><a href="http://www.ishowsky.cn/2010/06/%e9%a1%b6%e5%b0%96%e7%a7%91%e6%8a%80%e5%85%ac%e5%8f%b8%e4%b8%8d%e6%93%85%e9%95%bf%e5%81%9a%e7%9a%84%e4%ba%8b/" title="顶尖科技公司不擅长做的事">顶尖科技公司不擅长做的事</a></li></ul></div><table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">您或许对这些文章有兴趣：</font></b></td>
    </tr>
    
        <tr>
                <td width="111" 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.ishowsky.cn%2F2010%2F10%2Fuser-operation%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31432736.bmp" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !important;">
                    <a target="_blank" title="Web设计色彩速查表" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/11/01/8020582.png" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">Web设计色彩速查表</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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.ishowsky.cn%2F2011%2F12%2Fuser-data-is-valueless%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/12/27/13120992.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !important;">
                    <a target="_blank" title="100大最佳古怪网站" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F11%2F100%25E5%25A4%25A7%25E6%259C%2580%25E4%25BD%25B3%25E5%258F%25A4%25E6%2580%25AA%25E7%25BD%2591%25E7%25AB%2599%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/08/05/21103300.gif" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">100大最佳古怪网站</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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.ishowsky.cn%2F2010%2F01%2F%25E4%25B8%25AA%25E4%25BA%25BA%25E7%25BD%2591%25E7%25AB%2599%25E5%2591%258A%25E5%2588%25AB%25E4%25B8%25AD%25E5%259B%25BD%25E4%25BA%2592%25E8%2581%2594%25E7%25BD%2591%25EF%25BC%259F%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31433138.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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="5" 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.ishowsky.cn/2010/11/user-experience/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Web设计色彩速查表</title>
		<link>http://www.ishowsky.cn/2009/12/web%e8%ae%be%e8%ae%a1%e8%89%b2%e5%bd%a9%e9%80%9f%e6%9f%a5%e8%a1%a8/</link>
		<comments>http://www.ishowsky.cn/2009/12/web%e8%ae%be%e8%ae%a1%e8%89%b2%e5%bd%a9%e9%80%9f%e6%9f%a5%e8%a1%a8/#comments</comments>
		<pubDate>Fri, 25 Dec 2009 00:08:19 +0000</pubDate>
		<dc:creator>Ghost</dc:creator>
				<category><![CDATA[资源]]></category>
		<category><![CDATA[色彩]]></category>

		<guid isPermaLink="false">http://www.ishowsky.cn/?p=102</guid>
		<description><![CDATA[一直希望自己对Web设计的色彩把握的更好些，所以手头上就备了一份图片版的配色表，对色彩的搭配有了很多的提高，今天发现了这套非常完整的Web版设计色彩速查表，相比图片版的来说就更... <table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">您或许对这些文章有兴趣：</font></b></td>
    </tr>
    
        <tr>
                <td width="111" 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.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31432715.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !important;">
                    <a target="_blank" title="分享Web2.0 Phtoshop的图层样式和渐变样式" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fweb2-ps-gradients%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31432773.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">分享Web2.0 Phtoshop的图层样式和渐变样式</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !important;">
                    <a target="_blank" title="36个精品CSS框架推荐！提高设计开发效率！" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.ishowsky.cn%2F2011%2F11%2F36-css-frame%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/11/01/10115009.png" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">36个精品CSS框架推荐！提高设计开发效率！</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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.ishowsky.cn%2F2010%2F10%2Fuser-operation%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31432736.bmp" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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.ishowsky.cn%2F2011%2F08%2Fnight%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31432335.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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>
        <br/>
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">来自无觅网络的相关文章：</font></b></td>
    </tr>
    
        <tr>
                <td width="111" 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%2Fiwucha.com%2Fblog%2Fcolorful-building%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/05/25/9523196.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">【摄影】色彩丰富的建筑 (@iwucha)</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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%2Fiwucha.com%2Fblog%2Fcolorful%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/10/25/9795828.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">【插画】舞动色彩 (@iwucha)</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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.ycy8.net%2F2011_8977.html&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/07/15/17475336.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">色彩之美 (@ycy8)</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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%2Fiwucha.com%2Fblog%2Fnice-color-photo%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/08/01/20352607.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">【摄影】一组色彩优雅的照片 (@iwucha)</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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%2Fiwucha.com%2Fblog%2Fcolors%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2012/01/06/13523083.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">【设计】关于颜色的搭配 (@iwucha)</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="5" 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[<div id="lw_context_ads">
<p>一直希望自己对Web设计的色彩把握的更好些，所以手头上就备了一份图片版的配色表，对色彩的搭配有了很多的提高，今天发现了这套非常完整的Web版设计色彩速查表，相比图片版的来说就更容易实时学习了。</p>
<p><span style="COLOR: #ffb3a7">████</span> 粉红(#ffb3a7)，即浅红色。别称：妃色 杨妃色 湘妃色 妃红色<br />
<span style="COLOR: #ed5736">████</span> 妃色 妃红色(#ed5736)：古同“绯”，粉红色。杨妃色 湘妃色 粉红皆同义。<br />
<span style="COLOR: #f00056">████</span> 品红(#f00056)：比大红浅的红色<span style="COLOR: #009900">（quester注：这里的“品红”估计是指的“一品红”，是基于大红色系的，和现在我们印刷用色的“品红M100”不是一个概念）</span></p>
<p><span style="COLOR: #f47983">████</span> 桃红(#f47983)，桃花的颜色，比粉红略鲜润的颜色。 <span style="COLOR: #009900">（quester注：不大于M70的色彩，有时可加入适量黄色）</span><br />
<span style="COLOR: #db5a6b">████</span> 海棠红(#db5a6b)，淡紫红色、较桃红色深一些，是非常妩媚娇艳的颜色。<br />
<span style="COLOR: #f20c00">████</span> 石榴红(#f20c00)：石榴花的颜色，高色度和纯度的红色。<br />
<span style="COLOR: #c93756">████</span> 樱桃色(#c93756)：鲜红色</p>
<p><span style="COLOR: #f05654">████</span> 银红(#f05654)：银朱和粉红色颜料配成的颜色。多用来形容有光泽的各种红色，尤指有光泽浅红。<br />
<span style="COLOR: #ff2121">████</span> 大红(#ff2121)：正红色，三原色中的红，传统的中国红，又称绛色 <span style="COLOR: #009900">（quester注：RGB 色中的 R255 系列明度）</span><br />
<span style="COLOR: #8c4356">████</span> 绛紫(#8c4356)：紫中略带红的颜色<br />
<span style="COLOR: #c83c23">████</span> 绯红(#c83c23)：艳丽的深红</p>
<p><span style="COLOR: #9d2933">████</span> 胭脂(#9d2933)：1，女子装扮时用的胭脂的颜色。2，国画暗红色颜料<br />
<span style="COLOR: #ff4c00">████</span> 朱红(#ff4c00)：朱砂的颜色，比大红活泼，也称铅朱 朱色 丹色 <span style="COLOR: #009900">（quester注：在YM对等的情况下，适量减少红色的成分就是该色的色彩系列感觉）</span><br />
<span style="COLOR: #ff4e20">████</span> 丹(#ff4e20)：丹砂的鲜艳红色<br />
<span style="COLOR: #f35336">████</span> 彤(#f35336)：赤色</p>
<p><span style="COLOR: #cb3a56">████</span> 茜色(#cb3a56)：茜草染的色彩，呈深红色<br />
<span style="COLOR: #ff2d51">████</span> 火红(#ff2d51)：火焰的红色，赤色<br />
<span style="COLOR: #c91f37">████</span> 赫赤(#c91f37)：深红，火红。泛指赤色、火红色。<br />
<span style="COLOR: #ef7a82">████</span> 嫣红(#ef7a82)：鲜艳的红色<br />
<span style="COLOR: #ff0097">████</span> 洋红：色橘红(#ff0097) <span style="COLOR: #009900">（quester注：这个色彩方向不太对，通常洋红指的是倾向于M100系列的红色，应该削弱黄色成分。）</span></p>
<p><span style="COLOR: #009900"><span id="more-102"></span></span></p>
<p><span style="COLOR: #ff3300">████</span> 炎(#ff3300)：引申为红色。<br />
<span style="COLOR: #c3272b">████</span> 赤(#c3272b)：本义火的颜色，即红色<br />
<span style="COLOR: #a98175">████</span> 绾(#a98175)：绛色；浅绛色。<br />
<span style="COLOR: #c32136">████</span> 枣红(#c32136)：即深红 <span style="COLOR: #009900">（quester注：色相不变，是深浅变化）</span></p>
<p><span style="COLOR: #b36d61">████</span> 檀(#b36d61)：浅红色，浅绛色。<br />
<span style="COLOR: #be002f">████</span> 殷红(#be002f)：发黑的红色。<br />
<span style="COLOR: #dc3023">████</span> 酡红(#dc3023)：像饮酒后脸上泛现的红色，泛指脸红<br />
<span style="COLOR: #f9906f">████</span> 酡颜(#f9906f)：饮酒脸红的样子。亦泛指脸红色</p>
<p><span style="COLOR: #fff143">████</span> 鹅黄(#fff143)：淡黄色 <span style="COLOR: #009900">（quester注：鹅嘴的颜色，高明度微偏红黄色）</span><br />
<span style="COLOR: #faff72">████</span> 鸭黄(#faff72)：小鸭毛的黄色<br />
<span style="COLOR: #eaff56">████</span> 樱草色(#eaff56)：淡黄色<br />
<span style="COLOR: #ffa631">████</span> 杏黄(#ffa631)：成熟杏子的黄色 <span style="COLOR: #009900">（quester注：Y100 M20~30 感觉的色彩，比较常用且有浓郁中国味道）</span></p>
<p><span style="COLOR: #ff8c31">████</span> 杏红(#ff8c31)：成熟杏子偏红色的一种颜色<br />
<span style="COLOR: #ff8936">████</span> 橘黄(#ff8936)：柑橘的黄色。<br />
<span style="COLOR: #ffa400">████</span> 橙黄(#ffa400)：同上。 <span style="COLOR: #009900">（quester注：Y100 M50 感觉的色彩，现代感比较强。广告上用得较多）</span><br />
<span style="COLOR: #ff7500">████</span> 橘红(#ff7500)：柑橘皮所呈现的红色。</p>
<p><span style="COLOR: #ffc773">████</span> 姜黄(#ffc773)：中药名。别名黄姜。为姜科植物姜黄的根茎。又指人脸色不正,呈黄白色<br />
<span style="COLOR: #f0c239">████</span> 缃色(#f0c239)：浅黄色。<br />
<span style="COLOR: #fa8c35">████</span> 橙色(#fa8c35)：界于红色和黄色之间的混合色。<br />
<span style="COLOR: #b35c44">████</span> 茶色(#b35c44)：一种比栗色稍红的棕橙色至浅棕色<br />
<span style="COLOR: #a88462">████</span> 驼色(#a88462)：一种比咔叽色稍红而微淡、比肉桂色黄而稍淡和比核桃棕色黄而暗的浅黄棕色</p>
<p><span style="COLOR: #c89b40">████</span> 昏黄(#c89b40)：形容天色、灯光等呈幽暗的黄色<br />
<span style="COLOR: #60281e">████</span> 栗色(#60281e)：栗壳的颜色。即紫黑色<br />
<span style="COLOR: #b25d25">████</span> 棕色：棕毛的颜色,即褐色。1，在红色和黄色之间的任何一种颜色2，适中的暗淡和适度的浅黑。<br />
<span style="COLOR: #827100">████</span> 棕绿(#827100)：绿中泛棕色的一种颜色。<br />
<span style="COLOR: #7c4b00">████</span> 棕黑(#7c4b00)：深棕色。</p>
<p><span style="COLOR: #9b4400">████</span> 棕红(#9b4400)：红褐色。<br />
<span style="COLOR: #ae7000">████</span> 棕黄(#ae7000)：浅褐色。<br />
<span style="COLOR: #9c5333">████</span> 赭(#9c5333)：赤红如赭土的颜料,古人用以饰面<br />
<span style="COLOR: #955539">████</span> 赭色(#955539)：红色、赤红色。<br />
<span style="COLOR: #ca6924">████</span> 琥珀(#ca6924)：</p>
<p><span style="COLOR: #6e511e">████</span> 褐色(#6e511e)： 黄黑色<br />
<span style="COLOR: #d3b17d">████</span> 枯黄(#d3b17d)：干枯焦黄<br />
<span style="COLOR: #e29c45">████</span> 黄栌(#e29c45)：一种落叶灌木，花黄绿色,叶子秋天变成红色。木材黄色可做染料。<br />
<span style="COLOR: #896c39">████</span> 秋色(#896c39)：1，中常橄榄棕色,它比一般橄榄棕色稍暗,且稍稍绿些。2，古以秋为金,其色白,故代指白色。<br />
<span style="COLOR: #d9b611">████</span> 秋香色(#d9b611)：浅橄榄色 浅黄绿色。 <span style="COLOR: #009900">（quester注：直接在Y中掺入k10~30可得到不同浓淡的该类色彩）</span></p>
<p><span style="COLOR: #bddd22">████</span> 嫩绿(#bddd22)：像刚长出的嫩叶的浅绿色<br />
<span style="COLOR: #c9dd22">████</span> 柳黄(#c9dd22)：像柳树芽那样的浅黄色<br />
<span style="COLOR: #afdd22">████</span> 柳绿(#afdd22)：柳叶的青绿色<br />
<span style="COLOR: #789262">████</span> 竹青(#789262)：竹子的绿色</p>
<p><span style="COLOR: #a3d900">████</span> 葱黄(#a3d900)：黄绿色，嫩黄色<br />
<span style="COLOR: #9ed900">████</span> 葱绿(#9ed900)：1，浅绿又略显微黄的颜色2，草木青翠的样子<br />
<span style="COLOR: #0eb83a">████</span> 葱青(#0eb83a)：淡淡的青绿色<br />
<span style="COLOR: #0eb83a">████</span> 葱倩(#0eb83a)：青绿色<br />
<span style="COLOR: #0aa344">████</span> 青葱(#0aa344)：翠绿色,形容植物浓绿</p>
<p><span style="COLOR: #00bc12">████</span> 油绿(#00bc12)：光润而浓绿的颜色。以上几种绿色都是明亮可爱的色彩。<br />
<span style="COLOR: #0c8918">████</span> 绿沈(#0c8918)<span style="COLOR: #009900">（沉）</span>：深绿<br />
<span style="COLOR: #1bd1a5">████</span> 碧色(#1bd1a5)：1，青绿色。2，青白色,浅蓝色。<br />
<span style="COLOR: #2add9c">████</span> 碧绿(#2add9c)：鲜艳的青绿色</p>
<p><span style="COLOR: #48c0a3">████</span> 青碧(#48c0a3)：鲜艳的青蓝色<br />
<span style="COLOR: #3de1ad">████</span> 翡翠色(#3de1ad)：1，翡翠鸟羽毛的青绿色。2，翡翠宝石的颜色。 <span style="COLOR: #009900">（quester注：C-Y≥30 的系列色彩，多与白色配合以体现清新明丽感觉，与黑色配合效果不好：该色个性柔弱，会被黑色牵制）</span><br />
<span style="COLOR: #40de5a">████</span> 草绿(#40de5a)：绿而略黄的颜色。<br />
<span style="COLOR: #00e09e">████</span> 青色(#00e09e)：1，一类带绿的蓝色,中等深浅,高度饱和。3，本义是蓝色。4，一般指深绿色。5，也指黑色。6，四色印刷中的一色。2，特指三补色中的一色。</p>
<p><span style="COLOR: #00e079">████</span> 青翠(#00e079)：鲜绿</p>
<p><span style="COLOR: #c0ebd7">████</span> 青白(#c0ebd7)：白而发青,尤指脸没有血色<br />
<span style="COLOR: #e0eee8">████</span> 鸭卵青(#e0eee8)：淡青灰色，极淡的青绿色<br />
<span style="COLOR: #bbcdc5">████</span> 蟹壳青(#bbcdc5)：深灰绿色</p>
<p><span style="COLOR: #424c50">████</span> 鸦青(#424c50)：鸦羽的颜色。即黑而带有紫绿光的颜色。<br />
<span style="COLOR: #00e500">████</span> 绿色(#00e500)：1，在光谱中介于蓝与黄之间的那种颜色。2，本义：青中带黄的颜色。3，引申为黑色，如绿鬓：乌黑而光亮的鬓发。代指为青春年少的容颜。 <span style="COLOR: #009900">（quester注：现代色彩研究中，把绿色提高到了一个重要的位置，和其它红黄兰三原色并列研究，称做“心理原色”之一）</span><br />
<span style="COLOR: #9ed048">████</span> 豆绿(#9ed048)：浅黄绿色<br />
<span style="COLOR: #96ce54">████</span> 豆青(#96ce54)：浅青绿色</p>
<p><span style="COLOR: #7bcfa6">████</span> 石青(#7bcfa6)：淡灰绿色<br />
<span style="COLOR: #2edfa3">████</span> 玉色(#2edfa3):玉的颜色，高雅的淡绿、淡青色<br />
<span style="COLOR: #7fecad">████</span> 缥(#7fecad)：绿色而微白<br />
<span style="COLOR: #a4e2c6">████</span> 艾绿(#a4e2c6)：艾草的颜色。偏苍白的绿色。<br />
<span style="COLOR: #21a675">████</span> 松柏绿(#21a675)：经冬松柏叶的深绿</p>
<p><span style="COLOR: #057748">████</span> 松花绿(#057748)：亦作“松花”、“松绿”。偏黑的深绿色,墨绿。<br />
<span style="COLOR: #bce672">████</span> 松花色(#bce672)：浅黄绿色。（松树花粉的颜色）《红楼梦》中提及松花配桃红为娇艳 <span style="COLOR: #bce672">██</span><span style="COLOR: #f47983">██</span></p>
<p><span style="COLOR: #44cef6">████</span> 蓝(#44cef6)：三原色的一种。像晴天天空的颜色 <span style="COLOR: #009900">（quester注：这里的蓝色指的不是RGB色彩中的B，而是CMY色彩中的C）</span></p>
<p><span style="COLOR: #177cb0">████</span> 靛青(#177cb0)：也叫“蓝靛”。用蓼蓝叶泡水调和与石灰沉淀所得的蓝色染料。呈深蓝绿色 <span style="COLOR: #009900">（quester注：靛，发音dian四声，有些地方将蓝墨水称为“靛水”或者“兰靛水”）</span><br />
<span style="COLOR: #065279">████</span> 靛蓝(#065279)：由植物(例如靛蓝或菘蓝属植物)得到的蓝色染料<br />
<span style="COLOR: #3eede7">████</span> 碧蓝(#3eede7)：青蓝色<br />
<span style="COLOR: #70f3ff">████</span> 蔚蓝(#70f3ff)：类似晴朗天空的颜色的一种蓝色</p>
<p><span style="COLOR: #4b5cc4">████</span> 宝蓝(#4b5cc4)：鲜艳明亮的蓝色 <span style="COLOR: #009900">（quester注：英文中为 RoyalBlue 即皇家蓝色，是皇室选用的色彩，多和小面积纯黄色（金色）配合使用。）</span><br />
<span style="COLOR: #a1afc9">████</span> 蓝灰色(#a1afc9)：一种近于灰略带蓝的深灰色<br />
<span style="COLOR: #2e4e7e">████</span> 藏青(#2e4e7e)：蓝而近黑<br />
<span style="COLOR: #3b2e7e">████</span> 藏蓝(#3b2e7e)：蓝里略透红色</p>
<p><span style="COLOR: #4a4266">████</span> 黛(#4a4266)：青黑色的颜料。古代女子用以画眉。<br />
<span style="COLOR: #4a4266">████</span> 黛螺(#4a4266)：绘画或画眉所使用的青黑色颜料，代指女子眉妩。<br />
<span style="COLOR: #4a4266">████</span> 黛色(#4a4266)：青黑色。<br />
<span style="COLOR: #426666">████</span> 黛绿(#426666)：墨绿。<br />
<span style="COLOR: #425066">████</span> 黛蓝(#425066)：深蓝色</p>
<p><span style="COLOR: #574266">████</span> 黛紫(#574266)：深紫色<br />
<span style="COLOR: #8d4bbb">████</span> 紫色(#8d4bbb)：蓝和红组成的颜色。古人以紫为祥瑞的颜色。代指与帝王、皇宫有关的事物。<br />
<span style="COLOR: #815463">████</span> 紫酱(#815463)：浑浊的紫色<br />
<span style="COLOR: #815476">████</span> 酱紫(#815476)：紫中略带红的颜色<br />
<span style="COLOR: #4c221b">████</span> 紫檀(#4c221b)：檀木的颜色，也称乌檀色 乌木色</p>
<p><span style="COLOR: #003371">████</span> 绀青 绀紫(#003371)：纯度较低的深紫色<br />
<span style="COLOR: #56004f">████</span> 紫棠(#56004f)：黑红色<br />
<span style="COLOR: #801dae">████</span> 青莲(#801dae)：偏蓝的紫色<br />
<span style="COLOR: #4c8dae">████</span> 群青(#4c8dae)：深蓝色<br />
<span style="COLOR: #b0a4e3">████</span> 雪青(#b0a4e3)：浅蓝紫色</p>
<p><span style="COLOR: #cca4e3">████</span> 丁香色(#cca4e3)：紫丁香的颜色，浅浅的紫色，很娇柔淡雅的色彩<br />
<span style="COLOR: #edd1d8">████</span> 藕色(#edd1d8)：浅灰而略带红的颜色<br />
<span style="COLOR: #e4c6d0">████</span> 藕荷色(#e4c6d0)：浅紫而略带红的颜色</p>
<p><span style="COLOR: #75878a">████</span> 苍色(#75878a)：即各种颜色掺入黑色后的颜色，如苍翠(#519a73)<span style="COLOR: #519a73">████</span> 苍黄(#a29b7c)<span style="COLOR: #a29b7c">████</span> 苍青(#7397ab)<span style="COLOR: #7397ab">████</span> 苍黑(#395260)<span style="COLOR: #395260">████</span> 苍白(#d1d9e0)<span style="COLOR: #d1d9e0">████</span> <span style="COLOR: #009900">（quester注：准确的说是掺入不同灰度级别的灰色）</span></p>
<p><span style="COLOR: #88ada6">████</span> 水色(#88ada6)：水红(#f3d3e7)<span style="COLOR: #f3d3e7">████</span> 水绿(#d4f2e7)<span style="COLOR: #d4f2e7">████</span> 水蓝(#d2f0f4)<span style="COLOR: #d2f0f4">████</span> 淡青(#d3e0f3)<span style="COLOR: #d3e0f3">████</span> 湖蓝(#30dff3)<span style="COLOR: #30dff3">████</span> 湖绿(#25f8cb)<span style="COLOR: #25f8cb">████</span>皆是浅色。</p>
<p><span style="COLOR: #ffffff">████</span> 深色淡色(#ffffff)：颜色深的或浅的，不再一一列出。</p>
<p><span style="COLOR: #ffffff">████</span> 精白(#ffffff)：纯白，洁白，净白，粉白。<br />
<span style="COLOR: #fffbf0">████</span> 象牙白(#fffbf0)：乳白色<br />
<span style="COLOR: #f0fcff">████</span> 雪白(#f0fcff)：如雪般洁白</p>
<p><span style="COLOR: #d6ecf0">████</span> 月白(#d6ecf0)：淡蓝色<br />
<span style="COLOR: #f2ecde">████</span> 缟(#f2ecde)：白色<br />
<span style="COLOR: #e0f0e9">████</span> 素(#e0f0e9)：白色，无色<br />
<span style="COLOR: #f3f9f1">████</span> 荼白(#f3f9f1)：如荼之白色<br />
<span style="COLOR: #e9f1f6">████</span> 霜色(#e9f1f6)：白霜的颜色。</p>
<p><span style="COLOR: #c2ccd0">▓▓▓▓</span> 花白(#c2ccd0)：白色和黑色混杂的。斑白的 夹杂有灰色的白<br />
<span style="COLOR: #fcefe8">████</span> 鱼肚白(#fcefe8)：似鱼腹部的颜色，多指黎明时东方的天色颜色 <span style="COLOR: #009900">（quester注：M5 Y5）</span><br />
<span style="COLOR: #e3f9fd">████</span> 莹白(#e3f9fd)：晶莹洁白<br />
<span style="COLOR: #808080">████</span> 灰色(#808080)：黑色和白色混和成的一种颜色</p>
<p><span style="COLOR: #eedeb0">████</span> 牙色(#eedeb0)：与象牙相似的淡黄色 <span style="COLOR: #009900">（quester注：暖白）</span><br />
<span style="COLOR: #f0f0f4">████</span> 铅白(#f0f0f4)：铅粉的白色。铅粉，国画颜料，日久易氧化“返铅”变黑。铅粉在古时用以搽脸的化妆品。 <span style="COLOR: #009900">（quester注：冷白）</span></p>
<p><span style="COLOR: #622a1d">████</span> 玄色(#622a1d)：赤黑色，黑中带红的颜色，又泛指黑色<br />
<span style="COLOR: #3d3b4f">████</span> 玄青(#3d3b4f)：深黑色</p>
<p><span style="COLOR: #725e82">████</span> 乌色(#725e82)：暗而呈黑的颜色<br />
<span style="COLOR: #392f41">████</span> 乌黑(#392f41)：深黑；漆黑<br />
<span style="COLOR: #161823">████</span> 漆黑(#161823)：非常黑的<br />
<span style="COLOR: #50616d">████</span> 墨色(#50616d)：即黑色<br />
<span style="COLOR: #758a99">████</span> 墨灰(#758a99)：即黑灰</p>
<p><span style="COLOR: #000000">████</span> 黑色(#000000)：亮度最低的非彩色的或消色差的物体的颜色；最暗的灰色；与白色截然不同的消色差的颜色；被认为特别属于那些既不能反射、又不能透过能使人感觉到的微小入射光的物体,任何亮度很低的物体颜色。<br />
<span style="COLOR: #493131">████</span> 缁色(#493131)：帛黑色<br />
<span style="COLOR: #312520">████</span> 煤黑象牙黑(#312520)：都是黑，不过有冷暖之分。<br />
<span style="COLOR: #5d513c">████</span> 黧(#5d513c)：黑中带黄的颜色<br />
<span style="COLOR: #75664d">████</span> 黎(#75664d)：黑中带黄似黎草色</p>
<p><span style="COLOR: #6b6882">████</span> 黝(#6b6882)：本义为淡黑色或微青黑色。<br />
<span style="COLOR: #665757">████</span> 黝黑(#665757)：<span style="COLOR: #009900">（皮肤暴露在太阳光下而晒成的）</span>青黑色<br />
<span style="COLOR: #41555d">████</span> 黯(#41555d)：深黑色、泛指黑色<br />
<span style="COLOR: #f2be45">████</span> 赤金(#f2be45)：足金的颜色</p>
<p><span style="COLOR: #eacd76">████</span> 金色(#eacd76)：平均为深黄色带光泽的颜色<br />
<span style="COLOR: #e9e7ef">████</span> 银白(#e9e7ef)：带银光的白色<br />
<span style="COLOR: #549688">████</span> 铜绿(#549688) <span style="COLOR: #a78e44">████</span>乌金(#a78e44) <span style="COLOR: #bacac6">████</span>老银(#bacac6)：金属氧化后的色彩</p>
<p><strong>附带： </strong></p>
<p><strong>国画用色 </strong></p>
<p><span style="COLOR: #bf242a">████</span> 银朱(#bf242a)：呈暗粉色。<br />
<span style="COLOR: #9d2933">████</span> 胭脂(#9d2933)：色暗红。用红蓝花、茜草、紫梗三种植物制成的颜料，年代久则有褪色的现象。<br />
<span style="COLOR: #ff461f">████</span> 朱砂(#ff461f)：色朱红。用以画花卉、禽鸟羽毛。 <span style="COLOR: #009900">（quester注：黄色成分微高于红色成分，色艳丽，需注意与背景色调和，多数情况下不大面积使用。）</span></p>
<p><span style="COLOR: #f36838">████</span> 朱膘(#f36838)：色橘红。明度比朱砂高，彩度比朱砂低。用以画花卉。<br />
<span style="COLOR: #845a33">████</span> 赭石(#845a33)：色红褐。用以画山石、树干、老枝叶。<br />
<span style="COLOR: #1685a9">████</span> 石青(#1685a9)：色青，依深浅分为－头青、二青、三青。用以画叶或山石。<br />
<span style="COLOR: #16a951">████</span> 石绿(#16a951)：依深浅分为－头绿、二绿、三绿。用以画山石、树干、叶、点苔等。<br />
<span style="COLOR: #fff2df">████</span> 白粉(#fff2df)：亦称胡粉，色白，有蛤粉和铅粉两种。用以画白花、鸟，或调配其他颜料使用。</p>
<p><span style="COLOR: #003472">████</span> 花青(#003472)：色藏青。用以画枝叶、山石、水波等。用蓼蓝或大蓝的叶子制成蓝靛，再提炼出来的青色颜料，蓝绿色或藏蓝色。用途相当广，可调藤黄成草绿或嫩绿色。广花，颜料。即广东产的花青。 <span style="COLOR: #009900">（quester注：微含红色成分，故与黄色调和后生成的绿色较为沉着）</span><br />
<span style="COLOR: #ffb61e">████</span> 藤黄(#ffb61e)：色明黄。用以画花卉、枝叶。藤黄：明黄色。南方热带林中的海藤树，常绿乔木，茎高达二十米，从其树皮凿孔，流出黄色树脂，以竹筒承接，干透可作国画颜料。 <span style="COLOR: #009900">（quester注：亦含微量红色成分，有毒。和黑色配合时甚为醒目，多为危险警示色彩）</span><br />
<span style="COLOR: #845a33">████</span> 赭石色(#845a33)：暗棕色矿物，用做颜料<br />
<span style="COLOR: #ffc64b">████</span> 雌黄(#ffc64b)：矿物名。成分是三硫化二砷(As2S3)橙黄色,半透明,可用来制颜料。古人用雌黄来涂改文字，因此称乱改文字、乱发议论为“妄下雌黄”，称不顾事实、随口乱说为“信口雌黄”。</p>
<p><span style="COLOR: #e9bb1d">████</span> 雄黄(#e9bb1d)：中药名。为含硫化砷的矿石。别名石黄、黄石。<br />
<span style="COLOR: #e9bb1d">████</span> 石黄(#e9bb1d)：国画颜料，即雄黄。<br />
<span style="COLOR: #ff4777">████</span> 洋红(#ff4777)：色橘红。用以画花卉。</p>
<p><strong>古典文学常见词 </strong></p>
<p>鎏金：中国传统的一种镀金方法，把溶解在水银里的金子涂刷在银胎或铜胎器物上。</p>
<p>飞金 泥金 洒金：用金粉或金属粉制成的金色涂料，用来装饰笺纸或调和在油漆中涂饰器物。洒金一说是指带斑点的图案。<br />
描金：为使器物美观而在其上用金银粉勾图、描绘作为装饰。</p>
<p>花黄：古代妇女的面饰。用金黄色纸剪成星月花鸟等形贴在额上,或在额上涂点黄色。<br />
撒花：织物上的碎花图案。<br />
云斑：在颜色比较淡的或半透明的材料上的暗黑的或无光泽的条纹或斑点(如在大理石上)。<br />
云母纹：像云母断面及砂子闪烁光泽的纹理。</p>
<p><strong>注：</strong>在原文中，是没有把每个色彩的色彩值写上的，我感觉这样用起来会很不方便，用取色器获取的颜色也可能不准确，就在每个颜色名称后面一一标注了。</p>
<p>原文作者：青女 附注及色样添加：Quester 转自<a href="http://css9.net/chinese-traditional-color-in-web-desig/" onfocus="onfocus">css9.net</a></div>
<div class="related_box"><h2  class="related_post_title">您也许也会喜欢这些：</h2><ul class="related_post"><li><a href="http://www.ishowsky.cn/2010/11/user-experience/" title="用户体验呓语">用户体验呓语</a></li></ul></div><table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">您或许对这些文章有兴趣：</font></b></td>
    </tr>
    
        <tr>
                <td width="111" 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.ishowsky.cn%2F2010%2F11%2Fuser-experience%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31432715.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !important;">
                    <a target="_blank" title="分享Web2.0 Phtoshop的图层样式和渐变样式" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.ishowsky.cn%2F2010%2F11%2Fweb2-ps-gradients%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31432773.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">分享Web2.0 Phtoshop的图层样式和渐变样式</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !important;">
                    <a target="_blank" title="36个精品CSS框架推荐！提高设计开发效率！" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.ishowsky.cn%2F2011%2F11%2F36-css-frame%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/11/01/10115009.png" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">36个精品CSS框架推荐！提高设计开发效率！</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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.ishowsky.cn%2F2010%2F10%2Fuser-operation%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31432736.bmp" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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.ishowsky.cn%2F2011%2F08%2Fnight%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/09/16/31432335.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !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>
        <br/>
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">来自无觅网络的相关文章：</font></b></td>
    </tr>
    
        <tr>
                <td width="111" 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%2Fiwucha.com%2Fblog%2Fcolorful-building%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/05/25/9523196.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">【摄影】色彩丰富的建筑 (@iwucha)</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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%2Fiwucha.com%2Fblog%2Fcolorful%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/10/25/9795828.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">【插画】舞动色彩 (@iwucha)</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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.ycy8.net%2F2011_8977.html&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/07/15/17475336.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">色彩之美 (@ycy8)</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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%2Fiwucha.com%2Fblog%2Fnice-color-photo%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2011/08/01/20352607.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">【摄影】一组色彩优雅的照片 (@iwucha)</font>
                    </a>
                </td>
                <td width="111" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #CCCCCC !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%2Fiwucha.com%2Fblog%2Fcolors%2F&from=http%3A%2F%2Fwww.ishowsky.cn%2F2009%2F12%2Fweb%25E8%25AE%25BE%25E8%25AE%25A1%25E8%2589%25B2%25E5%25BD%25A9%25E9%2580%259F%25E6%259F%25A5%25E8%25A1%25A8%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #CCCCCC !important; width: 105px !important; height: 105px !important;" src="http://static.wumii.com/site_images/2012/01/06/13523083.jpg" width="105px" height="105px" /><br />
                        <font size="-1"  style="display: block !important; line-height: 15px !important; width: 111px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">【设计】关于颜色的搭配 (@iwucha)</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="5" 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.ishowsky.cn/2009/12/web%e8%ae%be%e8%ae%a1%e8%89%b2%e5%bd%a9%e9%80%9f%e6%9f%a5%e8%a1%a8/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

