演示可以见：http://www.fantxi.com/blog/demo/html/browser_detector.html

在css hacks方面，我觉得最好不要用!important来提升指定样式的优先权，我不喜欢这它，因为如果使用它的话，你可能会发现写出的css代码相对较多。当然也不是完全不用它，目的只是当我们加入hacks时，是否要考虑一下如何才能使css的代码更精简？顺便也应该想到，当我们写XHTML代码时，是否考虑某处用div合适，还是ul合适，或者是dl合适？当我们写javascript的时候呢，是否也可以使用最少的代码来实现某一效果？有些人只是写出了div、css代码就很自豪的说自己已经会div、css了，当我问他浏览器兼容和HTML标签语义化时，他却说不出。其实有很多地方值得我们去研究，上次帮公司做的网页，css和js代码基本都被我压缩的不能再压缩了，先手工压缩再机器压缩，很爽很爽:)， 不过他们说我变态～。其实这样网站的效率才能达到最高。

我的做法就是在做网页时，应该以firefox来作为参照，然后再在ie和其他浏览器下测试，这样写出的css代码可能会是最少的。还有就是善用display:inline来解决ie下margin加倍，善用clear:both，有时也可以这样：<!--[if IE]><link rel="stylesheet" type="text/css" href="ie.css" /><![endif]-->，给IE单独做一个css。因为之前做的是门户级的网站，写了很多页面，从中也学到了很多新知识，一时想不起来了，有时间再整理出来。还有只要结构写的好,不需要hack大部分也都能兼容。能不用hack就不用。

前两天把fantxi的域名续费了，把fantxi.com的首页代码又重写了一遍。其实很有冲动做个sablog2.0的模板，不过这件事的优先级可能是最低的。。

最近面临一个选择，这个选择也许会对自己的人生产生重大影响，希望自己多用些心思在这方面。

最近粗略看了一些用户体验、网站运营方面的资料，受益不少，对那些作者表示感谢。

我下午刚捐的，能捐点的就捐点吧。大家都是中国人。。

另这里有韩日网民对中国地震的评论：1.新浪的，2.天涯的，有兴趣的可以看看。
我去证实了下：这个是日本yahoo的，这个是韩国naver的(只看评论可以点这里)。情况基本属实。。看不懂可以去Google翻译下。

当然，伟大的辩证唯物论告诉我们，要辩证地看待问题。自助者，天助之。

1、下载leopard.torrent（下面的压缩包内有提供下载），添加到BT下载，BT任务中只需选leopard-x86.rar这个文件。下载好leopard-x86.rar（2.51GB），解压出里面的leopard-x86-flat-img，如：解压到D:\leopard。注意：leopard-x86-flat-img 是16545MB，约16.1GB，请确保有足够空间。此版为ToH_x86_9A581_RC2（MacOS X 10.5 9a581），虽不是最新的10.5.2，但也足够用了。

2、用WINPM（压缩包内有）在逻辑分区创建一个20G左右的分区（总之要大于leopard-x86-flat-img的大小，并且不要格式化）。还有这个分区要在逻辑分区的第一个分区，比如：主分区为C，逻辑分区为D、E、F，新创建的分区要用WINPM移动到D盘的前面（这样做是为了防止出现tboot不能引导的情况，有些电脑不需移动也可以引导。还有人说还要把此分区设为主分区，我试过后用tboot不能引导，提示：“hfs not found”，而逻辑分区的则能正常引导，所以这里不需设置此分区为主分区。）然后，用WINPM把这个新创建的分区ID设置为“af”，方法：点右键-修改-更改分区ID，输入af。Ps：winpm可以删除、创建、移动、修改分区，自己摸索吧，很简单。如果winpm提示不能移动分区，那就把winpm移动到其他分区运行。

3、把dd --list.bat 和dd.exe 解压到D:\leopard（leopard-x86-flat-img的文件夹内），运行dd --list.bat ，仔细找会看到如下面的内容 ：

如果你在第2步创建的是20GB的分区，那么就是21474836480 bytes。（如果创建的不是整数分区，可以自己去计算：bytes/1024/1024/1024=GB，然后再对比一下你创建的分区的大小）。找到”size is 21474836480 bytes“这句上面的”\\?\Device\Harddisk0\Partition2“，复制这句。（Ps：Harddisk0\Partition2的意思就是第1硬盘第2分区，如果创建的分区在D盘前面那么基本就是Partition2了）。

4、把write.bat解压到D:\leopard，先不要运行，编辑write.bat，看到如下：

