by ·2 Comments

COMSHARP CMS 写道：今天读到一篇文章，介绍了15个对 Web 设计与开发师极端有用的站点，里面有不少也是我们一直在使用的，也许对很多人都有用，翻译出来以饷同仁。

ColorCombos

配色是 Web 设计的首要大事，Color Combos 帮你预备了数千种配色方案，可以根据色调浏览选取。

LIpsum

Lorem Ipsum Text 是一中自造的，字典中不存在的单词，是在演示页面结构的时候，需要加文字的地方使用 Lorem Ipsum Text 填充可以避免用户因关注文字的意思而分神。Lipsum.com 可以帮你生成制定数目的 Lorem Ipsum 单词。

What the font?

有时候你对某个 Logo 感兴趣，想知道是拿什么字体做的，可以将 Logo 图片上传到这个网站，结果之准确会让你难以置信。

ConvertIcon

Favicon 越来越受欢迎，尤其随着 Firefox 的流行，Firefox 会将你站点的 Favicon 标志显示在标签上，也会显示于书签，Favicon 支持多种图形格式，比如 png，但 IE 并不支持 png，该站点可以帮助你将 png 等图片格式的 Favicon 转换成 IE 支持的 ico 格式。

BgPatterns

现代 Web 设计的趋势之一包括使用背景图案，BgPatterns.com 可以帮你设计背景图案，他们有大量可选的图案，可以按不同方式接合，还可以设置透明度。

HTML Encoder

如果你要在网站中显示 Web 代码，那将是非常烦人的事，你必须将诸如 < 一类的符号用编码表示，这个网站可以帮你做这些事情，只需将你的代码复制进去，他们会帮你生成可以直接使用的代码。还有 HTML Decoder 帮你做相反的事。

Xenocode Browsers

该网站非常有用，可以直接在站点中预览你的网站在 IE6， IE7， IE8， Firefox 2， Firefox 3， Google Chrome 以及 Opera 中的样子。唯一的不足是，不支持 Mac 和 Linux 环境下的浏览器。

Test Everything

这个网站包含了超过 100 中工具帮你测试几乎所有东西，如跨浏览器兼容，查 PR 值，甚至帮你验证代码。

Sprite Generator

CSS Sprites 在显著降低 HTTP 请求方面功不可没，但 CSS sprite 可不是个简单的技术，Sprite generator 可以帮你做这些繁复的工作，将你的图片打包成 zip 上传上去，他们会把你的图片组合成 sprite，还帮你生成 CSS 代码。

Buttonator

这个网站可以帮你设计漂亮的按钮。

Load Impact

这个压力测试站点可以帮你测试你的站点的抗压能力，如果你的某篇文章曾经上过 Digg 或 StumbleUpon 等网站的首页，你就会知道抗压测试多么重要。

IconFinder

这个网站收藏了大量来自网络的免费图标。

TypeTester

该站点可以帮你测试不同字体的显示效果。

CSS Tidy

这个站点可以帮你检查 CSS 代码，并修正其中的错误，比如，它可以发现你的 CSS 代码中最常见到重复设置问题。

Contact Forms Generators

自定义表单可以帮助你实现同访问者的互动，无需编程，就能快速生成访客反馈表单，甚至帮你生成邮件发送 PHP， ASP， Perl 代码。

文章来源 http://www.javaeye.com/news/9084

by ·1 Comment

本文列举Jeff Johnson:《GUI设计禁忌》一书中提及的明确针对Web设计和笔者认为对Web设计有参考意义的设计原则和禁忌。设计Web项目时尽量参考一下基本原则，避免设计禁忌，应该能使Web项目的GUI上一个层次。

基本原则：

1、关注用户及其任务，而不是技术

2、首先考虑功能，然后才是表示

3、从用户的视角看问题，使用用户的词汇进行描述

4、不要向用户暴露实现细节

5、使常用的用户任务简单化，不要让用户解决额外的问题

6、保持一致性，引导用户的使用习惯

