<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0">
<channel>
<title>UI Channel.com - 中国UI设计聚合媒体</title>
<link>http://www.uichannel.com</link>
<description>欢迎订阅UIChannel.Com</description>
<item>
<title><![CDATA[设计的小事：创新排名的那点事儿]]></title>
<author>lytous</author><pubDate>Wed, 07 Jan 2009 10:31:52 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=206</link> 
<description><![CDATA[<div>
<p><strong>印度工业总会与欧洲工商管理学院6日公布2008-09年全球创新指数显示,在全球130个国家和地区排行榜上,美国排名第一,中国大陆排名37名.<br />
</strong><br />
首先这个&ldquo;2008-09全球创新指数(Global InnovationIndex 2008-09)&rdquo;报告,是由印度工业总会与欧洲工商管理学院在印度新德里公布的，印度自己给搞成了41名，不能不说是个尴尬.</p>
<p>报告显示,在创新能力整体排名方面,前10名和得分依次为美国(5.28)、德国 (4.99)、瑞典(4.84)、英国(4.82)、新加坡(4.81)、韩国(4.73)、瑞士(4.73)、丹麦(4.69)、日本(4.65)与荷兰(4.64).日本从去年的第四名滑落到第九名.</p>
<p>我不了解这个排名是否公正，但从整体逻辑上还是比较合理的，中国排到37位应该是评审委员会没有考虑到我们&ldquo;优秀&rdquo;的山寨产业的创新能力，如果他们进一步的深入理解了我们是如何应用三聚氰胺的，估计会对我们的创新能力刮目相看。</p>
<p>那么既然我们的排名并不理想是不是因为我们的创新机制出了什么问题？</p>
<p>1.&nbsp; 是不是外国人的脑筋就要好用一些？就要聪明一些？答案是否定的，因为这份报告中台湾地区排名第16(4.41)、香港地区排名12(4.59).那么人种学的观点不对了，都是中国人凭啥有创新能力的都去了香港和台湾呢？那就应该是环境的问题了。</p>
<p>2. 创新和经济是有关系的，国家的收入水平决定了能够鼓励创新的力度,如经济合作暨发展组织会员国的排名,都超过非会员国.在贫困非洲地区,仅南非排名第43.那么中国是不是穷呢？应该不是，国家一家伙拿出4万亿发展经济足以证明我们的国力雄厚，但是基本面的问题也是最大的问题，科技，农业，工业，制造业，军事，医疗等重要部门都需要这个钱来拉动，而且那是和民生联系最紧密的部分，所以剩下给到艺术，教育，创意产业的部分就很可怜了，创意这东西在吃饱饭的前提下才有意义，所以我们的创新一直是雷声大雨点小，爹不疼娘不亲的行业。</p>
<p>3.&nbsp;我们的人才还不够形成一个行业的支撑，或者说流失太多，创意人大多数需要尊重，他们很脆弱，我在这儿干不出名堂我就干脆出国了，人家重视我嘛，这个不单是物质待遇方面，更有社会定位，话语权等等问题，于是我们就发现很多艺术家和设计师总惦记着出国，而就算在国内的，也惦记着跳槽，换环境，因为创新精神是不能和物质满足对立的，就形成了很多人的浮躁和不踏实。</p>
<p>4. 我发现我们国内现在掀起一股专利热，都是看着高通等外资专利巨头给眼馋的，但是真正变化为可量产的产品，变成造福人民的服务的少之又少，我们的创意总是束之高阁，好像都是中科院那级别的才配叫创新似的。在国家大力推动创新，鼓励创意的同时，我们的孩子还是看的巨烂的动画片，我们用的还是巨烂的产品，我们吃的还是巨烂的甚至有生命危险的食物。这到根本还是一个全民意识和执行力的问题。</p>
<p>5. 我们的创意产业经常有闹剧发生，你别看国际上对这东西排名很在意，我们自己也搞，媒体在搞，企业在搞，政府在搞，一年从地方到中央，各大排名和比赛层出不穷，但基本都是创意搭台，经济唱戏，展会和假日消费成了创意最大的出路。我们就看见了很多黑幕，内定事件，买奖事件，互相制造专利壁垒，强欺弱大欺小。搞创意经济没错，但搞创意政治就有点卑劣了。</p>
<p>6. 我们的企业还对创新的价值心存芥蒂，不到万不得已，绝对不敢轻易&ldquo;创意&rdquo;，而且鼓励和推广创意的企业内机制也不完善，创意人员似乎被当作破坏次序，不尊重公司文化的人，或者艺术家，不守规矩的人对待。这都是我们积累太久的经验主义的毛病，而少数大胆创新的企业也在走入一个误区，想节省成本实行拿来主义，却不知道是否合适自己的企业和产品，国外的专家请来讲座了一批，参观了一批，指导了一批，顾问了一批。。。。产品还是那个产品，体制还是那个体制。</p>
<p>P.S：&ldquo;全球创新指数&rdquo;旨在评估各国和地区针对创新挑战做出的反应,满分为七分,评估项目包括制度与政策、创新驱动、知识创造、企业创新、技术应用与知识产权等,提供企业领袖与政府决策者了解提升一国竞争力可能面临的缺失与改进方向。</p>
</div>]]></description>
</item>
<item>
<title><![CDATA[UCDChina社区文集-《UCD火花集》近期面市]]></title>
<author>UIChannel</author><pubDate>Tue, 30 Dec 2008 18:28:58 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=205</link> 
<description><![CDATA[<div>
<p>炮制已久的UCDCHINA大社区的第一本正式出版物就要面市，先发布我们这本书的前言，敬请大家期待。</p>
<p>转载。原文地址：<a href="http://ucdchina.com/blog/?p=530"><font color="#008000">http://ucdchina.com/blog/?p=530 </font></a></p>
<p>2002年左右，UI（User Interface：用户界面）的概念在国内互联网圈子里悄悄地流行开来，随着对UI的深入研究，更多的概念不断地被挖掘出来： 易用性、可用性、用户研究、交互设计、概念设计、用户体验&hellip;&hellip;而在对这些的方法论、思潮的学习和应用中，&ldquo;概念越来越多，疑问也越来越多&rdquo;。大家渐渐发现，我们走上了&ldquo;弯路&rdquo;，过多过早的陷入到问题的细节。解决这些问题的根源应该从头开始，应该都汇集到一个问题上：我们为什么要做这个产品？</p>
<p>现在我们知道，产品的根本，并不在于功能如何强大、内容如何丰富、界面如何炫目。事实上，一个不太好用的产品，只要能帮助用户解决需求，也不失为成功；而一个又能解决问题又好用的产品，基本都可以算是优秀了。因而，在进行细节设计之前，解答&rdquo;我们为什么要做这个产品&rdquo;，才是解决产品问题的根本。</p>
<p>要掌握这个根本，首先要了解&rdquo;用户需求&rdquo;，解答&rdquo; 产品能为用户做什么&rdquo;；其次是设计&rdquo;用户怎么用&rdquo;，使用&rdquo;人&rdquo;的逻辑而非&rdquo;机器&rdquo;的逻辑；最后才是努力使之&rdquo;好用&rdquo;，给使用者良好的&rdquo;操作感受&rdquo;。</p>
<p>产品，不仅仅是实现功能这么简单。</p>
<p>这些感悟，是一群有着相同信仰的互联网虫子，在寻求答案的过程中，慢慢总结出来的。他们总是有事没事混在一起畅想未来、讨论设计。在交流想法的同时，大家发现各自学习和成长的过程，惊人的相似：从书本上接触到了先进概念、摸索着应用、发现困难重重。特别是这些理论多来源于软件产品设计，把软件设计的理论强 搬到互联网产品设计上，总是有很多的不适合；也许是书本中提到的概念，已经落后于互联网技术和产品形态的发展；也许是中西方文化有着天壤之别，无法照 抄&hellip;&hellip; 总之，大家都在&rdquo;理论结合实际&rdquo;的过程中走得跌跌撞撞，摔了不少跟斗。</p>
<p>平淡的某天，有人说：我们需要一个开放的心。要有一个地方让大家相互讨论和借鉴。我们需要的是真实案例和方法，尽管不像一本书、一个方法论、一套思想体系那样成熟，但是在&rdquo;前无来者&rdquo;的情况下，有一个平台让大家讲出自己的观点，分享心得和工作感悟，让其他人在面临同样的问题时有经验可以借鉴，不犯同样的错误，这就够了。 这个提议，引起了其他人的连连感慨：&ldquo;我们需要一个行业氛围&rdquo;、&ldquo;我们需要让更多的人认识用户体验及其价值&rdquo;&hellip;&hellip; 于是，在一片群情激昂声中，大家简单地分配了一下工作。</p>
<p>10天以后，2007年3月21日零时，UCDChina.com正式上线发布， 并发布了第一期的话题：&ldquo;用户体验设计在团队中的角色&rdquo;。她只是一个简陋的，连模板都没有的&ldquo;群体博客&rdquo;。澎湃的动力源自于大家的热情，也源自于我们的高 度统一和高度不一致。统一的是想法，不一致的是各自风格，这两个东西放在一起是天然的绝配，从一开始在现在，乃至将来，他们都在，并且一定会被很好的继承。</p>
<p>从定期推出系列话题讨论，到不满足线上讨论开始组织线下的&ldquo;UCD书友会&rdquo;（如今，已有7个城市，在每月的第三个周日，同时进行讨论），到收集国内外优秀的设计网址编成&ldquo;UCD网址导航&rdquo;，再到发起&ldquo;UCD翻译小组&rdquo;。UCDChina所做的东西都是自然而然产生的，没有人去规划它的发展，也没有人在&rdquo;设计&rdquo;，所有的过程都是自发的。目的，都是源于我们那个简朴的愿望：用这样一个平台，一起做些实实在在的事。</p>
<p>这就是你所看到的&rdquo;UCD大社区&rdquo;， 一个从粗糙的群体博客开始，慢慢走向开放、更开放的用户体验和产品设计行业的综合社区。我们希望这个社区能帮助每一个设计师解决实际的问题，成为设计师可依赖和信赖的&ldquo;知识库&rdquo;。</p>
<p>我们凭着热情做事，一点一点地收集思想的火花。直到有一天，出版社找到我们，说火花足够多、足够明亮，汇到一起，能照得更远，于是就有了你手里捧着的这本书。</p>
<p><strong>如果你想加入我们的行列，有两句话希望你能记住：</strong></p>
<p>1. 你不是用户。<br />
2. 产品的意义，是为用户创造价值。</p>
<p>UCD大社区(<a href="http://ucdchina.com/"><font color="#008000">http://UCDChina.com</font></a>)欢迎你来贡献更多的思想火花！联系我们，请发邮件到<a href="mailto:ucdchina@gmail.com"><font color="#008000">ucdchina@gmail.com</font></a>或访问我们的邮件组 <a href="http://groups.google.com/group/UCDChina"><font color="#008000">http://groups.google.com/group/UCDChina</font></a>。</p>
<p><strong>内容导读</strong></p>
<p>本书收集了UCDChina上线以来推出的13个话题，内容涵盖了产品设计的全部流程，按顺序集结到第一到第十三章中，讨论了如何研究用户、如何将用户需求应用到产品设计中、如何传达和协作。在第十四章，几位设计师分享了生活中的UE故事。第十五章，列举了一些实例和实践者的观点。本书适合有一定工作经验，从事产品设计、产品策划、交互设计、视觉设计、用户研究、前端开发、网站运营，以及所有与互联网有关的从业人员阅读。</p>
<p>Angela 执笔</p>
</div>]]></description>
</item>
<item>
<title><![CDATA[火星时代杯玩一把斗地主游戏桌面设计大赛]]></title>
<author>song5714</author><pubDate>Fri, 26 Dec 2008 16:16:48 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=204</link> 
<description><![CDATA[<div>
<p style="line-height: 180%" align="left" valign="top">我的界面 你做主</p>
<p>活动介绍：<br />
玩一把为了设计出更符合用户习惯的游戏界面，现向全球所有设计高手发出邀请，请您设计出你自己喜欢的游戏桌面，我们会挑选出最优秀的n张，并按照原稿设计成游戏桌面。当然我们也为您准备了丰厚的奖金，快点来拿吧！<br />
本次活动设置了多个参赛点：玩一把、火星时代、Student HR（大学生）、网页设计者联盟，您作为玩一把官方的选手快来和其他赛点设计者们来pk吧，看谁的设计实力最牛，奖金虽少，面子是大！</p>
<p>活动页面http://www.wan1ba.com/huodong/sheji/jmsjds.jsp</p>
<p>活动名称：我的界面 你做主<br />
主办方：玩一把（www.wan1ba.com）火星时代（www.hxsd.com）<br />
协办方：student HR（www.studenthr.org）<br />
网页设计者联盟（www.68design.net）</p>
<p>活动时间：2008-12-27&mdash;&mdash;2009-3-05<br />
参与对象：全球设计爱好者<br />
报名费用：免费</p>
<p>奖项设置<br />
最佳设计奖：2000元及证书（1名）<br />
最受欢迎奖：1000元及证书（1名）<br />
入围奖：100元（5名） <br />
所有参赛者将免费享用玩一把超级会员1年</p>
<p>评审流程及规则：<br />
初赛网络投票<br />
本次活动参赛初赛采取网络投票，网络投票前100进入复赛。</p>
<p>复赛专家评审<br />
评审专家对进入复赛的100幅作品进行打分，并最终评选出大赛的获奖者</p>
<p>评分标准：<br />
版面与视觉感受：50分<br />
图片使用得当，网页内各个元素搭配合理，色彩搭配协调，页面美观。 <br />
创意：30分<br />
页面具有较强的个人设计创意。 <br />
网页整体风格创意，色彩搭配鲜明，内容布局合理。 <br />
用户体验：20分<br />
正常的玩游戏还是页面的主要元素，在此基础上进行发挥。</p>
<p>活动流程：<br />
2008-12-27&mdash;2009-2-11，参赛者在此时间段设计、提交作品。<br />
2009-2-11&mdash;2009-2-28，为用户投票时间，投票结束，将产生并颁发&ldquo;最受欢迎设计奖&rdquo;。<br />
2009-2-28&mdash;2009-3-05，专家对进入复赛的100副作品进行评分，最后结束将在活动页面公布。</p>
</div>]]></description>
</item>
<item>
<title><![CDATA[JJ-Maxer祝大家圣诞快乐（图标）]]></title>
<author>jjmaxer</author><pubDate>Thu, 25 Dec 2008 18:31:55 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=203</link> 
<description><![CDATA[<div>祝大家圣诞快乐！</div>
<div><img height="727" width="504" alt="" src="/userfiles/08 Merry Xmas !(1).png" /></div>]]></description>
</item>
<item>
<title><![CDATA[推荐《设计的小事：报价的指导原则》]]></title>
<author>Metalica</author><pubDate>Thu, 25 Dec 2008 15:29:13 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=202</link> 
<description><![CDATA[<div>
<p>近期虽然说金融危机，大家都说生意不好做，但是我发现近期找人做设计，做网站，做推广的企业还增多了。仔细考虑也是，经济好的时候不用包装，不用广告，不用设计，东西还是卖得好，经济不好的时候，企业和产品更需要包装和宣传，更需要通过视觉上吸引消费者，现在大家花钱都很小心谨慎，恨不得一分掰成两分花，自然对于产品的各方面的品质要求都提高了 - 这还得有个前提，你的产品不能涨价。</p>
<p>自然，有些同行朋友最近和我沟通起了该如何报价的问题，这里面有自己做设计公司的朋友，也有做SOHO的朋友，我大致思考了下，写了这篇文章，给大家做个参考。</p>
<p>当然，根据不同地区的经济水平和实际的行业状况，这些通用性的准则不一定都能发挥效用，但是仍然可以使我们保持清晰的头脑，在价格因素日趋透明的情况下保证自己的利益。</p>
<p>&nbsp;</p>
<p><strong>1. 可提供的服务层次</strong></p>
<p>&nbsp;&nbsp;&nbsp; 无论你是公司还是个人，请清晰的分析你自己能够提供的服务，公司和个人之间的报价并不是绝对的，没人规定公司的价格就一定要比个人SOHO高，也没人说个人SOHO一定要委曲求全降低价格争夺订单。比如某个公司只能提供网站视觉设计服务，而你一个人可以提供网站的视觉设计，交互设计，HTML制作，FLASH动画等服务，自然你的报价会随着服务内容的增加而增加。</p>
<p>&nbsp;&nbsp;&nbsp; 而由于现在滥竽充数的公司太多，导致客户也会公司的体系显得难以信任，面对个人的时候，客户仍然觉得自己是更有话语权的，当然，我们会发现部分的个人SOHO无论在单项服务还是整体设计上都比公司报价要高，我们后面会谈这个现象是什么原因造成的。</p>
<p><strong>2. 客户需要区别对待</strong></p>
<p>&nbsp;&nbsp;&nbsp;&nbsp; 作为设计师，你当然希望价格是完全根据你的设计的价值来确定的，但是市场的杠杆在我们设计行业中总是偏向资本的一方，而这种情况短期不会改变。这就出现了我们认为的&ldquo;大客户&rdquo;和&ldquo;小客户&rdquo;，目前流行的做法是以项目前期的预算来区别，比如我们设计一个网站，设计预算在10W左右的，我称为大客户，低于5W的我称为小客户。</p>
<p>&nbsp;&nbsp;&nbsp; 但是这样的区别是不够的，我们还应该加入一个维度，就是客户对于设计的认识与价值评判，如果一个客户在设计预算方面初步给了很高的价格，但是最终实行的时候将项目时间拉长，对设计的评判不客观，甚至出现&ldquo;长尾跟踪&rdquo;的修改情况，那么折算了时间和人力成本后，我们的项目其实也就是2个小小项目而已。</p>
<p>&nbsp;&nbsp;&nbsp; 我们在报价的时候要注意对更了解设计的客户，应该从阶段性工作入手，分析每个模块的价格，而对不了解设计的客户来说，最好做一个总价然后再打个九折，因为他们对设计并不看重，而是看重你在相同的时间提供类似的服务所花的费用。</p>
<p><strong>3. 知道你的成本在哪里</strong></p>
<p>&nbsp;&nbsp;&nbsp; 有客户（甚至有不少设计师）认为个人SOHO设计师是几乎没有成本的职业，只要动动鼠标就能够赚钱，所以在极大的不平衡和不了解的情况中，对于SOHO设计师残酷的压价，导致最后设计师提供模板性的作品，客户感觉遭受欺骗，那么如何跳出这个恶性循环？</p>
<p>&nbsp;&nbsp;&nbsp; 告诉你的客户，他的钱都花在哪儿了，并且你为这个设计项目付出了多少时间，顾问费用，咨询费用甚至是设备等费用，你的报价最好是以时间和项目内容为主的，而不是一个简单的我要多少钱，因为设计行业没有一个沃尔玛，缺乏一个标准的客观值。</p>
<p><strong>4. 知道你的利润在哪里</strong></p>
<p>&nbsp;&nbsp;&nbsp; 不少刚开始自己做SOHO，或者自己开设计公司的朋友，总觉得客户源还不错，价格也不菲，但是到月底盘点的时候居然发现自己的钱没有多少，他们会非常疑惑，究竟钱花到哪里去了。</p>
<p>&nbsp;&nbsp;&nbsp; 很多设计师认为只要是客户打到账号上的钱都是利润，错了，你每天的开销还有设备的更新，参考资料和版权支付的费用，聘请其他专业人员做项目配合的费用都是在无形中花掉的，而你没有记账的习惯，导致自己的利润在不断流失还不自治。</p>
<p>&nbsp;&nbsp;&nbsp;&nbsp; 一个成功的做法是，你在报价的前期就应该全面的考虑你的成本和利润之间的比例，如果你这个项目还不能维持你的平均设计品质，我觉得就没有意义继续谈下去了。</p>
<p><strong>5. 知名度的价值</strong></p>
<p>&nbsp;&nbsp;&nbsp; 设计是一个属于文化范畴的东西，它和时尚一样，品牌的价值是非常关键的，这牵涉到你的个人的知名度还有你的作品的知名度，甚至是你的公司的知名度。你要知道，任何环境中的用户总是相信大品牌的，这意味着你要花费更多的时间和金钱去营造你的品牌价值，而这个有形的付出会在日后无形的影响着你的每个客户。</p>
<p>&nbsp;&nbsp;&nbsp; 在你的报价中，你首先要突出的是前期的沟通，千万不要一开始就说明最终价格，那是很冲动而且幼稚的，只有白菜才会标价出售，设计师是一只股票，股票的价值在于人们对他的预期，而这个预期相当合理的话（通过你的作品表现），人们会愿意付出更多的钱来拥有，这就是追涨。</p>
<p><strong>6. 影响报价的附加因素</strong></p>
<p>&nbsp;&nbsp;&nbsp; 报价本身是一门学问，而创造报价合理的环境更是一门学问？什么是环境？就是任何支持你的报价的元素，我认为有以下几点是你必须重视的：一个展示你自己作品的优秀的网站，一个不错的行业的口碑（你要知道客户是会使用<a href="http://www.google.com/" target="_blank"><font color="#8ab459">google</font></a>的），整洁有一些创意的办公环境（无论是在家里还是有一个租用的写字楼，你会不定期的接待客户的来访），谈判时的穿着和谈吐（这个部分大概会影响你的报价的50%以上）。</p>
<p>&nbsp;&nbsp;&nbsp; 在谈到报价的时候，我们就不单纯是一个设计师了，你的作品好不好你自己说了不算，你那几个臭味相投的朋友说了也不算，你要给人值得信赖甚至依赖的印象，这就是我们说的视觉营销。</p>
<p><strong>7. 合同的整理</strong></p>
<p>&nbsp;&nbsp;&nbsp;&nbsp; 一个设计师是否优秀，看看他发给客户的合同是不是专业就知道了，一个设计师的思维细腻和友善可以通过一份合同准确的描述出来，你的客户也许对设计不太了解，但是谈到合同，他们了解的程度就像你打开<a href="http://www.adobe.com/" target="_blank"><font color="#8ab459">photoshop</font></a>的次数一样。</p>
<p>&nbsp;&nbsp;&nbsp; 合同中不但要包括详细的服务内容，详细的价格，双方的责任和免责条款，还有出现问题时的建议解决方案，你要知道，主观的东西（通常是对于设计作品质量的认同）太复杂，太啰嗦，不拿白纸黑字写清楚，你的客户会认为你在默认他们的无知与蛮横。</p>
<p><strong>8. 好好处理财务</strong></p>
<p>&nbsp;&nbsp;&nbsp; 你知道设计网站和提供海报印刷的税率不同么？你知道如何避税么？你了解财务周转的时候，银行之间的手续费么？你知道美国客户打款给你时的周期还有汇率么？如果你不清楚这些，那么请马上开始补课，因为他们非常重要。</p>
<p>&nbsp;&nbsp;&nbsp; 明确你的设计报价是税前还是税后是最重要的，而对于设计内容的后期维护也需要一个妥善的财务计划，这不但是降低自己的损失，也让客户没有后顾之忧，我了解的客户中，最害怕的事情就是&ndash;和某个设计师合作后，发现无法获得发票，也不知道如何处理周期性的费用。</p>
<p>&nbsp;&nbsp;&nbsp; 你可以选择一个能信任的公司，作为他们的独立设计师出现，让他们来走发票的流程，也可以自己注册一个小公司，而之间的利益分配，又是二级客户的问题了。</p>
<p><strong>9. 报价的铁律</strong></p>
<p>（1）必须收30%预付款，无数次的事实证明，没有付预付款的客户大多数都是套着羊皮的狼，甚至他们会让公司最漂亮的市场MM和你套近乎，等到方案到手一般都是肉包子打狗；</p>
<p>（2）发票或收据的事情必须先有准备，别等到客户问起再说，收了钱要负责，要认账；</p>
<p>（3）必须有浮动的空间，考虑到客户的成本和设计需求，合理的计算利润，并帮助客户在不必要的环节省钱（软件，硬件，维护，推广等。。。。大家都要混饭吃，为了咱设计行业的顺利发展，就对不住各行业的兄弟了），别做出一副要把客户生吞活刮的气势；</p>
<p>（4）别随意打折降价，无论是大客户还是小客户，做多少服务给多少钱，你的第一次报价决定了你在客户心中的层次，很多客户会告诉你：&ldquo;这次合作有三个设计团队参与了，其实我们挺看好你的方案，只要你再便宜3000块钱，合同我们马上签。&rdquo;，这样的基本都是奸诈的市场人员的说辞，你可以直接告诉他：&ldquo;爷从来不比稿！&rdquo;</p>
<p>（5）不要相信所谓的长期合作，如果你签的不是统一的框架协议，那么所谓&ldquo;长期合作&rdquo;基本都是在为讨价还价做铺垫，无数设计师都因为这样被忽悠了，然而又成了不能说的秘密。我的做法是：&ldquo;咱还不够了解，这次合作好了再说，长期合作我也是阶段性打折。&rdquo;</p>
<p>（6）报价协议要搭配着服务协议，明确设计周期，修改次数，确认方式和沟通方式，责任人等一系列问题，要不每个环节都有可能被客户抓住把柄，你要知道客户都是沾上毛比猴还精的，我们这些纯洁的设计师怎么能和他们一般见识呢？还是丑话说在前头吧，对大家都有好处。</p>
</div>]]></description>
</item>
<item>
<title><![CDATA[定制的PS网页设计分辨率模板]]></title>
<author>Metalica</author><pubDate>Tue, 23 Dec 2008 09:40:30 GMT</pubDate>
<link>http://www.uichannel.com/Tutor/Detail.aspx?ID=66</link> 
<description><![CDATA[<div>作为一个网页设计师，你会需要一些浏览器的范本来检验你的WEB设计是否符合所有的分辨率。增加了浏览器的兼容性，将帮助您或您的客户更了解该网站将呈现的真正的样子。</div>
<div>&nbsp;</div>
<div>以下是自由软件的浏览器模板，screendesign有1024 &times; 768像素和800 &times; 600像素大小，各种不同的浏览器（ Firefox的IE浏览器，opera，safari等... ）的模板文件。无论大小如何，安全观看区都是在一个单独的层内，方便调试。</div>
<div>&nbsp;</div>
<div>浏览器组件也分离到单个的层中，因此您可以按照自己的喜好来调整：页面标题，地址字段，小图标，滚动条和Dropshadow 。这个打包是完全免费的。</div>
<div>&nbsp;</div>
<div>原始地址：<a href="http://www.webdesignerstoolkit.com/#download">http://www.webdesignerstoolkit.com/#download</a></div>
<div>&nbsp;</div>
<div><img alt="" src="/userfiles/browser-templates.png" /></div>
<div>&nbsp;</div>
<div>
<div class="spaltelinksdrittel">
<h4>Windows Browsers:</h4>
<ul>
    <li><a class="firefox-win" onmouseover="MM_swapImage('browser','','img/firefox_1024_800_win.jpg',1)" href="http://www.webdesignerstoolkit.com/download/firefox_1024_800_win.psd.zip">Firefox 1.0 <em>.psd, 548kB</em></a></li>
    <li><a class="firefox-win" onmouseover="MM_swapImage('browser','','img/firefox_1024_800_winXP.jpg',1)" href="http://www.webdesignerstoolkit.com/download/firefox_1024_800_winXP.psd.zip">Firefox 1.5 /XP <em>.psd, 584kB</em></a></li>
    <li><a class="opera-win" onmouseover="MM_swapImage('browser','','img/opera8.5_1024_800_win.jpg',1)" href="http://www.webdesignerstoolkit.com/download/opera8.5_1024_800_win.psd.zip">Opera 8.5 <em>.psd, 608kB</em></a> <!--
    <li><a href="download/opera8.5_1024_800_winXP.psd.zip" class="opera-win" onmouseover="MM_swapImage('browser','','img/opera8.5_1024_800_winXP.jpg',1)">Opera 8.5 /XP <em>.psd, 624kB</em></a> </li>
    --></li>
    <li><a class="netscape-x" onmouseover="MM_swapImage('browser','','img/netscape8_1024_800_win_en.jpg',1)" href="http://www.webdesignerstoolkit.com/download/netscape8_1024_800_win_en.psd.zip">Netscape 8 <em>.psd, 608kB</em></a></li>
    <li><a class="netscape4-win" onmouseover="MM_swapImage('browser','','img/netscape4.8_1024_800_win_en.jpg',1)" href="http://www.webdesignerstoolkit.com/download/netscape4.8_1024_800_win_en.psd.zip">Netscape 4.8 <em>.psd, 576kB</em></a></li>
    <li><a class="explorer-x" onmouseover="MM_swapImage('browser','','img/explorer5_1024_800_win_en.gif',1)" href="http://www.webdesignerstoolkit.com/download/explorer5_1024_800_win_en.psd.zip">Explorer 5 <em>.psd, 600kB</em></a></li>
</ul>
</div>
<!-- /spaltelinksdrittel -->
<div class="spaltemittedrittel">
<h4>Mac OS X Browsers:</h4>
<ul>
    <li><a class="firefox-x" onmouseover="MM_swapImage('browser','','img/firefox1.5_1024_800_OsX.gif',1)" href="http://www.webdesignerstoolkit.com/download/firefox1.5_1024_800_OsX.psd.zip">Firefox 1.5 <em>.psd, 168kB</em> </a></li>
    <li><a class="camino" onmouseover="MM_swapImage('browser','','img/camino_1024_800_OsX.gif',1)" href="http://www.webdesignerstoolkit.com/download/camino_1024_800_OsX.psd.zip">Camino 1.0 <em>.psd, 176kB</em> </a></li>
    <li><a class="opera-x" onmouseover="MM_swapImage('browser','','img/opera8.5_1024_800_OsX.gif',1)" href="http://www.webdesignerstoolkit.com/download/opera8.5_1024_800_OsX.psd.zip">Opera 8.5 <em>.psd, 176kB</em></a></li>
    <li><a class="netscape-x" onmouseover="MM_swapImage('browser','','img/netscape7_1024_800_OsX_en.gif',1)" href="http://www.webdesignerstoolkit.com/download/netscape7_1024_800_OsX_en.psd.zip">Netscape 7.1 <em>.psd, 212kB</em></a></li>
    <li><a class="safari-x" onmouseover="MM_swapImage('browser','','img/safari2_1024_800_OsX.gif',1)" href="http://www.webdesignerstoolkit.com/download/safari2_1024_800_OsX.psd.zip">Safari 2.0 <em>.psd, 212kB</em> </a></li>
    <li><a class="explorer-x" onmouseover="MM_swapImage('browser','','img/explorer5_1024_800_OsX_en.gif',1)" href="http://www.webdesignerstoolkit.com/download/explorer5_1024_800_OsX_en.psd.zip">Explorer 5.2 <em>.psd, 500kB</em></a></li>
</ul>
</div>
<!-- /spaltemittedrittel -->
<div class="spalterechtsdrittel">
<h4>Mac Classic Browsers:</h4>
<ul>
    <li><a class="mozilla-9" onmouseover="MM_swapImage('browser','','img/mozilla_1024_800_Os9.gif',1)" href="http://www.webdesignerstoolkit.com/download/mozilla_1024_800_Os9.psd.zip">Mozilla <em>.psd, 96kB</em></a></li>
    <li><a class="icab-9" onmouseover="MM_swapImage('browser','','img/iCab_1024_800_Os9_en.gif',1)" href="http://www.webdesignerstoolkit.com/download/iCab_1024_800_Os9_en.psd.zip">iCab <em>.psd, 96kB</em></a></li>
    <li><a class="netscape7-9" onmouseover="MM_swapImage('browser','','img/netscape7_1024_800_Os9_en.gif',1)" href="http://www.webdesignerstoolkit.com/download/netscape7_1024_800_Os9_en.psd.zip">Netscape 7 <em>.psd, 112kB</em></a></li>
    <li><a class="netscape4-9" onmouseover="MM_swapImage('browser','','img/netscape4.8_1024_800_Os9_en.gif',1)" href="http://www.webdesignerstoolkit.com/download/netscape4.8_1024_800_Os9_en.psd.zip">Netscape 4.8 <em>.psd, 100kB</em></a></li>
    <li><a class="explorer-9" onmouseover="MM_swapImage('browser','','img/explorer5_1024_800_Os9_en.gif',1)" href="http://www.webdesignerstoolkit.com/download/explorer5_1024_800_Os9_en.psd.zip">Explorer 5.1 <em>.psd, 104kB</em></a></li>
</ul>
</div>
<!-- /spalterechtsdrittel --></div>]]></description>
</item>
<item>
<title><![CDATA[3D手机菜单一套]]></title>
<author>chuand1111</author><pubDate>Mon, 22 Dec 2008 18:04:22 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=201</link> 
<description><![CDATA[<div><img alt="" src="/userfiles/ui01.jpg" /></div>
<div>01.</div>
<div><img alt="" src="/userfiles/ui02.jpg" /></div>
<div>2.</div>
<div><img alt="" src="/userfiles/ui03.jpg" /></div>
<div>3.</div>
<div><img alt="" src="/userfiles/ui.jpg" /></div>
<div>4.</div>
<div>原文地址：<a href="http://hi.baidu.com/andy1226/blog/item/b2279a4b380e07f782025ced.html">hi.baidu.com/andy1226/blog/item/b2279a4b380e07f782025ced.html</a></div>]]></description>
</item>
<item>
<title><![CDATA[12月UCD书友会深圳站现场发布]]></title>
<author>UIChannel</author><pubDate>Sun, 21 Dec 2008 22:25:03 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=200</link> 
<description><![CDATA[<div>2008年12月21日，UCD书友会深圳站如期举行，本次话题&ldquo;留言和评论&rdquo;。</div>
<div>&nbsp;</div>
<div>书友会负责人周陟在现场进行了PPT演讲讨论和沟通，并逐一针对细节问题和书友会成员进行交流。</div>
<div>&nbsp;</div>
<div>作为2008年最后一场书友会，这次布置了小作业，让大家在参与讨论的同时做一个回顾和记录。</div>
<div>&nbsp;</div>
<div>现场部分照片：</div>
<div>&nbsp;</div>
<div><img alt="" src="/userfiles/ucd1.jpg" /></div>
<div>&nbsp;</div>
<div><img height="480" width="650" alt="" src="/userfiles/ucd2.jpg" /></div>
<div>&nbsp;</div>
<div><img alt="" src="/userfiles/ucd3.jpg" /></div>
<div>&nbsp;</div>
<div><img height="480" width="650" alt="" src="/userfiles/ucd4.jpg" /></div>
<div>&nbsp;</div>
<div><img height="480" width="650" alt="" src="/userfiles/ucd5.jpg" /></div>
<div>&nbsp;</div>
<div><a target="_blank" href="http://uichannel.com/books/m_c.ppt">【书友会讨论课PPT下载】</a></div>
<div>&nbsp;</div>]]></description>
</item>
<item>
<title><![CDATA[30个有创意的工作室设计]]></title>
<author>firerose</author><pubDate>Wed, 17 Dec 2008 09:30:04 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=199</link> 
<description><![CDATA[<div>来自office design 收集的SOHO工作人员的创意工作室设计，包含PC或MAC的，看看国外的设计师的工作环境和设备，真是羡慕啊~~~</div>
<div>&nbsp;</div>
<div><img height="375" width="500" alt="" src="/userfiles/apple-cinema.jpg" /></div>
<div>&nbsp;</div>
<div><img height="375" width="500" alt="" src="/userfiles/apple-wing.jpg" /></div>
<div>&nbsp;</div>
<div><img height="334" width="500" alt="" src="/userfiles/Bimmerchop.jpg" /></div>
<div>&nbsp;</div>
<div><img height="375" width="500" alt="" src="/userfiles/chris.jpg" /></div>
<div>&nbsp;</div>
<div><img height="375" width="500" alt="" src="/userfiles/christ01.jpg" /></div>
<div>&nbsp;</div>
<div><img height="375" width="500" alt="" src="/userfiles/christ02.jpg" /></div>
<div>&nbsp;</div>
<div><img height="333" width="500" alt="" src="/userfiles/cincinnati.jpg" /></div>
<div>&nbsp;</div>
<div><img height="333" width="500" alt="" src="/userfiles/cold-eskimo.jpg" /></div>
<div>&nbsp;</div>
<div><img height="265" width="500" alt="" src="/userfiles/dark.jpg" /></div>
<div>&nbsp;</div>
<div><img alt="" src="/userfiles/dziner.jpg" /></div>
<div>&nbsp;</div>
<div style="page-break-after: always"><span style="display: none">&nbsp;</span></div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div><img height="333" width="500" alt="" src="/userfiles/emotion-studio.jpg" /></div>
<div>&nbsp;</div>
<div><img height="375" width="500" alt="" src="/userfiles/ikea-spotlight.jpg" /></div>
<div>&nbsp;</div>
<div><img height="333" width="500" alt="" src="/userfiles/leopard-fever.jpg" /></div>
<div>&nbsp;</div>
<div><img height="334" width="500" alt="" src="/userfiles/mac-on-wall.jpg" /></div>
<div>&nbsp;</div>
<div><img height="333" width="500" alt="" src="/userfiles/macpro.jpg" /></div>
<div>&nbsp;</div>
<div><img height="332" width="500" alt="" src="/userfiles/matt.jpg" /></div>
<div>&nbsp;</div>
<div><img height="367" width="500" alt="" src="/userfiles/messy-workplace.jpg" /></div>
<div>&nbsp;</div>
<div><img alt="" src="/userfiles/mike.jpg" /></div>
<div>&nbsp;</div>
<div><img alt="" src="/userfiles/multi-monitor-mahem.jpg" /></div>
<div>&nbsp;</div>
<div><img alt="" src="/userfiles/mydesk.jpg" /></div>
<div>&nbsp;</div>
<div style="page-break-after: always"><span style="display: none">&nbsp;</span></div>
<div>&nbsp;</div>
<div><img height="375" width="501" alt="" src="/userfiles/new-mac-setup.jpg" /></div>
<div>&nbsp;</div>
<div><img height="333" width="500" alt="" src="/userfiles/new-macs-setup.jpg" /></div>
<div>&nbsp;</div>
<div><img alt="" src="/userfiles/nycGRAEME.jpg" /></div>
<div>&nbsp;</div>
<div><img alt="" src="/userfiles/silly.jpg" /></div>
<div>&nbsp;</div>
<div><img height="375" width="500" alt="" src="/userfiles/silly-mac-setup.jpg" /></div>
<div>&nbsp;</div>
<div><img height="334" width="500" alt="" src="/userfiles/stefan-didak.jpg" /></div>
<div>&nbsp;</div>
<div><img height="375" width="500" alt="" src="/userfiles/thelab.jpg" /></div>
<div>&nbsp;</div>
<div><img height="332" width="500" alt="" src="/userfiles/turatboy.jpg" /></div>
<div>&nbsp;</div>
<div><img alt="" src="/userfiles/ultimate-mac-setup.jpg" /></div>
<div>&nbsp;</div>]]></description>
</item>
<item>
<title><![CDATA[用户界面设计师]]></title>
<author>longcheer</author><pubDate>Tue, 16 Dec 2008 10:35:23 GMT</pubDate>
<link>http://www.uichannel.com/Job/Detail.aspx?ID=100</link> 
<description><![CDATA[<div>工作职责：<br />
1、进行视觉用户界面设计；<br />
2、制定用户界面规格书及归档项目文件；<br />
3、进行软件图片资源维护，协助交互设计师完成交互功能设计；<br />
4、界面设计讯息调查，研究。</div>
<div>&nbsp;</div>
<div>任职要求：<br />
1、平面设计，视觉传达设计，工业设计，多媒体设计等艺术类相关专业专科及以上学历；<br />
2、1年以上手机行业界面设计经验，或2年以上视觉传达设计经验；<br />
3、熟悉产品开发流程，具有一定的客户引导、用户研究、原型设计、可用性测试和评估技能；<br />
4、良好的美术基础和色彩感觉；具备团队合作能力；<br />
5、身心健康，诚实正直。</div>
<div>请附上自己的作品</div>
<div>&nbsp;</div>
<div>公司地址：上海市徐汇区漕宝路401号1号楼</div>
<div>公司电话：021-64088898</div>
<div>公司网页：http://www.longcheertel.com</div>
<div>公司邮箱：lct_hr1@longcheertel.com</div>]]></description>
</item>
<item>
<title><![CDATA[工业设计师]]></title>
<author>longcheer</author><pubDate>Tue, 16 Dec 2008 10:30:48 GMT</pubDate>
<link>http://www.uichannel.com/Job/Detail.aspx?ID=99</link> 
<description><![CDATA[<div>工作职责：<br />
1、参与产品研发项目小组，根据研发项目计划，实施工业设计工作；<br />
2、参与产品销售饿工业设计技术支持；<br />
3、搜集手机行业市场的工业设计讯息，协助部门主管进行产品改进；<br />
4、搜集手机行业内的材料工艺讯息，协助部门主管进行产品材料进行改进和控制<br />
5、参与整机生产中产品工艺监管、控制，为客户提供工艺技术支持。</div>
<div>&nbsp;</div>
<div>任职要求：<br />
1、工业设计专业本科以上学历，25-30岁；<br />
2、英语四级以上，精通相关计算机软件；<br />
3、从事相关手机设计工作1年以上工作经验，熟悉三维绘图软件；<br />
4、态度严谨、思维活跃、有创意和创造力、对设计有激情；<br />
5、身心健康、诚实正直。</div>
<div><br />
其它：投递简历时请同时投递个人作品。</div>
<div>&nbsp;</div>
<div>公司地址：上海市徐汇区漕宝路401号1号楼</div>
<div>公司电话：021-64088898</div>
<div>公司网页：http://www.longcheertel.com</div>
<div>公司邮箱：lct_hr1@longcheertel.com</div>
<div>&nbsp;</div>]]></description>
</item>
<item>
<title><![CDATA[设计的小事：设计师魔鬼言论]]></title>
<author>lytous</author><pubDate>Mon, 15 Dec 2008 16:00:59 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=198</link> 
<description><![CDATA[<div>
<p>今天和朋友们在QQ群里聊到关于设计师和客户的问题，索性说了些不成体系的话，文风比较奔放，也不够和谐，大家全当一笑了之，就快过年了，就不这么严肃了。</p>
<p>这应该算整个《设计的小事》系列中，最邪恶的一篇了，罪过罪过。但是我希望这样调侃的交谈可以引起一些讨论和思考，毕竟现在设计的环境和设计师的处境并不太理想，那么，既然要发展，要提高，要赚钱，要进步，我们就应该更清晰的看清目前的局势。</p>
<p>以下为摘录：</p>
<p>&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;-</p>
<p>有人说做网站这玩意，报个20万都天价了，我看未必，得看什么公司接，白菜公司最多叫到2W，你要碰上4A（国际那种），算你倒霉了，30-50万也不算高。设计这东西，没别的，就是花钱，还花得让你心服口服，拍案叫绝。</p>
<p>花不起钱做什么设计啊，回家玩儿去吧！推广运营那些东西都是扯蛋的，人家都做这么多年了，搞个奥美，麦肯的方案直接上岗，钱到位了，什么推广不起来。广告界有句行话：&ldquo;投下去的钱先没一半，另外一半再看效果。&rdquo;<br />
那些没钱的客户，你就好好踏实的做产品，做用户体验，等产品有口碑了，公司有起色了一切水到渠成，别有事没事就想推广，想运营，你有那资本么，你就算有那资本，你的产品够格么？产品不好，再推也就是个电视购物频道的货色，天天雇两小妞等着离退休大妈们打电话进来&ldquo;限时抢购&rdquo;。</p>
<p>作为设计师你说只接1000元左右的单是不对的，你这样接单，啥时候买房？买车？养老婆？生孩子？艺术理想在现实生活前面都那么不堪一击。我就觉得只能做大客户，现在人心险恶，有些打着客户旗号过来和你套近乎，说不定也是个二道贩子。</p>
<p>小客户也不省心，要求还多，一个破标志能耗上你2个月，改上20个方案，他还不满意，其实他懂标志么？他就一瞎比较！</p>
<p>你去商场看看，有钱人都是看准品牌放钱拿货走人，没钱的都在花车那儿瞎转悠，你说80，他说昨天买的80的两件，气都能把你气死！要做设计师就要做品牌，不要做花车！不是金刚钻不揽瓷器活，要不没别的，就是水平不够，自己再修炼。</p>
<p>我就做我能做的客户，看得起我，我也看得起他的，小客户我都不加QQ，太大的客户我就直接说我做不了，你要我介绍高手可以。</p>
<p>要想好好做单，就先学好英语，学好英语和国外客户打过几次交道，你就知道设计行业多黑暗！相比来说国内的客户还是比较可爱的，设计、美工、傻傻分不清楚。设计到最后就是消费心理学+艺术销售，视觉哪点玩意儿没用。</p>
<p>要好好上班也行，找个好平台，英语学好了，技术跟进着，熬到公司里面的人辞职的辞职，开除的开除，你就是老大！别指望你好好做就能出头，你上面那家伙不死，你怎么上去？所以在公司混最有效的方法，就是帮助你老大赶快升职！他走了肯定记着你，聚贤不避亲，中国人办事就靠个关系。</p>
<p>（适可而止，就发到这里吧！）-_-~~~~</p>
</div>]]></description>
</item>
<item>
<title><![CDATA[FontShop 100种最受欢迎的英文字体介绍]]></title>
<author>7steven</author><pubDate>Mon, 15 Dec 2008 10:13:40 GMT</pubDate>
<link>http://www.uichannel.com/Tutor/Detail.aspx?ID=65</link> 
<description><![CDATA[<div>&nbsp;<span class="Apple-style-span" style="color: rgb(102, 102, 102); line-height: 15px; white-space: pre; ">FontShop 100种最受欢迎的英文字体介绍</span></div>
<div>&nbsp;</div>
<div>&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;囊括了近百年来所有受欢迎的英文字体的具体常识，各位可以深刻的了解到这</div>
<div>些著名字体的发展，演变。</div>
<div>&nbsp;</div>
<div>&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;德文杂志</div>
<div>&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;</div>
<div>&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;32页</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div>&nbsp;</div>]]></description>
</item>
<item>
<title><![CDATA[招聘手机GUI设计师]]></title>
<author>xuhero</author><pubDate>Thu, 11 Dec 2008 18:42:00 GMT</pubDate>
<link>http://www.uichannel.com/Job/Detail.aspx?ID=98</link> 
<description><![CDATA[<div>职位描述：</div>
<div>1.根据产品定义相对应的用户界面风格，设计图标，完成界面的设计。<br />
2.根据UI SPEC的规范设计用户界面。<br />
3.制定开发工程师能使用的界面规格书。<br />
4.调研手机流行趋势，参与产品功能定制与原有方案的改良。</div>
<div>职位要求：<br />
1.熟练使用矢量与位图设计软件(如 CD PS AI等) <br />
2.拥有良好的美感，对数码对通讯产品有一定的理解。<br />
3.对手机与操作系统的设计有热情,积极配合团队工作.<br />
4.工作经验1年以上<br />
5.性别不限<br />
薪酬：面议<br />
其他福利：4金+补贴+奖金<br />
工作地点：上海漕河泾</div>
<div><br />
发简历请附近期作品<br />
<a href="mailto:chichengdong@mospec-sh.com">chichengdong@mospec-sh.com</a><br />
不要超过5MB</div>
<div><br />
公司简介<br />
上海移景通信技术有限公司是一家专业从事手机方案研发领域的通信公司,公司队伍小巧精干，工作气愤自由融洽。<br />
公司本着平等,开放,尊重每个员工,回报每个员工为原则,实现个人充分发展。我们热诚期待您的加盟！</div>
<div>联系方式<br />
地址：上海市宜山路1618号E幢803室<br />
联系人：迟先生<br />
TEL： +86 21 51082052<br />
MOB：+86 13501908311<br />
&nbsp;</div>]]></description>
</item>
<item>
<title><![CDATA[交互设计师]]></title>
<author>rubysu</author><pubDate>Thu, 11 Dec 2008 17:21:34 GMT</pubDate>
<link>http://www.uichannel.com/Job/Detail.aspx?ID=97</link> 
<description><![CDATA[<div><b>职位描述：<br />
</b>1.设计、实现网站产品的用户接口，保证产品的可用性 <br />
2.对网站的各种产品进行可用性分析及用户研究，出具分析报告，以改进产品的用户体验 <br />
3.根据用户需求分析的结果进行产品的交互设计，并对产品各阶段交互原型进行评测</div>
<div><b>职位要求： <br />
</b>1.熟悉网站产品开发过程，良好的口头与书面表达能力，有与产品，技术合作开发产品/项目经验者优先<br />
2.熟练运用深入访谈，卡片分类，现场研究等多种用户研究方法，并能整理出相关的产品需求文档<br />
3.熟悉角色，故事版，线框图等交互设计方法，有交互设计经验的优先考虑<br />
4.熟悉启发式原则评估，认识走查等可用性测试方法<br />
5.基本的手绘与审美能力，有美术基础优先考虑<br />
6.熟悉Photoshop，Dreamweaver等绘图及网页编写软件<br />
7.了解网站前端技术，对HTML/XHTML，CSS有经验者有限</div>
<div>&nbsp;</div>
<div>你好，我是猎头公司的Ruby，目前在帮一家知名互联网公司招聘职位。希望最近有兴趣的朋友尽快和我联系。&nbsp; &nbsp; <br />
QQ:178198464&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;MSN:ruby.sjl@hotmail.com<br />
当然哪怕目前没有兴趣的也希望和我联系，毕竟我这里还是有瞒多互联网的机会，大家交个朋友，互相交流讯息。</div>
<div>&nbsp;</div>]]></description>
</item>
<item>
<title><![CDATA[2008年12月UCD深圳书友会通知]]></title>
<author>UIChannel</author><pubDate>Mon, 08 Dec 2008 16:47:37 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=197</link> 
<description><![CDATA[<div>2008年最后一场UCD书友会将在深圳 南山开办，请各位书友会的朋友届时光临。</div>
<div>
<p>1、聚会<br />
时间：12月21日 下午 14：30 开始。<br />
形式：话题讨论+自由聊天。<br />
费用：书友会无需报名和缴费，但如果有后续腐败活动，费用AA。<br />
成果：请看<a href="http://ucdchina.com/" target="_blank">UCD大社区</a>的&ldquo;讨论话题&rdquo;</p>
<p>2、目前同时举办书友会的城市：广州、成都、杭州、北京、上海、南京。<br />
其他地区的朋友如果有兴趣可以和UCDChina联系，欢迎在当地组织书友会，UCDChina会尽可能的给出支持。</p>
<p>深圳地区联系人： 周陟(lytous)&nbsp;&nbsp;</p>
<p>邮件：<a href="mailto:lytous@gmail.com">lytous@gmail.com</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; QQ：&nbsp;384713&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; MSN： <a href="mailto:lytous@hotmail.com">lytous@hotmail.com</a></p>
<p>3、借阅：<br />
书友会现场取，本月借书下月现场归还。<br />
视所借书籍收取一定押金，还书时全额退回，逾期一月扣10元。连续四月不还，直接扣完。</p>
</div>
<div>本次书友会话题：<b> </b><span style="color: #0000ff"><b>留言与评论</b></span></div>
<div>&nbsp;</div>
<div>形式：<span> PPT演讲，话题讨论，现场研究与设计实践</span></div>
<div>&nbsp;</div>
<div>地址： <span style="font-size: 14pt; color: #3c4ed6"><strong>深圳问道旅行馆南山店</strong></span><span style="color: #3c4ed6"><strong>（</strong></span><span style="color: #3c4ed6">深圳市南山区海德一道观海台东北角一层</span><span lang="EN-US" style="color: #3c4ed6; font-family: Verdana">C09</span><span style="color: #3c4ed6">铺）</span></div>
<div>&nbsp;</div>
<div><span style="color: #3c4ed6"><img alt="" src="/userfiles/map.jpg" /></span></div>]]></description>
</item>
<item>
<title><![CDATA[《DON’T MAKE ME THINK》摘记]]></title>
<author>schiy</author><pubDate>Mon, 08 Dec 2008 15:30:46 GMT</pubDate>
<link>http://www.uichannel.com/Industry/Detail.aspx?ID=196</link> 
<description><![CDATA[<div>
<p>八月份<a id="l.hp" title="对《用户体验的要素》一书做了摘记" href="http://schiy.com/archives/286" target="_blank">对《用户体验的要素》一书做了摘记</a> ，这次看了两遍《DON&rsquo;T MAKE ME THINK》，也做了个摘记，方式跟上次一样，做一些简要的选择性的摘录并添加一些个人注释。</p>
<p>以下内容中的<span style="color: rgb(255, 0, 0);">红色文字</span>为本人注释，其它均为原文。<br />
_____________________________________________________________________</p>
<p>Krug可用性定律：</p>
<ol>
    <li>别让我思考</li>
    <li>点击多少次都没关系，只要每次点击都是无须思考、明确无误的选择。</li>
    <li>去掉每个页面上一半的文字，然后把剩下的文字再去掉一半。</li>
</ol>
<p>当我们访问Web的时候，每个问号都会加重我们的认知负担，把我们的注意力从要完成的任务上拉开。这种干扰也许很轻微，但它们会累积起来，有时候这样的干扰不用太多，就足以让我们抓狂。</p>
<p>为什么不要让用户思考的重要理由是，大多数人会花比我们想象中少得多的时间来浏览网页。</p>
<p>我们不是阅读，而是扫描。我们为什么扫描？</p>
<ul>
    <li>我们总是处于忙碌之中。</li>
    <li>我们知道自己不必阅读所以内容。</li>
    <li>我们善于扫描。</li>
</ul>
<p>我们不作最佳选择，而是满意即可。</p>
<p>我们不是追根究底，而是勉强应付。<br />
<span style="color: rgb(255, 0, 0);">【在我们身边可以看到太多例子，乐乐妈就习惯在Google的搜索框内输入taobao，然后再点击链接到淘宝。我曾告诉她，直接在浏览器的地址栏输入taobao就可以了，但她还是乐此不疲^_^】</span></p>
<p>保证用户尽可能看到并理解你的网站：</p>
<ul>
    <li>在每个页面上建立清楚的视觉层次。</li>
    <li>尽量利用习惯用法。</li>
    <li>把页面划分成明确定义的区域。</li>
    <li>明显标示可以点击的地方。</li>
    <li>最大限度降低干扰。</li>
</ul>
<p>如果我们需要一直在网络上进行选择，那么让这些选择变得无须思考是让一个网站容易使用的主要因素。<br />
<span style="color: rgb(255, 0, 0);">【请别让用户花时间来思考和判断。】</span></p>
<p>如果在网站上找不到方向，人们不会使用你的网站。<br />
<span style="color: rgb(255, 0, 0);">【Krug举的例子很恰当。其实这和我们在生活中购物类似，如果你家附近有两个超市，超市A可以让你很容易找到你要购买的东西，而另超市B却不是这样，那么我想你应该会很高兴的在超市A内Shopping吧^_^】</span></p>
<p>关于测试的几个事实：</p>
<ul>
    <li>如果想建立一个优秀的网站，一定要测试。</li>
    <li>测试一个用户比不做测试好一倍。</li>
    <li>在项目中，早点测试一位用户好过最后测试50位用户。</li>
</ul>
<p><span style="color: rgb(255, 0, 0);">【Krug在书中提供的测试方法很有用，启发很大^_^】</span></p>
<p>降低好感的几种方式：</p>
<ul>
    <li>隐藏我想要的信息。</li>
    <li>因为没有按照你们的方式行事而惩罚我。</li>
    <li>向我询问不必要的信息。</li>
    <li>敷衍我，欺骗我。</li>
    <li>给我设置障碍。</li>
    <li>你的网站看上去不专业。</li>
</ul>
<p>提高好感的几种方式：</p>
<ul>
    <li>知道人们在你网站上想做什么，并让它们明白简易。</li>
    <li>告诉我我想知道的。</li>
    <li>尽量减少步骤。</li>
    <li>花点心思。</li>
    <li>知道我可能有哪些疑问，并且给予解答。</li>
    <li>为我提供协助，例如打印友好页面。</li>
    <li>容易从错误中恢复。</li>
    <li>如有不确定，记得道歉。</li>
</ul>
<p>要求太多个人数据的危险：</p>
<ul>
    <li>您常常无法得到真实的数据。</li>
    <li>您得到的完整表单更少。</li>
    <li>使您的网站形象下降。</li>
</ul>
<p><span style="color: rgb(255, 0, 0);">【和注册一样，你一定喜欢简单易用的表单吧？通常，对于注册表单来说一个邮箱地址和一个密码就够了。当然你可以加上重复密码、验证码&hellip;&hellip;但别太多！】</span></p>
<p>您可以按照您的想法去做以便让网站有好的外观，但是要保证这样做不会妨碍网站的正常运行。而且，大部分的花哨招数只会妨碍网站正常运行。<br />
<span style="color: rgb(255, 0, 0);">【别忘了还有很多人在使用糟糕的网络环境。】</span></p>
</div>]]></description>
</item>
<item>
<title><![CDATA[2008年国外50个最佳CSS设计欣赏]]></title>
<author>skar9363</author><pubDate>Sun, 07 Dec 2008 11:49:29 GMT</pubDate>
<link>http://www.uichannel.com/Tutor/Detail.aspx?ID=64</link> 
<description><![CDATA[<div>&nbsp;<span class="Apple-style-span" style="color: rgb(53, 56, 61); font-family: 微软雅黑; line-height: 17px; "><span class="Apple-style-span" style="color: rgb(0, 0, 0); font-size: 14px; line-height: 20px; ">　　今天，暴风彬彬将向大家推荐50个2008年的最佳CSS网站设计，这50个CSS网站是由WebDesignerWall评选出来的，很具参考价值。我们在欣赏的同时，也能从中吸取很多灵感，也能从它们的源代码中学习更高级的CSS技术。今年，越来越多的设计师开始使用超大的背景图片技术和一些JavaScript框架（如jQuery及MooTools）来提高用户体验。还有一些设计师将Flash和CSS混合使用。也许我们能从中发现2009年的新网页设计趋势？</span>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><strong><span style="color: rgb(255, 102, 0); "><span class="Apple-style-span" style="font-family: Verdana; font-size: 13px; line-height: 23px; ">译者注:</span>您还可以参考以下CSS相关资源:</span></strong></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">《<a title="精选15个国外CSS框架" rel="bookmark" href="http://blog.bingo929.com/css-frameworks-15.html" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">精选15个国外CSS框架</a>》<br />
《<a title="推荐20个让你学习并精通CSS的网站" href="http://blog.bingo929.com/20-websites-learn-css.html" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">推荐20个让你学习并精通CSS的网站</a>》<br />
《<a title="20+漂亮的网站分类存档设计赏析(下)" href="http://blog.bingo929.com/beautiful-web-site-archives-pt2.html" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">20+漂亮的网站分类存档设计赏析(下)</a>》<br />
《<a title="20+漂亮的网站分类存档设计赏析(上)" href="http://blog.bingo929.com/beautiful-web-site-archives-pt1.html" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">20+漂亮的网站分类存档设计赏析(上)</a>》<br />
《<a title="推荐80个使用超大背景图片的网站设计" href="http://blog.bingo929.com/80-large-background-websites.html" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">推荐80个使用超大背景图片的网站设计</a>》&nbsp;</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.letitbleedbook.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Let It Bleed</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">巨大而醒目的图片使得这个网站鹤立鸡群。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/letitbleedbook-lg.jpg" alt="2009-网页设计-趋势" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.vermontcoffeeworks.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Vermont Coffee Works</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">很好的混合使用了Flash和CSS。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/vermontcoffeeworks.jpg" alt="css-欣赏" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://digitalmash.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Digital Mash</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/digitalmash.jpg" alt="2008-css-网站" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.good.is/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Good</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">很好的视觉和内容聚焦设计。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/good.jpg" alt="css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.wilsonminer.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Wilson Miner</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/wilsonminer.jpg" alt="css-设计" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://radiantplumbing.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">DrupalCon, DC</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/drupalcon.jpg" alt="外国-css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://events.carsonified.com/fowa/2009/miami" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Future of Web Apps - Miami 2009</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">完美的将超大字体与破旧风格效果混合在了一起。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/fowa.jpg" alt="css-欣赏" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.housingworks.org/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Housing Works</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">在首页使用了很漂亮的超大背景图。<a href="http://blog.bingo929.com/80-large-background-websites.html" target="_blank" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">超大背景的网页设计</a>最近比较热门。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/housingworks.jpg" alt="2008-css-网站" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.sarahhyland.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Future of Web Design - NYC 2008</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">另一个<a href="http://blog.bingo929.com/80-large-background-websites.html" target="_blank" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">超大背景图设计</a>的实例。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/futureofwebdesign.jpg" alt="css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://fall.tnvacation.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Tennessee - Fall</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">我不得不承认，Tennessee的网站的确是一个相当棒的系列设计&mdash;&mdash;秋天、春天、夏天和冬天。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/tnvacation.jpg" alt="css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://spring.tnvacation.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Tennessee - Spring</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/tennessee.jpg" alt="css-设计" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://summer.tnvacation.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Tennessee - Summer</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/summer.jpg" alt="外国-css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://winter.tnvacation.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Tennessee - Winter</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/winter.jpg" alt="css-欣赏" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.fiveruns.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Five Runs</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/fiveruns.jpg" alt="2008-css-网站" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.branded07.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Branded07</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/branded07.jpg" alt="css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://cappuccino.org/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Cappuccino</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">具有非常好的可用性的且很有组织性的网站。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/cappuccino.jpg" alt="css-设计" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.speaklight.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">LightCMS</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">LightCMS公司的一些铅笔/速写效果，网站上仍然能体现他们公司的感觉。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/speaklight.jpg" alt="外国-css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://thefirsttwenty.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">The First Twenty</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">非常漂亮的<a href="http://www.webdesignerwall.com/trends/single-page-portfolio-sites/" target="_blank" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">单页</a>设计。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/thefirsttwenty.jpg" alt="css-欣赏" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://youlove.us/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">YouLove.Us</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">非常完美的使用<a href="http://blog.bingo929.com/category/technology/css" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">CSS</a>和JavaScript(jQuery)</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/youlove.jpg" alt="2008-css-网站" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://lukelarsen.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Luke Larsen</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">Luke Larsen的水族馆主题很好的证明如何使用好jQuery的<a href="http://plugins.jquery.com/project/ScrollTo" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">Scrollto 插件</a>.</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/lukelarsen.jpg" alt="css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://designdisease.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Design Disease</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">波浪和各种圆形让这个网站变得很生动有趣。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/designdisease.jpg" alt="css-设计" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://adaptd.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Adaptd</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">虽然设计风格让我想起了<a href="http://iso50.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">ISO50</a>&nbsp;(Scott Hansen)，但它仍然值得推荐。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/adaptd.jpg" alt="外国-css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://jasonsantamaria.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Jason Santa Maria</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/jasonsantamaria.jpg" alt="css-欣赏" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.electricurrent.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Electricurrent</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">这个网站证明了如何使用超大背景图片来展现摄影作品。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/electricurrent.jpg" alt="2008-css-网站" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://training.collectiveidea.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Training by Collective Idea</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/collectiveidea.jpg" alt="css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://macallanridge.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">MacAllan Ridge</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">很好的视觉设计，简单的导航！棒极了！</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/macallanridge.jpg" alt="css-设计" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.pikaboo.be/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Pikaboo</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">组合了CSS、<a href="http://blog.bingo929.com/category/technology/javascript" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: underline; ">JavaScript</a>和Flash的非常酷的设计。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/pikaboo.jpg" alt="外国-css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.mochiads.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Mochi Ads</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/mochiads.jpg" alt="css-欣赏" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.volll.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Volll</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/volll.jpg" alt="2008-css-网站" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.flingmedia.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Fling Media</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/flingmedia.jpg" alt="css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.ewedding.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">eWedding</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/ewedding.jpg" alt="css-设计" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.viget.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Viget</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">Viget很好的在他们的系列博客中保持了他们的品牌形象&mdash;&mdash;Inspire, Advance, Engage, and Extend.</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/viget.jpg" alt="外国-css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.viget.com/extend/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Viget - Inspire</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/vigetInspire.jpg" alt="css-欣赏" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://sprawsm.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Viget - Advance</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/advance.jpg" alt="2008-css-网站" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.viget.com/engage" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Viget - Engage</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/engage.jpg" alt="css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.viget.com/extend/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Viget - Extend</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/extend.jpg" alt="css-设计" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.august.com.au/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">August</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">使用了Flash可扩展背景图片的惊人设计（调整浏览器的尺寸可看到扩展后的背景图）</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/august.jpg" alt="外国-css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://carfreaks.net/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Car Freaks</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">这个博客会经常更换他们的首页背景图片来保持新鲜感。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/carfreaks.jpg" alt="css-欣赏" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://ringvemedia.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Go To China</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">这个一个使用高清晰度照片作为网站背景图的完美实例。在调整浏览器大小后网站的背景图也会随之扩展。（使用<span style="text-decoration: line-through; ">JavaScript</span>&nbsp;CSS实现）</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/ringvemedia.jpg" alt="2008-css-网站" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://jesuschrist.lds.org/SonOfGod/eng/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Jesus Christ</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/jesuschrist.jpg" alt="css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://billyhughes.oph.gov.au/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Billy Hughes</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/billyhughes.jpg" alt="css-设计" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.freepeople.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Free People</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">FreePeople 是我一直很喜欢的设计（喜欢它的拼贴风格）</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/freepeople.jpg" alt="外国-css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.mousetominx.co.uk/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Mouse to Minx</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">复古&hellip;性感&hellip;</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/mousetominx.jpg" alt="css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.darasgarden.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Dara&rsquo;s Garden</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/darasgarden.jpg" alt="css-设计" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.designspongeonline.com/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Design Sponge</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">剪贴薄设计风格与网站的内容很好的结合。</p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/designspongeonline.jpg" alt="外国-css-实例" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://ma.tt/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">Ma.tt</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/matt.jpg" alt="css-欣赏" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(211, 211, 211); border-right-color: rgb(211, 211, 211); border-bottom-color: rgb(211, 211, 211); border-left-color: rgb(211, 211, 211); " /></p>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); ">&nbsp;</p>
<h3 style="font-family: 'Trebuchet MS'; display: block; width: 510px; height: 1.4em; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(228, 228, 228); font: normal normal bold 1.6em/normal 微软雅黑; overflow-x: hidden; overflow-y: hidden; "><a href="http://www.thelippincott.net/" style="color: rgb(0, 160, 227); border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; text-decoration: none; ">The Lippincott</a></h3>
<p style="font-size: 1.2em; line-height: 1.4em; color: rgb(0, 0, 0); "><img src="http://blog.bingo929.com/wp-content/uploads/2008/12/best-css-2008/thelippincott.jpg" alt="2008-css-网站" width="470" height="160" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-width: initial; border-color: initial; text-align: center; padding-top: 3px; padding-