看里面的”\\?\Device\Harddisk0\Partition2“是否和你复制的一样，不一样就替换你复制好的那句并保存。运行write.bat，开始向目标分区写入数据，里面会显示写入数据的情况（命令窗口最后一行会有数字不断地变化），这时千万不要关闭，等大概30分钟左右，直到出现Press any key to contiue，再关闭。

5、双启动菜单，将压缩包中的tboot文件解压到C:\根目录下。在文件夹选项中，选择”显示所有文件和文件夹“，去掉”隐藏受保护的系统文件“前面的钩。会看到boot.ini，用记事本编辑，在最后添加一行C:\tboot="Mac OS X"，保存后即可重启系统。修改后的：

  重启后,用键盘上下键选择”Mac OS X“进入。

6、进入mac后，界面是英文的，还要设置用户名、密码那些，keyboard--选择U.S.，select time zone--选beijing-china，apple id --直接跳过，网络--一般选local network(Ethernet)，其他的基本都按默认点continue可以了。进入Mac的桌面后，还要安装中文语言包，可以到迅雷的狗狗里面去搜索”SimplifiedChinese.pkg“，下载23.1M那个（这个21.38M的貌似也可以，有兴趣的可以试试）。安装语言包后，会注销重新进入，在系统设置中，把简体中文拖到最上面，重新注销再登陆就是中文界面了。

7、其他：输入法可以装Fun Input Toy。

下载：leopard-x86.rar

整体感觉还不错吧，里面有很多按一定比例缩小的世界各地建筑景观，如：德国新天鹅城堡、日本皇宫、美国白宫、埃及金字塔、意大利圣三山教堂等等吧。其实我只对新天鹅城堡感兴趣，不过近距离看城堡显得比较破旧。。最搞笑的是日本的皇宫，旁边挨着一垃圾箱，皇宫的墙上还放着一把锄头。。

现在里面免费的项目好像有17个，排队等的人太多了（过山车那里排队的人是最多的），我只玩了5个就不想排了。里面也有卡丁车玩，好像是三圈20吧，记不清了。总之感觉还是物有所值的，下次准备海底世界转转。

从UED的角度而言，我们的天职是追求用户体验。我们应该尽力坚持自己应该坚持的东西。白鸦曾经说过，用户体验不只是UED的事情，而是整个开发团队乃至整个公司需要参与的事情。

我们不能只是抱怨，我们去理解开发人员。同样，我们做出努力，让开发人员去理解我们。

我们努力去先做出改变。（小马按语）

原文地址： 8 Web Design Mistakes That Developers Make

一个优秀的网站是优秀的设计和优秀的代码的结合，你经常发现设计师不得不去理解代码，而开发人员尝试自己去设计。 开发人员花费大学生涯和与其他开发人员一起学习，我可以肯定的说程序员并不是设计师。谢天谢地，我们以前可以评判代码是否重用或者符合正确的OO方法论，但却无法评判美学。 但现在，一个开发人员最值钱的资产就是他对设计的敏锐的理解。

现在据我所知，程序员可能从不需要任何设计的知识（或者说，设计师从不需要了解程序）。但事实是，每一个拥有个人项目、少量客户或是管理角色的程序员都需要设计。甚至，我可以说，显而易见，一个自由工作者最大优势就在于，培养潜在的客户让他们渴望理解整个网站的建构过程。所以一个人正在学习做一个开发人员的同时，也需要学设计（至少尝试去做），以下就是我曾经听说或者犯过的8个错误。

“我知道什么看起来很好（我有photoshop）”

这是成为差劲的设计师的原因之一。更无可救药的是本来就很差劲了，还以为自己很好。每个好的设计师都有一个度量好设计的“设计标准”，这个经验来自于自己经常看好的设计。你需要把时间花费在看伟大的设计上，诸如TheFWA, FaveUp, Design is Kinky, 和我个人喜欢的 Behance Network 这些网站。你可能也知道如何去挑选设计杂志，比如How或者print（注意两者并不都是美国的，可能更加国际化一些）。就像好的程序员喜欢看（或评论）其他人的代码一样，好的设计师也总是环顾他人的工作成果，无论是站点、广告牌还是菜单。没有一个好的“设计标准”，即使有大量的photoshop滤镜也拯救不了你。

“一再地使用蓝色和白色”