7、保持显示惯性，传递信息，而不仅仅是数据

8、设计应满足响应需求

禁忌：

1、同一页面包含重复功能的链接或按钮

2、将复选框用作单选按钮

3、无初始值的多选一设置

4、在非开/关设置中使用复选框

5、用文本框显示只读数据

6、单选按钮之间间隔太大

7、属性标记对齐方式不一致

8、当前无效的控件不充分置灰

9、显示对用户无意义的错误提示

10、不同的类型页面窗口显示相同的标题

11、窗口的标题和调用的命令不一致

12、要求用户输入随机数

13、相似的功能却有不一致的用户操作界面

14、取消按钮无法真正取消操作

15、网站结构反映公司的结构或网站升级的历史

16、返回按钮不能达到预期的目的

17、搜索选项过多，过度复杂

18、使用容易被忽略的隐藏的图片链接

19、需要向下滚动才能看到当前页的重要信息

20、图片按钮对鼠标按下操作没有视觉变化

21、无意义的虚假进度条

22、执行长时间的任务时鼠标指针不显示成忙状态

23、不考虑用户可能的人为的错误输入

24、认为好的UI就是漂亮的UI

25、盲目错误的使用页面模块化设计

by ·0 Comments

人类社会逐步向非物质社会迈进，互联网信息产业已经走入我们的生活。在这样一个非物质社会中，网站与软件这些非物质产品再也不象过去那样紧紧靠技术就能处于不败之地。工业设计开始关注非物质产品。但是在国内依然普遍存在这样一个称呼“美工”。“工”的意思就是没有思想紧紧靠体力工作的人。这是一个很愚昧的做法，愚昧在于称呼职员美工的企业没有意识到界面与交互设计能给他们带来的巨大经济效益，另一方面愚昧在于被称为美工的人不知道自己应该做什么，以为自己的工作就是每天给界面与网站勾边描图。

本文主要讲述一套比较科学的设计流程来讲述UI界面设计属于工业设计的范畴，是一个科学的设计过程，理性的商业运作模式。而不是单纯的美术描边。

UI的本意是user　interface也就是用户与界面的关系。他包括交互设计，用户研究，与界面设计三个部分。本文主要讲述用户研究与界面设计的过程。

一个通用消费类软件界面的设计大体可分为五个步骤：
1需求阶段
2分析设计阶段
3调研验证阶段
4方案改进阶段
5用户验证反馈阶段

需求阶段

软件产品依然属于工业产品的范畴。依然离不开3W的考虑（Who,where,why.）也就是使用者，使用环境，使用方式的需求分析。所以在设计一个软件产品之前我们应该明确什么人用(用户的年龄，性别，爱好，收入，教育程度等)。什么地方用（在办公室/家庭/厂房车间/公共场所）。如何用（鼠标键盘/遥控器/触摸屏）。上面的任何一个元素改变结果都会有相应的改变。

除此之外在需求阶段同类竞争产品也是我们必须了解的。同类产品比我们提前问世，我们要比他作的更好才有存在的价值。那么单纯的从界面美学考虑说哪个好哪个不好是没有一个很客观的评价标准的。我们只能说哪个更合适，更合适于我们的最终用户的就是最好的。如何判定最合适于用户呢，后面我会介绍用户调研。

分析设计阶段

通过分析上面的需求，我们进入设计阶段。也就是方案形成阶段。我们设计出几套不同风格的界面用于被选。首先我们应该制作一个体现用户定位的词语坐标。例如我们为25岁左右的白领男性制作家居娱乐软件。对于这类用户我们分析得到的词汇有：品质，精美，高档，高雅，男性，时尚，cool,，个性，亲和，放松等。分析这些词汇的时候我们会发现有些词是绝对必须体现的，例如：品质，精美，高档，时尚。但有些词是相互矛盾的，必须放弃一些，例如：亲和，放松与cool,个性与等。所以我们画出一个坐标，上面是我们必须用的品质，精美，高档，时尚。左边是贴近用户心理的词汇：亲和，放松，人性化。右边是体现用户外在形象的词汇：cool,个性，工业化。然后我们开始搜集相呼应的图片，放在坐标的不同点上。这样根据不同作标点的风格，我们设计出数套不同风格的界面。

