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

<channel>
	<title>idea&#039;s blog &#187; 交互设计</title>
	<atom:link href="http://www.ideawu.net/blog/tag/%e4%ba%a4%e4%ba%92%e8%ae%be%e8%ae%a1/feed" rel="self" type="application/rss+xml" />
	<link>http://www.ideawu.net/blog</link>
	<description>网络服务器架构, Linux C/C++服务器端开发, TCP/IP网络协议, PHP Web后端和Web前端开发, 网站架构.</description>
	<lastBuildDate>Wed, 08 Feb 2012 10:02:48 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>请提供Fuck-All选项</title>
		<link>http://www.ideawu.net/blog/archives/503.html</link>
		<comments>http://www.ideawu.net/blog/archives/503.html#comments</comments>
		<pubDate>Thu, 13 May 2010 05:27:55 +0000</pubDate>
		<dc:creator>ideawu</dc:creator>
				<category><![CDATA[Linux]]></category>
		<category><![CDATA[SVN]]></category>
		<category><![CDATA[交互设计]]></category>

		<guid isPermaLink="false">http://www.ideawu.net/blog/archives/503.html</guid>
		<description><![CDATA[<p>由于时间宝贵, 我们不可能弄清每一项东西. 所以, 当我们拿到一个新事物时, 我们会把它定义为某一个已经熟悉的事物的替代品, 用旧的方法来操作新的事物. 如果新事物的操作方法和旧事物相似(接口相同), 或者只经过非常符合大众逻辑的演绎(方法添加了默认参数), 那么, 我们就称这个新事物的学习成本很低.</p>
<p>我开始使用 SVN, 要进行一次版本合并操作. 在操作之前我知道, 肯定会有大量的冲突, 比如至少有 20 个文件有冲突, 而且这些冲突不是由我一个人产生. 所以, 我希望把所有的冲突都列出来, 然后再由各个人手工解决冲突. 所以, 我执行:</p>
<pre>
svn merge https://xxx...
</pre>
<p><span id="more-503"></span>当文件 file1 出现冲突时, 提示输入:</p>
<pre>
Conflict discovered in 'file1'.
Select: (p) postpone, (df) diff-full, (e) edit,
        (mc) mine-conflict, (tc) theirs-conflict,
        (s) show all options:
</pre>
<p>我输入了 p, 然后 file2 出现冲突, 又提示输入. &#8230;</p>
<p>我突然觉得, 难道要让我输入一百次 p 吗? 能不能有一个选项 p-to-all? 比如我们在 Windows 下复制文件, 要覆盖时会提示(大概意思):&#8221;Override file &#8216;abc.txt&#8217;? [Y]Yes, [N]No, [YA]Yes-to-All, [NA]No-to-All&#8221;.</p>
<p>虽然很简单, 但我非常愤怒, 终于找到解决方法, 那就是在出现这个提示前, 在执行命令的时候加一个选项:</p>
<pre>
svn merge --accept postpone https://xxx...
</pre>
<p>然后, 我意识到并确认了, cp, rm 等 Linux 命令在交互模式下(-i)都是同样的逻辑, 只能一个一个文件地确认, 不提供批量方法. 最后, 我不得不声明: Yet Another Linux Rule &#8211; Fuck-One-Only, No-Fuck-All.</p>
<p>但是, 这确实是一个非常狗屎的逻辑!</p>


<h3>Related posts:</h3><ol><li><a href='http://www.ideawu.net/blog/archives/230.html' rel='bookmark' title='Permanent Link: 我要转到 Windows 平台了'>我要转到 Windows 平台了</a></li>
<li><a href='http://www.ideawu.net/blog/archives/231.html' rel='bookmark' title='Permanent Link: 转到 Windows 平台的事需要考虑'>转到 Windows 平台的事需要考虑</a></li>
<li><a href='http://www.ideawu.net/blog/archives/570.html' rel='bookmark' title='Permanent Link: Linus又骂人stupid'>Linus又骂人stupid</a></li>
<li><a href='http://www.ideawu.net/blog/archives/214.html' rel='bookmark' title='Permanent Link: Web设计与开发服务'>Web设计与开发服务</a></li>
<li><a href='http://www.ideawu.net/blog/archives/625.html' rel='bookmark' title='Permanent Link: Chrome浏览器必装的插件'>Chrome浏览器必装的插件</a></li>
</ol><div><p><img src="http://www.ideawu.net/favicon.ico" /> 你现在看的文章是: <a href="http://www.ideawu.net/blog/archives/503.html" title="请提供Fuck-All选项">请提供Fuck-All选项</a></p>

<div>
	<a href="http://www.benegg.com/linode-ad.php">
		Linode VPS - 美国虚拟主机
	</a>
	|
	<a href="http://www.udpwork.com/">
		IT牛人博客聚合网站
	</a>
</div></div>]]></description>
			<content:encoded><![CDATA[<p>由于时间宝贵, 我们不可能弄清每一项东西. 所以, 当我们拿到一个新事物时, 我们会把它定义为某一个已经熟悉的事物的替代品, 用旧的方法来操作新的事物. 如果新事物的操作方法和旧事物相似(接口相同), 或者只经过非常符合大众逻辑的演绎(方法添加了默认参数), 那么, 我们就称这个新事物的学习成本很低.</p>
<p>我开始使用 SVN, 要进行一次版本合并操作. 在操作之前我知道, 肯定会有大量的冲突, 比如至少有 20 个文件有冲突, 而且这些冲突不是由我一个人产生. 所以, 我希望把所有的冲突都列出来, 然后再由各个人手工解决冲突. 所以, 我执行:</p>
<pre>
svn merge https://xxx...
</pre>
<p><span id="more-503"></span>当文件 file1 出现冲突时, 提示输入:</p>
<pre>
Conflict discovered in 'file1'.
Select: (p) postpone, (df) diff-full, (e) edit,
        (mc) mine-conflict, (tc) theirs-conflict,
        (s) show all options:
</pre>
<p>我输入了 p, 然后 file2 出现冲突, 又提示输入. &#8230;</p>
<p>我突然觉得, 难道要让我输入一百次 p 吗? 能不能有一个选项 p-to-all? 比如我们在 Windows 下复制文件, 要覆盖时会提示(大概意思):&#8221;Override file &#8216;abc.txt&#8217;? [Y]Yes, [N]No, [YA]Yes-to-All, [NA]No-to-All&#8221;.</p>
<p>虽然很简单, 但我非常愤怒, 终于找到解决方法, 那就是在出现这个提示前, 在执行命令的时候加一个选项:</p>
<pre>
svn merge --accept postpone https://xxx...
</pre>
<p>然后, 我意识到并确认了, cp, rm 等 Linux 命令在交互模式下(-i)都是同样的逻辑, 只能一个一个文件地确认, 不提供批量方法. 最后, 我不得不声明: Yet Another Linux Rule &#8211; Fuck-One-Only, No-Fuck-All.</p>
<p>但是, 这确实是一个非常狗屎的逻辑!</p>


<h3>Related posts:</h3><ol><li><a href='http://www.ideawu.net/blog/archives/230.html' rel='bookmark' title='Permanent Link: 我要转到 Windows 平台了'>我要转到 Windows 平台了</a></li>
<li><a href='http://www.ideawu.net/blog/archives/231.html' rel='bookmark' title='Permanent Link: 转到 Windows 平台的事需要考虑'>转到 Windows 平台的事需要考虑</a></li>
<li><a href='http://www.ideawu.net/blog/archives/570.html' rel='bookmark' title='Permanent Link: Linus又骂人stupid'>Linus又骂人stupid</a></li>
<li><a href='http://www.ideawu.net/blog/archives/214.html' rel='bookmark' title='Permanent Link: Web设计与开发服务'>Web设计与开发服务</a></li>
<li><a href='http://www.ideawu.net/blog/archives/625.html' rel='bookmark' title='Permanent Link: Chrome浏览器必装的插件'>Chrome浏览器必装的插件</a></li>
</ol><div><p><img src="http://www.ideawu.net/favicon.ico" /> 你现在看的文章是: <a href="http://www.ideawu.net/blog/archives/503.html" title="请提供Fuck-All选项">请提供Fuck-All选项</a></p>

<div>
	<a href="http://www.benegg.com/linode-ad.php">
		Linode VPS - 美国虚拟主机
	</a>
	|
	<a href="http://www.udpwork.com/">
		IT牛人博客聚合网站
	</a>
</div></div>]]></content:encoded>
			<wfw:commentRss>http://www.ideawu.net/blog/archives/503.html/feed</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Google Talk 界面开发分析</title>
		<link>http://www.ideawu.net/blog/archives/299.html</link>
		<comments>http://www.ideawu.net/blog/archives/299.html#comments</comments>
		<pubDate>Tue, 18 Dec 2007 01:29:28 +0000</pubDate>
		<dc:creator>ideawu</dc:creator>
				<category><![CDATA[Computer System]]></category>
		<category><![CDATA[交互设计]]></category>

		<guid isPermaLink="false"></guid>
		<description><![CDATA[<p>有分析文章表明, Google Talk 的界面很大部分使用了 MSHTML 控件. 所以, 它的开发方式如<a href="http://www.ideawu.net/ideablog/category7/article288.html">前面的文章(GUI 的架构设计)</a>提到的: 结构描述语言 + 样式描述语言 + 结构操作语言 + 虚拟机(包含渲染器, 命令解释器).</p>
<p>如果你做过 Web 界面开发, 你应该能看出 Google Talk 在哪方面使用了 MSHTML 控件. 例如在设置窗口里的界面选项:</p>
<p><img alt="google talk" src="http://www.ideawu.net/ideablog/upload/googletalk_Settings_Apperance.png" />  </p>
<p>在 C:\Documents and Settings\XXXXX\Local Settings\Application Data\Google\Google Talk\themes\system\chat 目录下你可以找到每一个界面对应的 HTML 模板和 CSS 样式表(main.css). 修改某个主题的 main.css 文件, 然后在设置窗口里选择该主题, 你就能看到界面的样式已经改变.</p>
<p>Status.html 文件的内容是:</p>
<pre>&lt;div class='system1st' style='color:%color%'&gt;%message%&lt;/div&gt;
&lt;div id=&quot;insert&quot;&gt;&lt;/div&gt;
</pre>
<p>%message% 是一种简单的变量替换. main.css 里标签的名称仍然使用大写字母, 也许在 Web 版的 Google Talk 开发时, Google 的开发人员还没注意到 Web 标准.</p>


<h3>Related posts:</h3><ol><li><a href='http://www.ideawu.net/blog/archives/301.html' rel='bookmark' title='Permanent Link: Google Talk Developer Home 中文翻译'>Google Talk Developer Home 中文翻译</a></li>
<li><a href='http://www.ideawu.net/blog/archives/526.html' rel='bookmark' title='Permanent Link: 以浏览器引擎为核心的软件架构'>以浏览器引擎为核心的软件架构</a></li>
<li><a href='http://www.ideawu.net/blog/archives/144.html' rel='bookmark' title='Permanent Link: 使用Gaim连接Gtalk'>使用Gaim连接Gtalk</a></li>
<li><a href='http://www.ideawu.net/blog/archives/122.html' rel='bookmark' title='Permanent Link: 编写JSP/PHP+MySQL留言本'>编写JSP/PHP+MySQL留言本</a></li>
<li><a href='http://www.ideawu.net/blog/archives/148.html' rel='bookmark' title='Permanent Link: 安装和使用Google Earth &#8211; Linux'>安装和使用Google Earth &#8211; Linux</a></li>
</ol><div><p><img src="http://www.ideawu.net/favicon.ico" /> 你现在看的文章是: <a href="http://www.ideawu.net/blog/archives/299.html" title="Google Talk 界面开发分析">Google Talk 界面开发分析</a></p>

<div>
	<a href="http://www.benegg.com/linode-ad.php">
		Linode VPS - 美国虚拟主机
	</a>
	|
	<a href="http://www.udpwork.com/">
		IT牛人博客聚合网站
	</a>
</div></div>]]></description>
			<content:encoded><![CDATA[<p>有分析文章表明, Google Talk 的界面很大部分使用了 MSHTML 控件. 所以, 它的开发方式如<a href="http://www.ideawu.net/ideablog/category7/article288.html">前面的文章(GUI 的架构设计)</a>提到的: 结构描述语言 + 样式描述语言 + 结构操作语言 + 虚拟机(包含渲染器, 命令解释器).</p>
<p>如果你做过 Web 界面开发, 你应该能看出 Google Talk 在哪方面使用了 MSHTML 控件. 例如在设置窗口里的界面选项:</p>
<p><img alt="google talk" src="http://www.ideawu.net/ideablog/upload/googletalk_Settings_Apperance.png" />  </p>
<p>在 C:\Documents and Settings\XXXXX\Local Settings\Application Data\Google\Google Talk\themes\system\chat 目录下你可以找到每一个界面对应的 HTML 模板和 CSS 样式表(main.css). 修改某个主题的 main.css 文件, 然后在设置窗口里选择该主题, 你就能看到界面的样式已经改变.</p>
<p>Status.html 文件的内容是:</p>
<pre>&lt;div class='system1st' style='color:%color%'&gt;%message%&lt;/div&gt;
&lt;div id=&quot;insert&quot;&gt;&lt;/div&gt;
</pre>
<p>%message% 是一种简单的变量替换. main.css 里标签的名称仍然使用大写字母, 也许在 Web 版的 Google Talk 开发时, Google 的开发人员还没注意到 Web 标准.</p>


<h3>Related posts:</h3><ol><li><a href='http://www.ideawu.net/blog/archives/301.html' rel='bookmark' title='Permanent Link: Google Talk Developer Home 中文翻译'>Google Talk Developer Home 中文翻译</a></li>
<li><a href='http://www.ideawu.net/blog/archives/526.html' rel='bookmark' title='Permanent Link: 以浏览器引擎为核心的软件架构'>以浏览器引擎为核心的软件架构</a></li>
<li><a href='http://www.ideawu.net/blog/archives/144.html' rel='bookmark' title='Permanent Link: 使用Gaim连接Gtalk'>使用Gaim连接Gtalk</a></li>
<li><a href='http://www.ideawu.net/blog/archives/122.html' rel='bookmark' title='Permanent Link: 编写JSP/PHP+MySQL留言本'>编写JSP/PHP+MySQL留言本</a></li>
<li><a href='http://www.ideawu.net/blog/archives/148.html' rel='bookmark' title='Permanent Link: 安装和使用Google Earth &#8211; Linux'>安装和使用Google Earth &#8211; Linux</a></li>
</ol><div><p><img src="http://www.ideawu.net/favicon.ico" /> 你现在看的文章是: <a href="http://www.ideawu.net/blog/archives/299.html" title="Google Talk 界面开发分析">Google Talk 界面开发分析</a></p>

<div>
	<a href="http://www.benegg.com/linode-ad.php">
		Linode VPS - 美国虚拟主机
	</a>
	|
	<a href="http://www.udpwork.com/">
		IT牛人博客聚合网站
	</a>
</div></div>]]></content:encoded>
			<wfw:commentRss>http://www.ideawu.net/blog/archives/299.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>GUI 的架构设计</title>
		<link>http://www.ideawu.net/blog/archives/298.html</link>
		<comments>http://www.ideawu.net/blog/archives/298.html#comments</comments>
		<pubDate>Sun, 25 Nov 2007 02:58:48 +0000</pubDate>
		<dc:creator>ideawu</dc:creator>
				<category><![CDATA[Computer System]]></category>
		<category><![CDATA[交互设计]]></category>

		<guid isPermaLink="false"></guid>
		<description><![CDATA[<p>当前的 GPU 仍然拘泥于像素的计算, 它们应该建立更高的逻辑, 正如在某些领域, 硬件单元在整合原来的软件功能. 当前应用程序的 GUI 的特点是文本和图片堆砌.</p>
<h2>1. 建议的 GUI 架构</h2>
<p>应用程序的 GUI 应该和应用的计算是完全分离的. 当前的 GUI 在架构上和应用的计算在二进制代码层面是不区分的, 而且在编程语言层面也没有区分, 两者是高度耦合的.</p>
<p>在编程语言层面, GUI 和应用的计算不应该通过变量引用耦合在一起, 而是应该通过单一的通信通道进行通信.</p>
<p>在二进制代码层面, GUI 和应用的计算应该分离, 例如在计算机的体系结构上引入 GUI 处理器, 将 GUI 的渲染, 编程等交由 GUI 处理器处理. GUI 处理器在硬件级别上和 CPU 进行通信, 当然, 这种通信应该建立在某种较高的层面上.</p>
<h2>2. GUI 的特点</h2>
<p>在很多 GUI 应用中, 界面是稳定的, 结构化的, 组合性的.</p>
<p>例如在一个文本编辑软件中, 虽然文本编辑区域不断增删文本, 但是, 菜单栏, 工具栏, 状态栏等的结构几乎不改变. 这种稳定性决定了可以使用描述性的文本来描述界面.</p>
<p>继续上面的例子. 工具栏的按钮可能动态地(在运行时)增加或者减少几个, 但是, 这种变化是结构化的, 可以使用 DOM 方式进行操作.</p>
<p>因为界面是结构化的, 所以可组合性比较高.</p>
<h2>3. GUI 的开发</h2>
<p>GUI 开发 = 结构描述语言 + 样式描述语言 + 结构操作语言 + 虚拟机(包含渲染器, 命令解释器). 一个例子是 HTML + CSS + JavaScript + Web Browser.</p>
<h3>3.1 使用声明式语言来描述界面的结构和外观</h3>
<p>当前的 GUI 开发往往使用 C, C++, Java 等命令式语言来描述界面的结构和外观, 但是, 声明式语言更适合这项工作.</p>
<p>假设使用 XML 来描述界面的结构, 那么 XML 文本文档的结构很直观的反映了界面的结构. HTML/XHTML, GTK Glade, ASP.NET, Mozilla XUL, WPF 等使用 XML(或类 XML) 来描述界面.</p>
<p>CSS 之类的样式语言可以用来描述界面的外观.</p>
<p>外观和结构分离.</p>
<h3>3.2 使用命令式语言来改变界面的结构和外观</h3>
<p>命令式语言被用来改变界面的结构和外观, 可以使用 DOM 方式. 同时, 命令式语言用来同外界通信. 当然, 虚拟机可以内置部分的通信功能.</p>
<h3>3.3 要求</h3>
<p>上面提到的语言应该是解释型的.</p>
<p>TODO: 某些概念有些模糊</p>


<h3>Related posts:</h3><ol><li><a href='http://www.ideawu.net/blog/archives/607.html' rel='bookmark' title='Permanent Link: 获取动态加载的图片大小的正确方法'>获取动态加载的图片大小的正确方法</a></li>
<li><a href='http://www.ideawu.net/blog/archives/286.html' rel='bookmark' title='Permanent Link: P2P服务中心的开发'>P2P服务中心的开发</a></li>
<li><a href='http://www.ideawu.net/blog/archives/155.html' rel='bookmark' title='Permanent Link: 如何使用ServletContextListener'>如何使用ServletContextListener</a></li>
<li><a href='http://www.ideawu.net/blog/archives/269.html' rel='bookmark' title='Permanent Link: 开始学习 Python'>开始学习 Python</a></li>
<li><a href='http://www.ideawu.net/blog/archives/499.html' rel='bookmark' title='Permanent Link: PyPy &#8211; 吞下自己尾巴的小蟒蛇'>PyPy &#8211; 吞下自己尾巴的小蟒蛇</a></li>
</ol><div><p><img src="http://www.ideawu.net/favicon.ico" /> 你现在看的文章是: <a href="http://www.ideawu.net/blog/archives/298.html" title="GUI 的架构设计">GUI 的架构设计</a></p>

<div>
	<a href="http://www.benegg.com/linode-ad.php">
		Linode VPS - 美国虚拟主机
	</a>
	|
	<a href="http://www.udpwork.com/">
		IT牛人博客聚合网站
	</a>
</div></div>]]></description>
			<content:encoded><![CDATA[<p>当前的 GPU 仍然拘泥于像素的计算, 它们应该建立更高的逻辑, 正如在某些领域, 硬件单元在整合原来的软件功能. 当前应用程序的 GUI 的特点是文本和图片堆砌.</p>
<h2>1. 建议的 GUI 架构</h2>
<p>应用程序的 GUI 应该和应用的计算是完全分离的. 当前的 GUI 在架构上和应用的计算在二进制代码层面是不区分的, 而且在编程语言层面也没有区分, 两者是高度耦合的.</p>
<p>在编程语言层面, GUI 和应用的计算不应该通过变量引用耦合在一起, 而是应该通过单一的通信通道进行通信.</p>
<p>在二进制代码层面, GUI 和应用的计算应该分离, 例如在计算机的体系结构上引入 GUI 处理器, 将 GUI 的渲染, 编程等交由 GUI 处理器处理. GUI 处理器在硬件级别上和 CPU 进行通信, 当然, 这种通信应该建立在某种较高的层面上.</p>
<h2>2. GUI 的特点</h2>
<p>在很多 GUI 应用中, 界面是稳定的, 结构化的, 组合性的.</p>
<p>例如在一个文本编辑软件中, 虽然文本编辑区域不断增删文本, 但是, 菜单栏, 工具栏, 状态栏等的结构几乎不改变. 这种稳定性决定了可以使用描述性的文本来描述界面.</p>
<p>继续上面的例子. 工具栏的按钮可能动态地(在运行时)增加或者减少几个, 但是, 这种变化是结构化的, 可以使用 DOM 方式进行操作.</p>
<p>因为界面是结构化的, 所以可组合性比较高.</p>
<h2>3. GUI 的开发</h2>
<p>GUI 开发 = 结构描述语言 + 样式描述语言 + 结构操作语言 + 虚拟机(包含渲染器, 命令解释器). 一个例子是 HTML + CSS + JavaScript + Web Browser.</p>
<h3>3.1 使用声明式语言来描述界面的结构和外观</h3>
<p>当前的 GUI 开发往往使用 C, C++, Java 等命令式语言来描述界面的结构和外观, 但是, 声明式语言更适合这项工作.</p>
<p>假设使用 XML 来描述界面的结构, 那么 XML 文本文档的结构很直观的反映了界面的结构. HTML/XHTML, GTK Glade, ASP.NET, Mozilla XUL, WPF 等使用 XML(或类 XML) 来描述界面.</p>
<p>CSS 之类的样式语言可以用来描述界面的外观.</p>
<p>外观和结构分离.</p>
<h3>3.2 使用命令式语言来改变界面的结构和外观</h3>
<p>命令式语言被用来改变界面的结构和外观, 可以使用 DOM 方式. 同时, 命令式语言用来同外界通信. 当然, 虚拟机可以内置部分的通信功能.</p>
<h3>3.3 要求</h3>
<p>上面提到的语言应该是解释型的.</p>
<p>TODO: 某些概念有些模糊</p>


<h3>Related posts:</h3><ol><li><a href='http://www.ideawu.net/blog/archives/607.html' rel='bookmark' title='Permanent Link: 获取动态加载的图片大小的正确方法'>获取动态加载的图片大小的正确方法</a></li>
<li><a href='http://www.ideawu.net/blog/archives/286.html' rel='bookmark' title='Permanent Link: P2P服务中心的开发'>P2P服务中心的开发</a></li>
<li><a href='http://www.ideawu.net/blog/archives/155.html' rel='bookmark' title='Permanent Link: 如何使用ServletContextListener'>如何使用ServletContextListener</a></li>
<li><a href='http://www.ideawu.net/blog/archives/269.html' rel='bookmark' title='Permanent Link: 开始学习 Python'>开始学习 Python</a></li>
<li><a href='http://www.ideawu.net/blog/archives/499.html' rel='bookmark' title='Permanent Link: PyPy &#8211; 吞下自己尾巴的小蟒蛇'>PyPy &#8211; 吞下自己尾巴的小蟒蛇</a></li>
</ol><div><p><img src="http://www.ideawu.net/favicon.ico" /> 你现在看的文章是: <a href="http://www.ideawu.net/blog/archives/298.html" title="GUI 的架构设计">GUI 的架构设计</a></p>

<div>
	<a href="http://www.benegg.com/linode-ad.php">
		Linode VPS - 美国虚拟主机
	</a>
	|
	<a href="http://www.udpwork.com/">
		IT牛人博客聚合网站
	</a>
</div></div>]]></content:encoded>
			<wfw:commentRss>http://www.ideawu.net/blog/archives/298.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>获取焦点便选中所有文本的文本框是用户友好的吗?</title>
		<link>http://www.ideawu.net/blog/archives/257.html</link>
		<comments>http://www.ideawu.net/blog/archives/257.html#comments</comments>
		<pubDate>Sat, 07 Jul 2007 03:55:36 +0000</pubDate>
		<dc:creator>ideawu</dc:creator>
				<category><![CDATA[Web]]></category>
		<category><![CDATA[交互设计]]></category>

		<guid isPermaLink="false"></guid>
		<description><![CDATA[<p>Web表单和桌面程序中经常要用到文本输入框, 比如登录框中的用户名和密码输入. 在Web表单中, 文本框获取焦点后(鼠标点击或者Tab键切换), 其中的文本并不会被选中. 但是有一些人会画蛇添足, 在文本框获取焦点后将其中的文本全选中, 如 PHPMyAdmin. 听到画蛇添足这个贬义词, 你就知道我是反对这种作法, 下面我要分析该作法的错误之处.</p>
<p>例如, 当我在某个网站的登录框中输入 ideawu2, 然后点击登录. 事实上, 我的用户名是 ideawu, 只是一时笔误. 那么当我要修改时, 我当然是直接选中2后点击键盘上的Backspace键., 或者将光标定位到该文本框最后(这种操作方式比选中单个字符更容易), 然后点击键盘上的Backspace键. 如果你自作聪明地把所有的文本选中, 那么你是想让我把所有的文本删除再重新输入一遍吗? 即使是只更改一个字符?</p>
<p>从理论上讲, 该作法的错误根源是: 事物的状态不是凭空产生的, 而是从一个状态到另一个状态, 而且后一个状态一般是以前一个状态为基础的改变.</p>
<p>我有理由相信这种愚蠢的作法源于Windows操作系统的文本框的默认行为, 这种文本框最重要地应用是资源浏览器和IE的地址栏. 在Linux操作系统下的Gnome中的文本框就不会有这种行为. 所以, 当我在Windows下使用浏览器浏览网页, 想在地址栏中输入一个新的网址时, 比如, 当前我正在浏览 <a href="http://www.ideawu.net/">http://www.ideawu.net/</a>, 因为某种原因, 页面上并没有提供到 <a href="http://www.ideawu.net/ideablog/">http://www.ideawu.net/ideablog/</a> 的链接, 最简便的作法是把光标定位在网址的末尾, 然后输入 ideablog 回车. 但是, 在Windows下我根本无法这样做! 无论我点住鼠标同时把鼠标上, 下,&nbsp; 左(至少会选中一个字符), 右移动, 都无法把光标定位在网址的末尾, 这让我很苦恼.</p>
<p>奇怪的是, Windows的IE使用这种文本框的默认行为, 而Firefox的Windows版本的地址栏为什么也使用这种默认行为?</p>
<p>我常想, 微软是不是应该改变Windows文本框的这个愚蠢的默认行为? Web开发者能不能放弃这个愚蠢的作法?</p>


<h3>Related posts:</h3><ol><li><a href='http://www.ideawu.net/blog/archives/70.html' rel='bookmark' title='Permanent Link: 在Linux下玩Doom3'>在Linux下玩Doom3</a></li>
<li><a href='http://www.ideawu.net/blog/archives/337.html' rel='bookmark' title='Permanent Link: 新泽西爱未眠(Jersy.Girl)'>新泽西爱未眠(Jersy.Girl)</a></li>
<li><a href='http://www.ideawu.net/blog/archives/250.html' rel='bookmark' title='Permanent Link: ideablog 发布新版本 1.1'>ideablog 发布新版本 1.1</a></li>
<li><a href='http://www.ideawu.net/blog/archives/299.html' rel='bookmark' title='Permanent Link: Google Talk 界面开发分析'>Google Talk 界面开发分析</a></li>
<li><a href='http://www.ideawu.net/blog/archives/292.html' rel='bookmark' title='Permanent Link: &#8220;汉语编程&#8221;应该是个法律概念'>&#8220;汉语编程&#8221;应该是个法律概念</a></li>
</ol><div><p><img src="http://www.ideawu.net/favicon.ico" /> 你现在看的文章是: <a href="http://www.ideawu.net/blog/archives/257.html" title="获取焦点便选中所有文本的文本框是用户友好的吗?">获取焦点便选中所有文本的文本框是用户友好的吗?</a></p>

<div>
	<a href="http://www.benegg.com/linode-ad.php">
		Linode VPS - 美国虚拟主机
	</a>
	|
	<a href="http://www.udpwork.com/">
		IT牛人博客聚合网站
	</a>
</div></div>]]></description>
			<content:encoded><![CDATA[<p>Web表单和桌面程序中经常要用到文本输入框, 比如登录框中的用户名和密码输入. 在Web表单中, 文本框获取焦点后(鼠标点击或者Tab键切换), 其中的文本并不会被选中. 但是有一些人会画蛇添足, 在文本框获取焦点后将其中的文本全选中, 如 PHPMyAdmin. 听到画蛇添足这个贬义词, 你就知道我是反对这种作法, 下面我要分析该作法的错误之处.</p>
<p>例如, 当我在某个网站的登录框中输入 ideawu2, 然后点击登录. 事实上, 我的用户名是 ideawu, 只是一时笔误. 那么当我要修改时, 我当然是直接选中2后点击键盘上的Backspace键., 或者将光标定位到该文本框最后(这种操作方式比选中单个字符更容易), 然后点击键盘上的Backspace键. 如果你自作聪明地把所有的文本选中, 那么你是想让我把所有的文本删除再重新输入一遍吗? 即使是只更改一个字符?</p>
<p>从理论上讲, 该作法的错误根源是: 事物的状态不是凭空产生的, 而是从一个状态到另一个状态, 而且后一个状态一般是以前一个状态为基础的改变.</p>
<p>我有理由相信这种愚蠢的作法源于Windows操作系统的文本框的默认行为, 这种文本框最重要地应用是资源浏览器和IE的地址栏. 在Linux操作系统下的Gnome中的文本框就不会有这种行为. 所以, 当我在Windows下使用浏览器浏览网页, 想在地址栏中输入一个新的网址时, 比如, 当前我正在浏览 <a href="http://www.ideawu.net/">http://www.ideawu.net/</a>, 因为某种原因, 页面上并没有提供到 <a href="http://www.ideawu.net/ideablog/">http://www.ideawu.net/ideablog/</a> 的链接, 最简便的作法是把光标定位在网址的末尾, 然后输入 ideablog 回车. 但是, 在Windows下我根本无法这样做! 无论我点住鼠标同时把鼠标上, 下,&nbsp; 左(至少会选中一个字符), 右移动, 都无法把光标定位在网址的末尾, 这让我很苦恼.</p>
<p>奇怪的是, Windows的IE使用这种文本框的默认行为, 而Firefox的Windows版本的地址栏为什么也使用这种默认行为?</p>
<p>我常想, 微软是不是应该改变Windows文本框的这个愚蠢的默认行为? Web开发者能不能放弃这个愚蠢的作法?</p>


<h3>Related posts:</h3><ol><li><a href='http://www.ideawu.net/blog/archives/70.html' rel='bookmark' title='Permanent Link: 在Linux下玩Doom3'>在Linux下玩Doom3</a></li>
<li><a href='http://www.ideawu.net/blog/archives/337.html' rel='bookmark' title='Permanent Link: 新泽西爱未眠(Jersy.Girl)'>新泽西爱未眠(Jersy.Girl)</a></li>
<li><a href='http://www.ideawu.net/blog/archives/250.html' rel='bookmark' title='Permanent Link: ideablog 发布新版本 1.1'>ideablog 发布新版本 1.1</a></li>
<li><a href='http://www.ideawu.net/blog/archives/299.html' rel='bookmark' title='Permanent Link: Google Talk 界面开发分析'>Google Talk 界面开发分析</a></li>
<li><a href='http://www.ideawu.net/blog/archives/292.html' rel='bookmark' title='Permanent Link: &#8220;汉语编程&#8221;应该是个法律概念'>&#8220;汉语编程&#8221;应该是个法律概念</a></li>
</ol><div><p><img src="http://www.ideawu.net/favicon.ico" /> 你现在看的文章是: <a href="http://www.ideawu.net/blog/archives/257.html" title="获取焦点便选中所有文本的文本框是用户友好的吗?">获取焦点便选中所有文本的文本框是用户友好的吗?</a></p>

<div>
	<a href="http://www.benegg.com/linode-ad.php">
		Linode VPS - 美国虚拟主机
	</a>
	|
	<a href="http://www.udpwork.com/">
		IT牛人博客聚合网站
	</a>
</div></div>]]></content:encoded>
			<wfw:commentRss>http://www.ideawu.net/blog/archives/257.html/feed</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
	</channel>
</rss>