大多数程序员嘲笑一个设计师总是花费大量的时间来为站点挑选精确的颜色。但是，颜色总要比你想象中还重要，并且你不能在站点构建的时候来更改（至少，那时候就不得不花费大的气力）。象很多事物一样，观察一个好的设计师的配色方案是很有帮助的，寻找配色方案最好的一个站点是COLOURlovers.

“我把每样东西都居中”

大多数情况下，将标题、标语和副本的一部分居中很自然。但是通常，将网页上的文字居中就很外行了。左对齐是很保险的做法，但往往最好是视情况而定。更好地是，在photoshop中利用标尺和网格精确地计算你网站的各个部分。这并不意味着你的设计像格子一样，但是眼睛可以注意到理应被排成一行的几部分却没有这样排列的情况（特别是文本）。每个像素都很重要。

“使用免费的字体…它对于我来说看起来不错”

我曾有一段时间这样想：（a）所有的衬线字看起来都一样（b）没有任何字体值得付钱。我现在把这两条都废除了，去继续学习更多的字体知识，那是一个复杂而美丽的世界。坦诚地讲，如果有一个领域我能成为专家，我希望是字体。你可以只用一点颜色和不错的字体来建立伟大的站点（这只是任何伟大设计的基础）。再次申明，在字体方面要做得更好，需要你多阅读好的站点培养你的眼睛。

“我们可以在那里放置更多的信息”

在拥有程序员和设计师的团队里工作，两者间一个普遍的争论是“空间的利用”，程序员想在页面明显的位置放置尽可能多的信息。设计师争论道，眼睛不可能承受如此多的东西，最好只是在明显的位置只放置logo和标语。尝试去找到最佳的平衡，需要知道（a）杂乱的网站可能没有效果（b）留白不是懒惰的设计师在倒退 （c）被称作“空”的部分是很必要的，以便突出其它元素。

“我可不想为照片付钱”

槽糕的图片或照片可以毁灭一个合理的网站，同时经过简单处理的伟大图片可以看起来很好。在网页上那么多的资源，没有理由使用差劲的图片。对于非营利站点而言，可以查看stock.xchng 或 Flickr。对于商业的站点，有许许多多的站点，比如iStockPhoto（但是需要了解版权的知识，因为不久后，你可能在其他站点上看到同样的照片了）。最后不要为在诸如Veer这样的站点上找到完美的照片而花费大笔的钱吓坏了。

“我无需询问意见”

更多地询问而不是闭门造车，你会成为你们设计师的最大粉丝（尽管你戴着一副玫瑰色的眼镜）。你需要询问你认识的设计师，以便得到坦诚的评价。不幸的是，我知道大多数被我问过的人，都只是赞誉而非批评。所以让你的自尊滚一边去吧，戴上“知识”这顶帽子。因为这些人是设计师而你不是。然后在你得到了他们的反馈之后，尊重他们、信任他们，并做一些改变。

“无需得到太多细节”

就像你很一般的代码需要等待提高（虽然仍能执行），你也有一些还说的过去的设计，但是离伟大差得远呢。看伟大的设计很容易这样想“这看起来没什么嘛”，但是事实上，伟大的设计花费了很多的时间（特别是对设计的新手）。但是有这些伟大的设计，你只是看到了最终的产品，并不知道设计者期间经历了多少次编辑和修改。甚至，你可能会惊讶于一条分割线会为设计带来多大的不同。当你把所有元素刚放在一起的时候，别以为设计做“完”了。

总而言之，伟大的设计（就像伟大的代码）很耗时间、耐心和技巧——因此，应该得到适当的尊重。尽管作为程序员（或者是内容编辑还是其他的web员工），你可能从不需要设计整个一个站点，但我有一种感觉，或多或少，你不得不做一点设计。如果可能的话，你尽量不要犯以上的错误……

文章来源: http://ued.taobao.com/blog/2008/02/01/8-web-design-mistakes-that-developers-make/

1. <script type="text/javascript">    
2. <!--    
3. var l=document.getElementById("left").scrollHeight;   
4. var r=document.getElementById("right").scrollHeight   
5. if (r>l)   
6. {   
7. document.getElementById("left").style.height=document.getElementById("right").scrollHeight+"px";   
8.   
9. }   
10. else  
11. {   
12. document.getElementById("right").style.height=document.getElementById("left").scrollHeight+"px";   
13. }   
14. -->    
15. </script>   

网上的div等高方法大致有五种，这个算是其中一种的完善，无论left或是right高时，都可以实现自适应高度。而且就算遇到left或right里面有其他元素影响时，也可以通过在+"px"; 前面加上加减乘除来达到满意的效果，例,可写成：+5+"px"。