调研验证阶段

几套风格必须保证在同等的设计制作水平上，不能明显看出差异，这样才能得到用户客观的反馈。

测试阶段开始前我们应该对测试的具体细节进行清楚的分析描述。


例如：
数据收集方式：厅堂测试/模拟家居/办公室。
测试时间：X年X月X日X日。
测试区域：北京、广州、天津。
测试对象。某消费软件界定市场用户。主要特征为：
对电脑的硬件配置以及相关的性能指标比较了解，电脑应用水平较高；
电脑使用经历一年以上；
家庭购买电脑时品牌和机型的主要决策者
年龄：X-X岁；
年龄在X岁以上的被访者文化程度为大专及以上；
个人月收入X以上或家庭月收入X元及以上；
样品
五套软件界面
样本量：X个，实际完成X个。


调研阶段需要从以下几个问题出发：
用户对各套方案的第一印象
用户对各套方案的综合印象
用户对各套方案的单独评价
选出最喜欢的
选出其次喜欢的
对各方案的色彩，文字，图形等分别打分。
结论出来以后请所有用户说出最受欢迎方案的优缺点。
所有这些都需要用图形表达出来，直观科学。

方案改进阶段

经过用户调研，我们得到目标用户最喜欢的方案。而且了解到用户为什么喜欢，还有什么遗憾等，这样我们就可以进行下一步修改了。这时候我们可以把精力投入到一个方案上（这里指不能换皮肤的应用软件或游戏的界面）将方案做到细致精美。

用户验证阶段

改正以后的方案，我们可以将他推向市场。但是设计并没有结束。我们还需要用户反馈，好的设计师应该在产品上市以后去站柜台。零距离接触最终用户，看看用户真正使用时的感想。为以后的升级版本积累经验资料。

经过上面设计过程的描述，大家可以清楚的发现，界面UI设计是一个非常科学的推导公式，他有设计师对艺术的理解感悟，但绝对不是仅仅表现设计师个人的绘画。所以我们一再强调这个工作过程是设计过程。UI界面设计不存在美工。

by ·0 Comments

终有一天我想成为这样一个人，平凡又平凡不过的人。突然感觉自己有点累，我这个年纪的人，本不应该说出累的话，不过现实如此，有的人偏偏可以不做任何事情，就吃好穿好，过上上等人的生活，而偏偏有些人注定要一辈子穷困潦倒，我不相信这是什么命运，完全是不作为造成的。向往一个公平公正的境界。但就如比尔所言，这个世界本来就是不公平的。不要像别人乞讨帮助，也不要指望别人对自己负责，过好自己的每一天，对自己的每一句话，每一份工作保证做到自己的做好的水品，就是对自己负责。或者这才是人生获得精彩的源泉。

by ·0 Comments

说实在的，常常都听见很多人拿这两个东西比来比去，其实这两个东西没啥可比性。两个都是优秀的前端开发框架。Jquery 的插件比PROTOTYPE多得多了，可是PROTOTYPE并不是一个逊色的框架，对于基础与底层函数的扩招，貌似要做的更好一些。选择的时候，还是需要根据自己的需求来做衡量。

by ·1 Comment


log4j.rootLogger=DEBUG,CONSOLE,A1,im
log4j.addivity.org.apache=true

# 应用于控制台

log4j.appender.CONSOLE=org.apache.log4j.ConsoleAppender
log4j.appender.Threshold=DEBUG
log4j.appender.CONSOLE.Target=System.out
log4j.appender.CONSOLE.layout=org.apache.log4j.PatternLayout
log4j.appender.CONSOLE.layout.ConversionPattern=[framework] %d - %c -%-4r [%t] %-5p %c %x - %m%n
#log4j.appender.CONSOLE.layout.ConversionPattern=[start]%d{DATE}[DATE]%n%p[PRIORITY]%n%x[NDC]%n%t[THREAD] n%c[CATEGORY]%n%m[MESSAGE]%n%n

