<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	xmlns:georss="http://www.georss.org/georss" xmlns:geo="http://www.w3.org/2003/01/geo/wgs84_pos#" xmlns:media="http://search.yahoo.com/mrss/"
	>

<channel>
	<title>Thinking In Web</title>
	<atom:link href="http://thinkinginweb.wordpress.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://thinkinginweb.wordpress.com</link>
	<description>All Ideas About Web, All News About Internet.</description>
	<lastBuildDate>Tue, 05 May 2009 07:16:56 +0000</lastBuildDate>
	<language>zh-cn</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.com/</generator>
<cloud domain='thinkinginweb.wordpress.com' port='80' path='/?rsscloud=notify' registerProcedure='' protocol='http-post' />
<image>
		<url>http://s2.wp.com/i/buttonw-com.png</url>
		<title>Thinking In Web</title>
		<link>http://thinkinginweb.wordpress.com</link>
	</image>
	<atom:link rel="search" type="application/opensearchdescription+xml" href="http://thinkinginweb.wordpress.com/osd.xml" title="Thinking In Web" />
	<atom:link rel='hub' href='http://thinkinginweb.wordpress.com/?pushpress=hub'/>
		<item>
		<title>Web站点最流行的40个按钮</title>
		<link>http://thinkinginweb.wordpress.com/2009/05/05/web%e7%ab%99%e7%82%b9%e6%9c%80%e6%b5%81%e8%a1%8c%e7%9a%8440%e4%b8%aa%e6%8c%89%e9%92%ae/</link>
		<comments>http://thinkinginweb.wordpress.com/2009/05/05/web%e7%ab%99%e7%82%b9%e6%9c%80%e6%b5%81%e8%a1%8c%e7%9a%8440%e4%b8%aa%e6%8c%89%e9%92%ae/#comments</comments>
		<pubDate>Tue, 05 May 2009 03:58:00 +0000</pubDate>
		<dc:creator>Echo Chen</dc:creator>
				<category><![CDATA[理念]]></category>
		<category><![CDATA[按钮]]></category>

		<guid isPermaLink="false">http://thinkinginweb.wordpress.com/2009/05/05/web%e7%ab%99%e7%82%b9%e6%9c%80%e6%b5%81%e8%a1%8c%e7%9a%8440%e4%b8%aa%e6%8c%89%e9%92%ae/</guid>
		<description><![CDATA[在web站点设计中，离不开按钮，所以必须考虑每个细节，虽然它不能引起人们的注意，但是，精心设计出来的按钮，可以在很大程度上引起网站整体上的改观，增加亮点。我们这里收集了40个最流行、也是最有创意的按钮。 GoodBarry Your Web Job Aviary Pixel Crayons Icon Dock The Invoice Machine OH! Media Games for Her by You Lifetree Creative FreebiesDock Checkout Gary Nock Matt Dempsey Transmissions Tutorial9 OfficeVP Aptana Valley Creek Church Codebase Onehub SEO Group Wapple Business Catalyst Tao Effect Heart Internet Zidalgo W3 Markup Apple Chromatic Spinen Wake Interactive DevHub [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=thinkinginweb.wordpress.com&amp;blog=7235426&amp;post=55&amp;subd=thinkinginweb&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://thinkinginweb.wordpress.com/2009/05/05/web%e7%ab%99%e7%82%b9%e6%9c%80%e6%b5%81%e8%a1%8c%e7%9a%8440%e4%b8%aa%e6%8c%89%e9%92%ae/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/cb0e520fa538bbeb92dd1397f1e9b0f0?s=96&#38;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&#38;r=G" medium="image">
			<media:title type="html">qdechochen</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image001.jpg" medium="image">
			<media:title type="html">clip_image001</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image002.jpg" medium="image">
			<media:title type="html">clip_image002</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image003.jpg" medium="image">
			<media:title type="html">clip_image003</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image004.jpg" medium="image">
			<media:title type="html">clip_image004</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image005.jpg" medium="image">
			<media:title type="html">clip_image005</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image006.jpg" medium="image">
			<media:title type="html">clip_image006</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image007.jpg" medium="image">
			<media:title type="html">clip_image007</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image008.jpg" medium="image">
			<media:title type="html">clip_image008</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image009.jpg" medium="image">
			<media:title type="html">clip_image009</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image010.jpg" medium="image">
			<media:title type="html">clip_image010</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image011.jpg" medium="image">
			<media:title type="html">clip_image011</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image012.jpg" medium="image">
			<media:title type="html">clip_image012</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image013.jpg" medium="image">
			<media:title type="html">clip_image013</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image014.jpg" medium="image">
			<media:title type="html">clip_image014</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image015.jpg" medium="image">
			<media:title type="html">clip_image015</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image016.jpg" medium="image">
			<media:title type="html">clip_image016</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image017.jpg" medium="image">
			<media:title type="html">clip_image017</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image018.jpg" medium="image">
			<media:title type="html">clip_image018</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image019.jpg" medium="image">
			<media:title type="html">clip_image019</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image020.jpg" medium="image">
			<media:title type="html">clip_image020</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image021.jpg" medium="image">
			<media:title type="html">clip_image021</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image022.jpg" medium="image">
			<media:title type="html">clip_image022</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image023.jpg" medium="image">
			<media:title type="html">clip_image023</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image024.jpg" medium="image">
			<media:title type="html">clip_image024</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image025.jpg" medium="image">
			<media:title type="html">clip_image025</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image026.jpg" medium="image">
			<media:title type="html">clip_image026</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image027.jpg" medium="image">
			<media:title type="html">clip_image027</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image028.jpg" medium="image">
			<media:title type="html">clip_image028</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image029.jpg" medium="image">
			<media:title type="html">clip_image029</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image030.jpg" medium="image">
			<media:title type="html">clip_image030</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image031.jpg" medium="image">
			<media:title type="html">clip_image031</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image032.jpg" medium="image">
			<media:title type="html">clip_image032</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image033.jpg" medium="image">
			<media:title type="html">clip_image033</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image034.jpg" medium="image">
			<media:title type="html">clip_image034</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image035.jpg" medium="image">
			<media:title type="html">clip_image035</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image036.jpg" medium="image">
			<media:title type="html">clip_image036</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image037.jpg" medium="image">
			<media:title type="html">clip_image037</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image038.jpg" medium="image">
			<media:title type="html">clip_image038</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image039.jpg" medium="image">
			<media:title type="html">clip_image039</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/05/clip-image040.jpg" medium="image">
			<media:title type="html">clip_image040</media:title>
		</media:content>
	</item>
		<item>
		<title>IE6 死后即将大快人心的10件事</title>
		<link>http://thinkinginweb.wordpress.com/2009/04/18/ie6-%e6%ad%bb%e5%90%8e%e5%8d%b3%e5%b0%86%e5%a4%a7%e5%bf%ab%e4%ba%ba%e5%bf%83%e7%9a%8410%e4%bb%b6%e4%ba%8b/</link>
		<comments>http://thinkinginweb.wordpress.com/2009/04/18/ie6-%e6%ad%bb%e5%90%8e%e5%8d%b3%e5%b0%86%e5%a4%a7%e5%bf%ab%e4%ba%ba%e5%bf%83%e7%9a%8410%e4%bb%b6%e4%ba%8b/#comments</comments>
		<pubDate>Sat, 18 Apr 2009 10:27:00 +0000</pubDate>
		<dc:creator>Echo Chen</dc:creator>
				<category><![CDATA[浏览器]]></category>
		<category><![CDATA[IE6]]></category>

		<guid isPermaLink="false">http://thinkinginweb.wordpress.com/2009/04/18/ie6-%e6%ad%bb%e5%90%8e%e5%8d%b3%e5%b0%86%e5%a4%a7%e5%bf%ab%e4%ba%ba%e5%bf%83%e7%9a%8410%e4%bb%b6%e4%ba%8b/</guid>
		<description><![CDATA[&#160; (http://www.kooxo.com/uploads/a&#8230;) 链接快照 很多人以为IE6已经死了，也许只有设计师这样认为，现实世界中IE6的使用者大有人在，不过不会维持很久，IE8已经推出，微软对IE8的推广不遗余力，同时，不少人从IE转到别的浏览器，总有一天，IE6会被弃之如敝履，没有人愿意再提起，那时，有10件事会大快人心。 使用 CSS 2&#160; 的 child 选择器 不必再写一大堆规则在某个对象的子对象中筛选，CSS2 的子选择器（child selectors）可以选择某个对象下直接的子对象。 放心使用 24 位 PNG 图片（透明不再是问题） 不必象以前那样在不同背景方案下设计不同的图片边缘反锯齿方案，使用 PNG 的&#160; Alpha 通道，我们可以用图片实现阴影，眩光以及透明效果。 使用属性选择器 不必再写类似 &#60;input class=&#34;text&#34; /&#62; 一类的代码，告诉浏览器当前输入框使用什么式样类，CSS2可以直接选择 HTML 对象的属性，如 input[type=&#34;text&#34;]，我们甚至可以使用 CSS3 的子字符串匹配属性选择器，匹配我们希望选取的对象，可以在那些使用类似 CSS 类的地方大大减少代码量。 可以使用更多 display 类型 可以使用类似 display:inline-block 的代码，这样就不会再出现嵌套的 float:left 一类的混乱，也不必再举棋不定地使用 overflow:hidden 一类的定义。（不过要等到 Firefox 3&#160; 出来） 使用 min-width 和 max-width 尽管 IE6 [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=thinkinginweb.wordpress.com&amp;blog=7235426&amp;post=14&amp;subd=thinkinginweb&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://thinkinginweb.wordpress.com/2009/04/18/ie6-%e6%ad%bb%e5%90%8e%e5%8d%b3%e5%b0%86%e5%a4%a7%e5%bf%ab%e4%ba%ba%e5%bf%83%e7%9a%8410%e4%bb%b6%e4%ba%8b/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/cb0e520fa538bbeb92dd1397f1e9b0f0?s=96&#38;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&#38;r=G" medium="image">
			<media:title type="html">qdechochen</media:title>
		</media:content>

		<media:content url="http://www.aoaod.com/FileManage/images/20094188493123716.jpg" medium="image" />
	</item>
		<item>
		<title>分析：微软或将称霸 Web 3.0</title>
		<link>http://thinkinginweb.wordpress.com/2009/04/11/%e5%88%86%e6%9e%90%ef%bc%9a%e5%be%ae%e8%bd%af%e6%88%96%e5%b0%86%e7%a7%b0%e9%9c%b8-web-30/</link>
		<comments>http://thinkinginweb.wordpress.com/2009/04/11/%e5%88%86%e6%9e%90%ef%bc%9a%e5%be%ae%e8%bd%af%e6%88%96%e5%b0%86%e7%a7%b0%e9%9c%b8-web-30/#comments</comments>
		<pubDate>Sat, 11 Apr 2009 16:33:00 +0000</pubDate>
		<dc:creator>Echo Chen</dc:creator>
				<category><![CDATA[理念]]></category>
		<category><![CDATA[Web3.0]]></category>
		<category><![CDATA[微软，Web3.0]]></category>

		<guid isPermaLink="false">http://thinkinginweb.wordpress.com/2009/04/11/%e5%88%86%e6%9e%90%ef%bc%9a%e5%be%ae%e8%bd%af%e6%88%96%e5%b0%86%e7%a7%b0%e9%9c%b8-web-30/</guid>
		<description><![CDATA[当MSN不只是一款IM软件，当Hotmail不再是“鸡肋”邮箱，当google API重视企业客户和更针对程序员时，Microsoft用最通俗易懂的方式征服了全世界的网民——不需要懂技术，不需要明白什么是“云计算”，只需要拥有MSN注册ID。 或许Microsoft真的将称霸Web3.0时代，而且，无人能及。 最近Microsoft的频繁动作带给大家一个又一个惊喜，一向被认为不重视互联网的Microsoft一系列产品的推出，让众人大跌眼镜。 先是IE8的推出。自从Windows捆绑了IE浏览器后，这个武器微软打败了众多的竞争对手，成为世界上使用人群最为广泛的网页浏览器。据网站监测机构Net Applications公布的数据显示，目前，微软Internet Explorer浏览器用户群覆盖全球3/4的互联网用户，远超过市场占有率17%的Firefox，和市场占有率6%的苹果Safari浏览器。同时有调查数据显示，人们使用互联网频率最高的工具就是IE，甚至占到了人们总上网时间的80%！ MS的不思进取这里就不说了（IE7五年才推出，而IE8目前还只是测试阶段）。由于IE8目前确实不是很好用，Sonia只是简单的体验了一下就删除了。其中最大的一个感觉是IE8对于RSS功能的强大支持——不但可以像IE7那样订阅整个网站或者某个网页的RSS源，更可以将网页的某一个板块进行“源订阅”：如果你订阅了某个“源”，那么你可以通过IE8时时查看这个板块的更新情况，尤其是针对买卖产品，这个功能非常实用。而且IE8整合的右键菜单里，还增加了像EBAY这样的C2C平台，让用户的网络体验更加倾向于网络消费。 其二是Live Mesh的华丽登场。Live Mesh主要是以互联网作为个人的数据中心，通过网络将用户存储于电脑、手机或其他电子设备上的个人信息实现同步。通过使用这一技术，用户如果用手机拍摄了一张照片，那么其家中的数字相框将很快同步到这些照片，并显示出来。 Live Mesh的主张是“Connect everything”（将一切连在一起），这不单纯是实现了手机、电脑以及多媒体影音播放设备的完全同步，更让“SHARE”变得简单而方便——人们不需要在费力的去注册许许多多社会网络服务网站，不需要再为了让更多人知道自己而既使用twitter又使用Friendfeed，也不需要复杂的去操作“ 上传”、“分享”等等，他想要展示在互联网上的东西便可以轻松的被一个由亿万个网民所组成的“云”平台所共享。而他想要获得东西也可以从这个平台上轻松的取得（Live Mesh现在已经整合了RSS功能）。 Live Mesh似乎消除了用户端和服务器之间的概念：一个由所有用户组成的平台，互相分享，互相链接，存取资料畅通无阻。不论你在使用机还是在使用PC，甚至不论你是否在互联网上，Live Mesh都可以让你随时和世界同步。 只不过目前的Live Mesh版本只是一个“技术预览版”，初期仅对美国的10000名使用微软视窗系统的用户测试用户。Sonia费劲千辛万苦通过一个MS内部人员想得到一个邀请，结果被告知：Live Mesh已经停止用户测试邀请了… Live Mesh Tech Preview Thank you all for your interest in Dogfooding Live Mesh. We are currently full and will not invite new dogfooders until we have performed more testing on our services [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=thinkinginweb.wordpress.com&amp;blog=7235426&amp;post=13&amp;subd=thinkinginweb&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://thinkinginweb.wordpress.com/2009/04/11/%e5%88%86%e6%9e%90%ef%bc%9a%e5%be%ae%e8%bd%af%e6%88%96%e5%b0%86%e7%a7%b0%e9%9c%b8-web-30/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/cb0e520fa538bbeb92dd1397f1e9b0f0?s=96&#38;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&#38;r=G" medium="image">
			<media:title type="html">qdechochen</media:title>
		</media:content>

		<media:content url="http://myarticle.enet.com.cn/images/2008/0428/1209390871292.jpg" medium="image">
			<media:title type="html">分析：微软或将称霸 Web 3.0</media:title>
		</media:content>

		<media:content url="http://myarticle.enet.com.cn/images/2008/0428/1209390871442.jpg" medium="image">
			<media:title type="html">分析：微软或将称霸 Web 3.0</media:title>
		</media:content>

		<media:content url="http://myarticle.enet.com.cn/images/2008/0428/1209390882801.jpg" medium="image">
			<media:title type="html">分析：微软或将称霸 Web 3.0</media:title>
		</media:content>
	</item>
		<item>
		<title>10大 Web 应用界面技术应用</title>
		<link>http://thinkinginweb.wordpress.com/2009/04/11/10%e5%a4%a7-web-%e5%ba%94%e7%94%a8%e7%95%8c%e9%9d%a2%e6%8a%80%e6%9c%af%e5%ba%94%e7%94%a8/</link>
		<comments>http://thinkinginweb.wordpress.com/2009/04/11/10%e5%a4%a7-web-%e5%ba%94%e7%94%a8%e7%95%8c%e9%9d%a2%e6%8a%80%e6%9c%af%e5%ba%94%e7%94%a8/#comments</comments>
		<pubDate>Sat, 11 Apr 2009 15:49:40 +0000</pubDate>
		<dc:creator>Echo Chen</dc:creator>
				<category><![CDATA[理念]]></category>
		<category><![CDATA[界面]]></category>

		<guid isPermaLink="false">http://thinkinginweb.wordpress.com/2009/04/11/10%e5%a4%a7-web-%e5%ba%94%e7%94%a8%e7%95%8c%e9%9d%a2%e6%8a%80%e6%9c%af%e5%ba%94%e7%94%a8/</guid>
		<description><![CDATA[当今越来越多的应用程序迁移到web平台上。由于没有平台的限制和安装的要求，SAAS的模式看起来非常有吸引力。Web应用程序的界面设计，其核心就是网页设计，但它的重点主要是在功能方面。要超越桌面应用程序， Web应用程序必须提供简单、直观和即时响应的用户界面，让他们的用户花更少的精力和时间去完成事情。 以前，我们并没有注意到web应用程序这个方式，但是现在是时候仔细看看一些实用的技术和设计解决方案，让Web应用更友好更漂亮。本文主要介绍的是在现代Web应用程序中，我们对设计模式以及有效设计解决方案进行大量研究并得到结果的第一部分，您可以在下面找到10个收集到的实用界面设计技术以及在许多成功Web应用程序中得出的最佳做法。 你可以提出进一步的看法，第二部分会尽快出版。你也可以阅读以下相关文章： 5 Useful Coding Solutions For Designers and Developers 10 Useful Techniques To Improve Your User Interface Designs 10 Principles Of Effective Design Five More Principle Of Effective Design Getting Creative With Transparency In Web Design 1、界面元素的需求 在用户界面设计中，简单这个原则是很重要的。在任何时候，你在屏幕上显示越多的控制，您的用户将不得不花费更多的时间去搞清楚如何使用界面。当选择变少时，可用的功能变得更加明显更容易被发现。简化的界面虽然是不容易的，尤其是如果你不想限制应用程序的功能的时候。 当你点击Kontain搜索框的搜索链接时，会出现一个类似于下拉菜单的层。所以，如果您需要来缩小搜索范围，您可以选择菜单中你所需要的类型。这些选项的聚合简化了搜索框。 隐藏或者掩盖高级功能是使事情更加简单的一种方法。找出最常用的功能，并且把剩下的藏起来。你可以用弹出式菜单和操作来做这件事，这在桌面软件中很常见。例如，如果您的搜索栏拥有高级过滤器，把它们放在尾部的一个特别的下拉菜单中。如果用户需要使用这些过滤器，他们只需几下点击便可以开启这些功能。决定该保留什么隐藏什么不是一个简单的任务，也会取决于重要性和操作时的频繁程度。 当你点击CollabFinder的搜索链接时你不需要打开不同的页面，相反，搜索框的控制菜单下拉下来，允许你能够直接开始搜索。 2、专门操作 根据情况选择合适的界面控件是很重要的。不同情况下可以用不同的方式处理，而且某些控件会比其他控件能够更好地完成他们的目标工作。 Backpack里有一个紧凑的日历和时间选择器选择提醒日期。 例如，你可以通过一个下拉列表来选择年月日，但是和日历选择器相比下拉列表不是非常高效的，在日历里你可以直接通过点击选择你想要的某一天。日历选择器也会让你更容易看到日期、周期和月份（特别是工作日和休息日），因此能够让你比用简单的下拉列表更快地做出更明智的选择。 MyBankTracker的APY计算器功能，通过使用容易控制的滑块去快速尝试不同的推测结果。 另一个很好的例子是滑块。是的，您可以随时手动输入一个数字，但某些情况下，滑块控件做了更好的工作。不仅由于他们易于使用 —— 只需单击并拖动——而且你也可以看清楚如何在最小和最大的范围之间进行合适地选择。 3、禁用按下按钮 在web应用程序的表单问题中有一个就是提交过程，非常简单的表单，如果你快速地点击两次或者更多次“提交”按钮，这个表单会被多次提交。这显示是个问题，因为它会重复创建相同的项目。防止重复提交的不是很难，而且对于大多数Web应用程序来说做到这一点是非常必要的。 它有两层维护：客户端和服务器端。我们不会通过服务器端维护是因为这将取决于您使用的编程语言和你的后端架构。基本上你应该做的就是在提交过程中添加一个检测机制，去检查被提交的内容是否重复，并且是否需要阻止提交。 [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=thinkinginweb.wordpress.com&amp;blog=7235426&amp;post=12&amp;subd=thinkinginweb&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://thinkinginweb.wordpress.com/2009/04/11/10%e5%a4%a7-web-%e5%ba%94%e7%94%a8%e7%95%8c%e9%9d%a2%e6%8a%80%e6%9c%af%e5%ba%94%e7%94%a8/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/cb0e520fa538bbeb92dd1397f1e9b0f0?s=96&#38;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&#38;r=G" medium="image">
			<media:title type="html">qdechochen</media:title>
		</media:content>

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/000959k33.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001000msy.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001001bsv.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001001Vyf.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001002T2F.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001002tUh.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/0010028fK.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001003XDD.gif" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/0010037Cw.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/0010033jU.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/0010044eM.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001004Ejt.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001004uCF.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001004NcQ.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001005msY.png" medium="image" />

		<media:content url="http://www.bbon.cn/wp-content/uploads/2009/03/001006EHk.png" medium="image" />
	</item>
		<item>
		<title>Internet Explorer 浏览器的历史发展</title>
		<link>http://thinkinginweb.wordpress.com/2009/04/08/internet-explorer-%e6%b5%8f%e8%a7%88%e5%99%a8%e7%9a%84%e5%8e%86%e5%8f%b2%e5%8f%91%e5%b1%95/</link>
		<comments>http://thinkinginweb.wordpress.com/2009/04/08/internet-explorer-%e6%b5%8f%e8%a7%88%e5%99%a8%e7%9a%84%e5%8e%86%e5%8f%b2%e5%8f%91%e5%b1%95/#comments</comments>
		<pubDate>Wed, 08 Apr 2009 13:28:00 +0000</pubDate>
		<dc:creator>Echo Chen</dc:creator>
				<category><![CDATA[1]]></category>
		<category><![CDATA[IE]]></category>
		<category><![CDATA[浏览器]]></category>

		<guid isPermaLink="false">http://thinkinginweb.wordpress.com/2009/04/08/internet-explorer-%e6%b5%8f%e8%a7%88%e5%99%a8%e7%9a%84%e5%8e%86%e5%8f%b2%e5%8f%91%e5%b1%95/</guid>
		<description><![CDATA[&#160; Internet Explorer最初是从早期一款商业性的专利网页浏览器Spyglass Mosaic衍生出来的产品。在1996年，微软透过给予季度费用和部分收入从Spyglass中取得了Spyglass Mosaic的授权。虽然Spyglass Mosaic的名字与NCSA Mosaic（首款应用得最广泛的网页浏览器）甚为相似，但Spyglass Mosaic则相对地较不出名以及使用了NCSA Mosaic少量的源代码。 Internet Explorer 3.0及之前版本 1995年8月，Internet Explorer第一个版本发布，但其最初几个版本并不受到广泛的使用，直到3.0版本的发行则开始改写了这个局面。3.0版本于1996年8月13日发布，是首个脱离Spyglass源代码发展的版本（但仍使用Spyglass的“技术”，所以程序的文件记录仍保留了Spyglass的版权资讯），它亦是首个支持CSS技术的主流浏览器。它引进了ActiveX控件、Java Applet、内联网页多媒体以及因特网内容选择平台系统对内容元数据的支持。对比于当时它的主要竞争对手Netscape Navigator，这些改进算是十分具代表性的。3.0版本亦捆绑了Internet Mail and News（为Outlook Express的前身）、NetMeeting及Windows Address Book，它亦缺省在Windows 95 OSR 2中。3.0版本被认为是Internet Explorer首个最受到欢迎的版本，但在发行后的数个月后亦被黑客发现了数个安全性和隐私漏洞。 Internet Explorer 4.0版本 4.0版本于1997年9月发布，它深化了浏览器和操作系统的整合层面，在Windows 95或Windows NT 4上安装4.0版本及选择视窗桌面更新功能可将传统式的Windows Explorer更新成与网页浏览器界面相似的新版Windows Explorer，用户亦可透过Active Desktop将网页浏览功能嵌入于视窗桌面上，可是这样的整合行为亦受到不少的批评（参见United States v. Microsoft案例），这个功能已在后期的版本安装中移除（但预先安装此功能的系统不会受到移除）。 4.0版本引进了群组原则，允许公司设定和锁上浏览器的参数设置。Internet Mail and News被Outlook Express取代，Microsoft Chat和经改良的NetMeeting亦被捆绑在IE中。Windows 98 第一版亦包含了这个版本。 Internet Explorer 5.0及5.5版本 Windows 3.2简体中文版上的Internet Explorer 5.0版本于1999年3月18日发布，随后亦被捆绑在Windows 98 [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=thinkinginweb.wordpress.com&amp;blog=7235426&amp;post=11&amp;subd=thinkinginweb&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://thinkinginweb.wordpress.com/2009/04/08/internet-explorer-%e6%b5%8f%e8%a7%88%e5%99%a8%e7%9a%84%e5%8e%86%e5%8f%b2%e5%8f%91%e5%b1%95/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/cb0e520fa538bbeb92dd1397f1e9b0f0?s=96&#38;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&#38;r=G" medium="image">
			<media:title type="html">qdechochen</media:title>
		</media:content>

		<media:content url="http://www.chinaz.com/upimg/userup/0901/231411211953.jpg" medium="image" />

		<media:content url="http://www.chinaz.com/upimg/userup/0901/231411354318.jpg" medium="image" />

		<media:content url="http://www.chinaz.com/upimg/userup/0901/231412105514.jpg" medium="image" />

		<media:content url="http://www.chinaz.com/upimg/userup/0901/231412433U3.jpg" medium="image" />

		<media:content url="http://www.chinaz.com/upimg/userup/0901/231413063200.jpg" medium="image" />

		<media:content url="http://www.chinaz.com/upimg/userup/0901/231413251R4.jpg" medium="image" />
	</item>
		<item>
		<title>CSS纯英文数字自动换行</title>
		<link>http://thinkinginweb.wordpress.com/2009/04/08/css%e7%ba%af%e8%8b%b1%e6%96%87%e6%95%b0%e5%ad%97%e8%87%aa%e5%8a%a8%e6%8d%a2%e8%a1%8c/</link>
		<comments>http://thinkinginweb.wordpress.com/2009/04/08/css%e7%ba%af%e8%8b%b1%e6%96%87%e6%95%b0%e5%ad%97%e8%87%aa%e5%8a%a8%e6%8d%a2%e8%a1%8c/#comments</comments>
		<pubDate>Wed, 08 Apr 2009 13:18:00 +0000</pubDate>
		<dc:creator>Echo Chen</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[换行]]></category>

		<guid isPermaLink="false">http://thinkinginweb.wordpress.com/2009/04/08/css%e7%ba%af%e8%8b%b1%e6%96%87%e6%95%b0%e5%ad%97%e8%87%aa%e5%8a%a8%e6%8d%a2%e8%a1%8c/</guid>
		<description><![CDATA[当一个定义了宽度的块状元素中填充的全部为纯英文或者纯数字的时候，在IE和FF中都会撑大容器，不会自动换行，如下图 并且当数字或者英文中带有汉字时，会从汉字处换行，而纯汉字却可以自动换行。这个问题如何解决？先来认识一下两位主角word-wrap和word-break word-wrap用来控制换行 两种取值： (1)normal&#160; (2)break-word（此值用来强制换行，内容将在边界内换行，中文没有任何问题，英文语句也没问题。但是对于长串的英文，就不起作用。） word-break用来控制断词 三种取值： (1)normal (2)break-all（是断开单词。在单词到边界时，下个字母自动到下一行。主要解决了长串英文的问题。） (3)keep-all（是指Chinese, Japanese, and Korean不断词，一句话一行，可以用来排列古诗哟~） 【解决方法】 可以在CSS中加入 word-wrap:break-word; word-break:break-all; Posted in CSS Tagged: 换行<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=thinkinginweb.wordpress.com&amp;blog=7235426&amp;post=10&amp;subd=thinkinginweb&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://thinkinginweb.wordpress.com/2009/04/08/css%e7%ba%af%e8%8b%b1%e6%96%87%e6%95%b0%e5%ad%97%e8%87%aa%e5%8a%a8%e6%8d%a2%e8%a1%8c/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/cb0e520fa538bbeb92dd1397f1e9b0f0?s=96&#38;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&#38;r=G" medium="image">
			<media:title type="html">qdechochen</media:title>
		</media:content>

		<media:content url="http://thinkinginweb.files.wordpress.com/2009/04/2009031316223529-thumb.gif" medium="image">
			<media:title type="html">2009031316223529</media:title>
		</media:content>
	</item>
		<item>
		<title>让你的设计跟上CSS3（CSS3部分新特性介绍）</title>
		<link>http://thinkinginweb.wordpress.com/2009/04/06/%e8%ae%a9%e4%bd%a0%e7%9a%84%e8%ae%be%e8%ae%a1%e8%b7%9f%e4%b8%8acss3%ef%bc%88css3%e9%83%a8%e5%88%86%e6%96%b0%e7%89%b9%e6%80%a7%e4%bb%8b%e7%bb%8d%ef%bc%89/</link>
		<comments>http://thinkinginweb.wordpress.com/2009/04/06/%e8%ae%a9%e4%bd%a0%e7%9a%84%e8%ae%be%e8%ae%a1%e8%b7%9f%e4%b8%8acss3%ef%bc%88css3%e9%83%a8%e5%88%86%e6%96%b0%e7%89%b9%e6%80%a7%e4%bb%8b%e7%bb%8d%ef%bc%89/#comments</comments>
		<pubDate>Mon, 06 Apr 2009 07:29:00 +0000</pubDate>
		<dc:creator>Echo Chen</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[CSS3]]></category>

		<guid isPermaLink="false">http://thinkinginweb.wordpress.com/2009/04/06/%e8%ae%a9%e4%bd%a0%e7%9a%84%e8%ae%be%e8%ae%a1%e8%b7%9f%e4%b8%8acss3%ef%bc%88css3%e9%83%a8%e5%88%86%e6%96%b0%e7%89%b9%e6%80%a7%e4%bb%8b%e7%bb%8d%ef%bc%89/</guid>
		<description><![CDATA[Written By Chris Spooner，Translated by Echo 新的CSS中提供了许多令人激动的新特性使得我们在Web设计中得以创造性的应用它们。这些特性包含在即将到来的CSS3中。事实上，在接下来的数年中，你不能将它应用在你日常客户的项目中，但在专为Web设计交流而创建的Blog和Website上，这些特性可以帮助推动现代Web设计发展，为你的设计增光添彩，推动Web产业前进。 下面是取自这些新特性的五个技巧，这些可以用于你日常的Web设计。 1. 圆角边框(Border Radius) 或许现在最常用的CSS3的特性是圆角边框。标准的HTML块元素是90度的直角方形。CSS3样式规则允许圆角边框。 -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; 角半径也可以对每个角单独地设置。只是，对于-moz和-webkit-，这个语法是不同的： -moz-border-radius-topleft: 20px; -moz-border-radius-topright: 20px; -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; -webkit-border-top-right-radius: 20px; -webkit-border-top-left-radius: 20px; -webkit-border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; 这支持 Firefox, Safari&#160; 和 Chrome。 应用实例：Twitter. 另外请参照： W3C Working Draft Border-radius on CSS3.info The Art of Web 2. 图片边框(Border Image) [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=thinkinginweb.wordpress.com&amp;blog=7235426&amp;post=7&amp;subd=thinkinginweb&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://thinkinginweb.wordpress.com/2009/04/06/%e8%ae%a9%e4%bd%a0%e7%9a%84%e8%ae%be%e8%ae%a1%e8%b7%9f%e4%b8%8acss3%ef%bc%88css3%e9%83%a8%e5%88%86%e6%96%b0%e7%89%b9%e6%80%a7%e4%bb%8b%e7%bb%8d%ef%bc%89/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/cb0e520fa538bbeb92dd1397f1e9b0f0?s=96&#38;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&#38;r=G" medium="image">
			<media:title type="html">qdechochen</media:title>
		</media:content>

		<media:content url="http://88.198.60.17/images/css3/border-radius.png" medium="image">
			<media:title type="html">CSS border-radius</media:title>
		</media:content>

		<media:content url="http://78.46.108.98/images/css3/border-image.png" medium="image">
			<media:title type="html">CSS border-image</media:title>
		</media:content>

		<media:content url="http://88.198.60.17/images/css3/shadow.png" medium="image">
			<media:title type="html">CSS Shadow</media:title>
		</media:content>

		<media:content url="http://78.46.108.98/images/css3/opacity.png" medium="image">
			<media:title type="html">CSS Opacity</media:title>
		</media:content>

		<media:content url="http://88.198.60.17/images/css3/font-face.png" medium="image">
			<media:title type="html">CSS font-face</media:title>
		</media:content>
	</item>
		<item>
		<title>9个Web设计中常见的可用性错误</title>
		<link>http://thinkinginweb.wordpress.com/2009/04/05/9%e4%b8%aaweb%e8%ae%be%e8%ae%a1%e4%b8%ad%e5%b8%b8%e8%a7%81%e7%9a%84%e5%8f%af%e7%94%a8%e6%80%a7%e9%94%99%e8%af%af/</link>
		<comments>http://thinkinginweb.wordpress.com/2009/04/05/9%e4%b8%aaweb%e8%ae%be%e8%ae%a1%e4%b8%ad%e5%b8%b8%e8%a7%81%e7%9a%84%e5%8f%af%e7%94%a8%e6%80%a7%e9%94%99%e8%af%af/#comments</comments>
		<pubDate>Sun, 05 Apr 2009 06:44:00 +0000</pubDate>
		<dc:creator>Echo Chen</dc:creator>
				<category><![CDATA[理念]]></category>
		<category><![CDATA[设计，可用性]]></category>

		<guid isPermaLink="false">http://thinkinginweb.wordpress.com/2009/04/05/9%e4%b8%aaweb%e8%ae%be%e8%ae%a1%e4%b8%ad%e5%b8%b8%e8%a7%81%e7%9a%84%e5%8f%af%e7%94%a8%e6%80%a7%e9%94%99%e8%af%af/</guid>
		<description><![CDATA[现在，比较牛的设计师和开发者都认识到了可用性在他们工作中的重要性。可用性好的网站会极大地提高用户体验，并且好的用户体验会让用户更加快乐。用聪明的设计决策取悦并满足您的访客，而不是阻挠和激怒他们。 下面是9个网站经常面临的可用性问题 ，以及对于这些问题的推荐解决方案。 您可能还对下面的文章感兴趣： 10 Usability Nightmaters That You Should Avoid 30 Usability Issues To Be Aware Of 12 Useful Techniques For Good Interface Design 10 Useful Web Application Interface Techniques 1. 太小的链接点击区域 设置超文本链接的目的是被点击，确保它们很容易点击才有意义。下面的示例中的链接实在是太小了;点击它们的难度太高。 这些是 评论中的链接，Hacker News 是一个社会新闻的网站。 （点击区域用红色突出显示） ： 下面例子中包含相同的界面元素，链接的评论，但是这个例子中有一个很大的可点击区域： Newspondcomments link. 为什么我们需要一个更大的点击区域？ 很简单。 因为我们移动鼠标并不是很准确。 一个大号的点击区域使鼠标光标悬停在链接上更容易。如何能有一个大号的点击区域呢？我们可以使整个链接更大，或者使用CSS “padding”属性增加链接周围的空间。 代码如下： &#60;a href=”http://www.examplesite.com”style=”padding: 5px;”&#62;Example Site&#60;a&#62; 为了使例子简单点，这个CSS样式直接写在代码里了，但在现实生活中您可能是在您的CSS文件中添加一个样式，给这个链接一个class或者是一个id，然后指向它。 在37signals上，你可以阅读到更多关于填充链接以更适用于鼠标点击的文章，的文章棉衣链接的目标 [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=thinkinginweb.wordpress.com&amp;blog=7235426&amp;post=6&amp;subd=thinkinginweb&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://thinkinginweb.wordpress.com/2009/04/05/9%e4%b8%aaweb%e8%ae%be%e8%ae%a1%e4%b8%ad%e5%b8%b8%e8%a7%81%e7%9a%84%e5%8f%af%e7%94%a8%e6%80%a7%e9%94%99%e8%af%af/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/cb0e520fa538bbeb92dd1397f1e9b0f0?s=96&#38;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&#38;r=G" medium="image">
			<media:title type="html">qdechochen</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/hackernews_links.png" medium="image">
			<media:title type="html">HackerNews link click areas</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/newspond_links.png" medium="image">
			<media:title type="html">NewsPond link click areas</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/feedmyapp_pagination.png" medium="image">
			<media:title type="html">FeedMyApp pagination</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/wired_google_logo.png" medium="image">
			<media:title type="html">Wired article paginated</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/smashingmag_title.png" medium="image">
			<media:title type="html">Smashing Magazine page title</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/smashingmag_serp.png" medium="image">
			<media:title type="html">Smashing Magazine SERP</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/basecamp_browse.jpg" medium="image">
			<media:title type="html">Basecamp</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/openoffice.png" medium="image">
			<media:title type="html">OpenOffice page</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/things_features.png" medium="image">
			<media:title type="html">Things features</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/cocacola_contact.png" medium="image">
			<media:title type="html">CocaCola contact page</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/apple2.gif" medium="image">
			<media:title type="html">GetSatisfaction Apple</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/getsatisfaction_login.png" medium="image">
			<media:title type="html">GetSatisfaction login</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/pixlr.png" medium="image">
			<media:title type="html">Pixlr</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/posterous.png" medium="image">
			<media:title type="html">Posterous</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/404.png" medium="image">
			<media:title type="html">Frye Wiles 404 page</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/readoz_signup.png" medium="image">
			<media:title type="html">ReadOz signup form</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/tumblr_signup.png" medium="image">
			<media:title type="html">Tumbler Signup</media:title>
		</media:content>

		<media:content url="http://iamsure.org/images/usability-problems-solutions/basecamp_signup.png" medium="image">
			<media:title type="html">Basecamp signup</media:title>
		</media:content>
	</item>
		<item>
		<title>CSS常见HACK/ie5/ie6/ie7/firefox</title>
		<link>http://thinkinginweb.wordpress.com/2009/04/04/css%e5%b8%b8%e8%a7%81hackie5ie6ie7firefox/</link>
		<comments>http://thinkinginweb.wordpress.com/2009/04/04/css%e5%b8%b8%e8%a7%81hackie5ie6ie7firefox/#comments</comments>
		<pubDate>Sat, 04 Apr 2009 19:09:00 +0000</pubDate>
		<dc:creator>Echo Chen</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Hack]]></category>

		<guid isPermaLink="false">http://thinkinginweb.wordpress.com/2009/04/04/css%e5%b8%b8%e8%a7%81hackie5ie6ie7firefox/</guid>
		<description><![CDATA[一、CSS HACK 以下两种方法几乎能解决现今部分HACK. 1, !important 随着IE7对!important的支持, !important 方法现在只针对IE6的HACK. (注意写法.记得该声明位置需要提前.) #wrapper { width: 100px!important; /* IE7+FF */ width: 80px; /* IE6 */ } 2, IE6/IE77对FireFox *+html 与 *html 是IE特有的标签, firefox 暂不支持. #wrapper { #wrapper { width: 120px; } /* FireFox */ *html #wrapper { width: 80px;} /* ie6 fixed */ *+html #wrapper { width: 60px;} /* [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=thinkinginweb.wordpress.com&amp;blog=7235426&amp;post=5&amp;subd=thinkinginweb&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://thinkinginweb.wordpress.com/2009/04/04/css%e5%b8%b8%e8%a7%81hackie5ie6ie7firefox/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/cb0e520fa538bbeb92dd1397f1e9b0f0?s=96&#38;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&#38;r=G" medium="image">
			<media:title type="html">qdechochen</media:title>
		</media:content>
	</item>
		<item>
		<title>@import调用css和link href调用的区别</title>
		<link>http://thinkinginweb.wordpress.com/2009/04/04/import%e8%b0%83%e7%94%a8css%e5%92%8clink-href%e8%b0%83%e7%94%a8%e7%9a%84%e5%8c%ba%e5%88%ab/</link>
		<comments>http://thinkinginweb.wordpress.com/2009/04/04/import%e8%b0%83%e7%94%a8css%e5%92%8clink-href%e8%b0%83%e7%94%a8%e7%9a%84%e5%8c%ba%e5%88%ab/#comments</comments>
		<pubDate>Sat, 04 Apr 2009 18:54:00 +0000</pubDate>
		<dc:creator>Echo Chen</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://thinkinginweb.wordpress.com/2009/04/04/import%e8%b0%83%e7%94%a8css%e5%92%8clink-href%e8%b0%83%e7%94%a8%e7%9a%84%e5%8c%ba%e5%88%ab/</guid>
		<description><![CDATA[大家去分析一些大站的css代码时，都会发现调用css有以下两种方法： 方法一： &#60;style type=&#34;text/css&#34;&#62; &#60;!&#8211; @import url(&#34;css/main.css&#34;); @import url(&#34;css/font.css&#34;); @import url(&#34;css/layout.css&#34;); &#8211;&#62; &#60;/style&#62; 方法二： &#60;link href=&#34;css/tianyi.css&#34; rel=&#34;stylesheet&#34; type=&#34;text/css&#34; /&#62; 那么这两各方法有什么区别和优缺点呢？ 本质上，这两种方式都是为了加载CSS文件，但还是存在着细微的差别。 差别1：老祖宗的差别。link属于XHTML标签，而@import完全是CSS提供的一种方式。 link标签除了可以加载CSS外，还可以做很多其它的事情，比如定义RSS，定义rel连接属性等，@import就只能加载CSS了。 差别2：加载顺序的差别。当一个页面被加载的时候（就是被浏览者浏览的时候），link引用的CSS会同时被加载，而@import引用的CSS会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式（就是闪烁），网速慢的时候还挺明显（梦之都加载CSS的方式就是使用@import，我一边下载一边浏览梦之都网页时，就会出现上述问题）。 差别3：兼容性的差别。由于@import是CSS2.1提出的所以老的浏览器不支持，@import只有在IE5以上的才能识别，而link标签无此问题。 差别4：使用dom控制样式时的差别。当使用javascript控制dom去改变样式的时候，只能使用link标签，因为@import不是dom可以控制的。 /* 大致就这几种差别了，其它的都一样，从上面的分析来看，还是使用link标签比较好。 标准网页制作加载CSS文件时，还应该选定要加载的媒体（media），比如screen，print，或者全部all等。 */ 差别5：@import可以在css中再次引入其他样式表，比如可以创建一个主样式表，在主样式表中再引入其他的样式表，如： main.css ———————- @import “sub1.css”; @import “sub2.css”; sub1.css ———————- p {color:red;} sub2.css ———————- .myclass {color:blue} 这样更利于修改和扩展． 提示：这样做有一个缺点，会对网站服务器产生过多的HTTP请求，以前是一个文件，而现在却是两个或更多文件了，服务器的压力增大，浏览量大的网站还是谨慎使用。有兴趣的可以观察一下像新浪等网站的首页或栏目首页代码，他们总会把css或js直接写在html里，而不用外部文件。 &#160; 转自：http://www.upsdihtml.com/skill/skill.asp?skillid=70 Posted in CSS Tagged: CSS<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=thinkinginweb.wordpress.com&amp;blog=7235426&amp;post=3&amp;subd=thinkinginweb&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://thinkinginweb.wordpress.com/2009/04/04/import%e8%b0%83%e7%94%a8css%e5%92%8clink-href%e8%b0%83%e7%94%a8%e7%9a%84%e5%8c%ba%e5%88%ab/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/cb0e520fa538bbeb92dd1397f1e9b0f0?s=96&#38;d=http%3A%2F%2F0.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D96&#38;r=G" medium="image">
			<media:title type="html">qdechochen</media:title>
		</media:content>
	</item>
	</channel>
</rss>