解决就是把下面的内容另存为：wsh.inf，右键-install(安装) 就可以了。

想要邀请的就留下你的百度ID吧，我发出邀请后，登录百度点击-我的消息-系统消息，之后就可以看到邀请的链接了。

在网络设计领域关于Eye-Tracking的研究十分火爆，但是如何把这些研究结果转变为具体可行的设计来运作依旧是个难点。以下就是一些来自于Eye-Tracking研究结果的窍门，可以为改进你的网站设计提供些意见：

1.对比图像，文字更具吸引力

与你所认为的相反，在浏览一个网站的时候，能够直接吸引用户目光的并不是图像。大多数通过偶然点击进入你的网站的用户，他们是来寻觅信息的而不是图像。因此，保证你的网站设计凸现出最重要的信息板块，这才是设计的首要原则。

2.眼球的第一运动聚焦于网页的左上角

用户浏览网页的这一习惯应该在意料之中，毕竟左上部为主要操作中心这一点为大多数重要的计算机应用程序的设计所采用。在你构建网站考虑网站设计时，应该尽量保持这一格式。要知道，如果你希望保持个人特色，搭建一个成功的网站，你就必须尊重用户们的习惯。

3.用户浏览网页时，首先观察网页的左上部和上层部分，之后再往下阅读，浏览右边的内容

用户普遍的浏览方式呈现出“F”的形状 。保证网站内容的重要要素集中于这些关键区域，以此确保读者的参与。在此放置头条，副题，热点以及重要文章，这样可以吸引到读者进行阅读。

4.读者会忽视横幅广告

研究表明，读者常忽视大部分的横幅广告——尽管你以此维持网站生计——视线往往只停留几分之一秒。如果你想通过广告挣钱，那么必须创新你的广告位以及合理配置网站广告形式。

5.花哨的字体和格式被忽视

为什么呢？那是因为用户会认为这些是广告，并非他们所需要的信息。事实上，研究表明用户很难在充满大量颜色的花哨字体格式里寻找到所需的信息，因为视觉线索告诉他们把这些忽略吧。保持网站的清爽，不要因为华而不实的表面，让重要的信息被忽略。

6.用数词来代替数字

如果使用数词取代数字的罗列，读者会发现在你的网站可以很容易地发现真实的资料。要知道，你是写给那些将第一次浏览你的网站的读者，所以，让他们容易发现他们所需的信息，让他们感兴趣。

7.字体大小影响浏览行为

想改变人们对你的网页的看法吗？改变网页字体的大小。大的字体刺激浏览，而小一些的字体则提高焦点阅读量。根据你的需要，合理配置两者的比例。

8.遇到感兴趣的内容，用户仅会多看一眼副标题

不要过分坚持副标题固定的格式——保证他们的相关性和兴趣。你也可以让副标题包含关键词，这样可以有效利用搜索引擎，让它带来读者。

9.人们大都只浏览网页的小部分内容

如果在用户浏览的时候提供信息使他们尽快锁定目标，就可以把这一点发展成为你的优势。突出某些部分或者创建项目列表使网页信息容易找到和阅读。

10.简短的段落相对于长段落来说有更好的表现力

网页信息是为大多数强调快速浏览的无联网用户提供的。除非上下文的衔接要求，保持信息由简短的段落和句式组成，例如 这个电子商务网站 的产品介绍。

11.根据视觉锁定，一栏格式比多栏格式拥有更好的表现力

别让过多的信息把网站来访者淹没。大多数情况下，简洁更具力量。多栏内容容易被用户忽视，我们需要消除这些干扰。

12.网页顶部和左边的广告更能吸引眼球

如需要在网站植入广告，试图使他们融入网页的左上部，这样他们才能吸引到最大的视觉注意力。当然，用户仅仅会注意到这些广告，这并不意味着他们会用鼠标点击。所以不要为了提高广告的注意力而牺牲原有的网站设计。

13.将广告放置与最佳内容一旁也可以提升注意力

如果想要提升广告的可视性和点击率，可以将其设置于最能引起人兴趣的内容一旁，整合进网页的设计里。这样，用户既可以找到所需的内容，你也能提升广告的效益。

14.在各种测试中，人们阅读文字广告最为专心。

正如上面提到的，一般的互联网用户不会花费太多时间用于查看那些一眼就能看出是广告的内容。这就是文字广告表现出众的原因。他们并没有分散注意力，而是与网页的其它部分内容融为一体，这让他们减少了对读者的视觉刺激，也使这一广告形式获得成功的阅读率。