#应用于文件

log4j.appender.FILE=org.apache.log4j.FileAppender
log4j.appender.FILE.File=file.log
log4j.appender.FILE.Append=false
log4j.appender.FILE.layout=org.apache.log4j.PatternLayout
log4j.appender.FILE.layout.ConversionPattern=[framework] %d - %c -%-4r [%t] %-5p %c %x - %m%n
# Use this layout for LogFactor 5 analysis

# 应用于文件回滚

log4j.appender.ROLLING_FILE=org.apache.log4j.RollingFileAppender
log4j.appender.ROLLING_FILE.Threshold=ERROR
log4j.appender.ROLLING_FILE.File=rolling.log
log4j.appender.ROLLING_FILE.Append=true
log4j.appender.ROLLING_FILE.MaxFileSize=10KB
log4j.appender.ROLLING_FILE.MaxBackupIndex=1
log4j.appender.ROLLING_FILE.layout=org.apache.log4j.PatternLayout
log4j.appender.ROLLING_FILE.layout.ConversionPattern=[framework] %d - %c -%-4r [%t] %-5p %c %x - %m%n

#应用于socket
log4j.appender.SOCKET=org.apache.log4j.RollingFileAppender
log4j.appender.SOCKET.RemoteHost=localhost
log4j.appender.SOCKET.Port=5001
log4j.appender.SOCKET.LocationInfo=true
# Set up for Log Facter 5
log4j.appender.SOCKET.layout=org.apache.log4j.PatternLayout
log4j.appender.SOCET.layout.ConversionPattern=[start]%d{DATE}[DATE]%n%p[PRIORITY]%n%x[NDC]%n%t[THREAD]%n%c[CATEGORY]%n%m[MESSAGE]%n%n

# Log Factor 5 Appender
log4j.appender.LF5_APPENDER=org.apache.log4j.lf5.LF5Appender
log4j.appender.LF5_APPENDER.MaxNumberOfRecords=2000

# 发送日志给邮件

log4j.appender.MAIL=org.apache.log4j.net.SMTPAppender
log4j.appender.MAIL.Threshold=FATAL
log4j.appender.MAIL.BufferSize=10
[email protected]
log4j.appender.MAIL.SMTPHost=www.wusetu.com
log4j.appender.MAIL.Subject=Log4J Message
[email protected]
log4j.appender.MAIL.layout=org.apache.log4j.PatternLayout
log4j.appender.MAIL.layout.ConversionPattern=[framework] %d - %c -%-4r [%t] %-5p %c %x - %m%n

# 用于数据库
log4j.appender.DATABASE=org.apache.log4j.jdbc.JDBCAppender
log4j.appender.DATABASE.URL=jdbc:mysql://localhost:3306/test
log4j.appender.DATABASE.driver=com.mysql.jdbc.Driver
log4j.appender.DATABASE.user=root
log4j.appender.DATABASE.password=
log4j.appender.DATABASE.sql=INSERT INTO LOG4J (Message) VALUES ('[framework] %d - %c -%-4r [%t] %-5p %c %x - %m%n')
log4j.appender.DATABASE.layout=org.apache.log4j.PatternLayout
log4j.appender.DATABASE.layout.ConversionPattern=[framework] %d - %c -%-4r [%t] %-5p %c %x - %m%n

log4j.appender.A1=org.apache.log4j.DailyRollingFileAppender
log4j.appender.A1.File=SampleMessages.log4j
log4j.appender.A1.DatePattern=yyyyMMdd-HH'.log4j'
log4j.appender.A1.layout=org.apache.log4j.xml.XMLLayout

#自定义Appender

log4j.appender.im = net.cybercorlin.util.logger.appender.IMAppender

log4j.appender.im.host = mail.cybercorlin.net
log4j.appender.im.username = username
log4j.appender.im.password = password
log4j.appender.im.recipient = [email protected]

log4j.appender.im.layout=org.apache.log4j.PatternLayout
log4j.appender.im.layout.ConversionPattern =[framework] %d - %c -%-4r [%t] %-5p %c %x - %m%n

by ·4 Comments
  1. <!DOCTYPE html PUBLIC 「-//W3C//DTD XHTML 1.1//EN」 「http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd」>
  2. <html xmlns=「http://www.w3.org/1999/xhtml」>
  3. <head>
  4. <meta http-equiv=「Content-Type」 content=「text/html; charset=utf-8」 />
  5. <title>demo</title>
  6. <style type=「text/css」>
  7. *{
  8. margin:0 0;
  9. padding:0 0;
  10. }
  11. #outDemo{
  12. overflow:hidden;
  13. width:200px;
  14. border:2px solid #e0e0e0;
  15. padding:2px;
  16. }
  17. #outDemo div{
  18. float:left;
  19. padding:1px;
  20. }
  21. #innDemo{
  22. white-space:nowrap;
  23. }
  24. img{
  25. border:0px solid #fff;
  26. }
  27. </style>
  28. <script type=「text/javascript」>
  29. window.onload = function(){
  30. var demo = document.getElementById(「outDemo」);
  31. var demo1 = document.getElementById(「innDemo」);
  32. demo1.innerHTML += demo1.innerHTML;
  33. function move(){
  34. demo.scrollLeft = demo.scrollLeft==240?demo.scrollLeft=1:demo.scrollLeft+1;
  35. }
  36. function go(){
  37. setInterval(move,20);
  38. }
  39. go();
  40. }
  41. </script>
  42. </head>
  43. <body>
  44. <div id=『outDemo』>
  45. <div id=『innDemo』>
  46. <a href=『javascript:;』><img src=「images/apple439.PNG」 alt=「apple439.PNG」 width=「111px」 /></a>
  47. <a href=『javascript:;』><img src=「images/apple440.PNG」 alt=「apple440.PNG」 width=「111px」 /></a>
  48. </div>
  49. </div>
  50. </body>
  51. </html>

by ·3 Comments

image/bmp BMP
image/gif GIF
image/jpeg JPEG
image/tiff TIFF
image/x-dcx DCX
image/x-pcx PCX
text/html HTML
text/plain TXT
text/xml XML
application/afp AFP
application/pdf PDF
application/rtf RTF
application/msword MSWORD
application/vnd.ms-excel MSEXCEL
application/vnd.ms-powerpoint MSPOWERPOINT
application/wordperfect5.1 WORDPERFECT
application/vnd.lotus-wordpro WORDPRO
application/vnd.visio VISIO
application/vnd.framemaker FRAMEMAKER
application/vnd.lotus-1-2-3 LOTUS123
application/octet-stream 信息流

by ·0 Comments

据报道，英国首相布朗近日代表英国政府正式向计算机科学之父图灵道歉。1952年，图灵因英国政府对同性恋的偏见遭受了不人道的待遇，两年后因为食用了氰化物溶液浸泡过的苹果而死亡。

这次为图灵平反的活动由计算机科学家John Graham-Cumming发起，签名者超过了3万人，民众的请愿也迫使英国首相出来公开道歉。

布朗在道歉声明中表示：“图灵是名伟大的数学家，最著名佐证的莫过于他在二战时期破解德国的著名密码系统Enigma，再多的溢美之词也不为过。没 有他的杰出贡献，二战的历史将会重写，他是扭转战争走势的关键人物。然而，他在1952年却遭受了极不人道的待遇，进行了化学注射，两年后辞别人世。”

“今天成千上万的人聚集在一起为图灵平反，要求承认当时的行为是错误的。尽管当时的判罚是依照法律进行的，时光也不能倒流，但图灵遭受的对待是不公平的，今天我非常有幸能够为这一切表达歉意，图灵和其它因同性恋而被定罪的人遭受了不公正待遇。”

布朗最后说：“谢谢图灵所做的一切，我们十分抱歉，他不该受到这种对待。”