15.越大的图像吸引越多的注意力

如果要在网页中使用图片，那越大越好。人们更倾向于查看那些能够清楚地看到细节和获取信息的图像。要保证你所用的图片与文章内容相关，否则它更容易被忽视。大多数读者都拥有高速的连接速度，所以请放心在你的网站上使用那些较大体积的图片。

16.干净、清晰的特写图片能吸引更多的视觉注意

可能那些抽象的艺术图片会让你的网站看起来很有味道，但是他们并不会吸引多少读者的注意力。如果你需要使用到这些图片，请确保所用图片的清晰以及其表达内容的简单可读性。必须注意的是，那些与真实的“人”相关的图片比所谓的模特图片更为“优秀”。

17.标题能吸引眼球

浏览网页时，读者能发现的第一内容是标题。确保网页的所有相关链接畅通和有效，以让读者顺利的通过网站进一步搜索。

18.用户花费大量时间察看按钮和菜单

所以，你需要花费额外的时间维护你的精心设计。毕竟，他们不仅吸引了读者的眼球，更是网站设计的重要组成要素。

19.表单格式可以延长读者的注意时间

分解内容和段落，大量使用表单形式来表现你的文章，可以保证读者的浏览率。使用数字和其它标记符号来突出文章的重要内容，会让网站更容易浏览，用户更快的找到所需的信息。

20.避免呈现大块的文本

研究显示，一般的网络浏览者不会花费时间去阅读大块的文本，无论他们有多重要或写得多好。因此，必须把这些大文本分解为若干小段落。突出重要的地方，放置点击的按钮也可以提高用户的注意力。

21.格式可以吸引注意力

在文中使用粗体、大写、彩体、下划线可以帮助用户获取正文所表达的最主要的信息。使用时需要谨慎，因为过多的使用会使你的网页难以阅读，把读者吓跑。

22.利用好空白

尽管把网页的每寸空间都填满这个想法十分诱人，但事实上让网站留出部分剩余更为不错。网站的过量信息会把用户淹没，同时他们也会忘记所提供的大部分的内容。所以保持网页的简洁，给读者预留出一些视觉空间来供读者休息。

23.放置于网页顶部，导航工具的作用将更好的发挥

理想情况下，你不会满足于当读者打开你的网站时仅浏览初始页，而是希望他们浏览翻阅，察看其它感兴趣的内容。将导航器置于网页顶部，就可以让用户通过使用这个工具轻松的找到所需的目标内容。

刚刚完成一个网站的制作，这次做了三个模板，最后客户选择了第三个，因为第三个确实最漂亮，其实我最喜欢的是第二个，简洁、大方。不过这次也遇到个值得注意到问题，就是IE5，本来做好了给客户看，IE6、IE7、firefox都完美显示的，但客户讲在一个老电脑上看不正常，一问才知道，那台电脑是IE5。。看来还是有一部分人用IE5的，以后做模板也加上IE5的支持好了。不过页面加的Ajax代码IE5报错，比较郁闷。。

现在正在尝试用thooe浏览器来接替maxthon，傲游假死太严重了。之前还过的去，自从用这台AMD双核的，傲游假死的就极其贫乏了。双核补丁全部都打上了，还是不行。只可惜thooe插件太少了。不过值得高兴的是这台电脑玩游戏很爽，AMD双核+SATA硬盘+1G内存也还算不错了吧，只可惜显卡是ATI的，感觉没Nvidia的好。

刚才去其他博客转转，发现有两个友情链接又被删了。无所谓了，我现在对那些什么PR，什么收录，不那么在乎了，反正只是自己的博客，何必每天为追求流量而更新，记录对自己有用的就ok了。哎，不多讲了。。走自己的路，让别人打的去吧。。

最近心中有很多想法，没太多时间去实现，当然也包括过完年后依然有点懒惰的因素。:
送上《神曲》里一段不错的话:
克服惰性,因为坐在绒垫上或者睡在被子里,是不会成名的;默默无闻地虚度一生,人在世上留下的痕迹,就如同空中的烟雾,水上的泡沫一样.

唉，可怕的广告达人可能又要注意这里了。。不过发AD也没用，评论要我审核才可以看到的。。

http://www.fantxi.com/error/404.html

都2008年了，2007年答应别人的事情还没做完呢，实在是抱歉！

不知道用来干什么，反正支付宝还有点钱，感觉这个名字还不错就买下来了。