和其它智慧超群的人一样，图灵的生活方式也“与众不同”。他是名同性恋，但当时人们对同性恋还没有像现在这样宽容，而是把这种行为看作是伤风败俗的事，图灵也因此遭到了命运的捉弄。

附：图灵之死

1951年，图灵以他杰出的贡献被当选为英国皇家学会会员。就在他事业步入辉煌之际，灾难降 临了。1952年，图灵遭到警方拘捕，原因是他是一个同性恋者。与其他一些智慧超群的人物一样，图灵在个人生活方式上也“与众不同”。当时，人们对同性恋 还没有像现在这样宽容，而是把这种行为当作一桩伤风败俗的罪孽。事情的败露是这样的，当时有一位叫琼·克拉克(Joan Clarke)的姑娘爱上了图灵，图灵也对对方很有好感，并向对方求婚，琼欣然接受。但不久，图灵自己退缩了，告诉琼，他是同性恋者。在1948年，图灵 就由于同性恋倾向，离开了当时属于高度保密的英国国家物理实验室(NPL)。但也有人说，图灵是被英国军事情报部门“开除”出去的，对于这位天才的离去， 许多人怅惜不已。

1952年3月31日，图灵更因为和曼彻斯特当地一位青年有染，被警方逮捕。在法庭上，图灵既不否认，也不为自己辨解。在庄严的法庭上，他郑重其事 地告诉人们：他的行为没有错，结果被判有罪。在入狱和治疗两者中间，图灵选择了注射激素，来治疗所谓的“性欲倒错”。此后图灵开始研究生物学、化学，还和 一位心理医生有很深的交往。那时，他的脾气已变得躁怒不安，性格更为阴沉怪僻。1953年3月，他因为接待过一位被英国警方注意的挪威客人，成为警方的目 标，甚至去希腊度假时也被跟踪。

1954年6月8日，图灵42岁，正逢进入他生命中最辉煌的创造顶峰。一天早晨，女管家走进他的卧室，发现台灯还亮着，床头上还有个苹果，只咬了一 小半，图灵沉睡在床上，一切都和往常一样。但这一次，图灵是永远地睡着了，不会再醒来……经过解剖，法医断定是剧毒氰化物致死，那个苹果是在氰化物溶液中 浸泡过的。图灵的母亲则说他是在做化学实验时，不小心沾上的，她的」艾伦」从小就有咬指甲的习惯。但外界的说法是服毒自杀，一代天才就这样走完了人生。

今天，苹果电脑公司以那个咬了一口的苹果作为其商标图案，就是为纪念这位伟大的人工智能领域的先驱者——图灵。

by ·0 Comments

突发奇想的想起了javascript的oo,扩展到设计模式中,貌似没有接口,非常多的设计模式无法实现,比如组合,代理等…于是就写了一份javascript接口实现的demo.代码如下.


/*
* @param {String} name 继承接口的类名.
* @param {Array} methods 类要实现的方法数组.
* 功能说明:构造类方法.
* 中间的所有参数,需要用反射来验证所有参数的正确性.否则就失去意义了.
*/
var Interface = function(className,methodsArray){
if(arguments.length!=2){
throw new Error("实现接口必须要满足2个以上的参数");
}
this.obj = className;
this.methods = [];//实现方法集合,这里定义成一个共有的方便访问.
for(var i=0;i
--------------------------------------------------------------------

window.onload = function(){
var ss = new Object();
ss.sayHellow = function(){

}
ss.run = function(){

}

var ints = new Interface(ss,['sayHellow','run']);
}

虽然实现了,可是还有一些不太理想的地方.
1.比如ss.sayHellow 就只能用 object() new 出来么?如果有人写
Js代码
var ss = function(){};
ss.prototype.sayHellow = function(){
...
}
怎么办???
2.中间的反射检查是否过多过细?会不会有性能方面的问题???
留下这些问题,继续考虑,同时也希望各位大牛给我点意见来优化这个代码.