Lonny's profile笨笨狗狗PhotosBlogListsMore  |  Tools Help |
笨笨狗狗在无意义中创造出意义 |
|||||||||
|
4/11/2009 十个简单好用的设计技巧原文作者：Mark Praschan 复杂的设计技巧总是很花时间，也实在是....复杂 （-_-||）。 高级效果 为设计增色不少，但如果用得不对，只会影响用户对重点内容的关注。高级效果可能正好是一项好的设计的冲击力所在，但即便如此，也还是需要一些更简单的效果与其配合。 简单的效果和技巧是建造当今设计的基石。比方说，如果你都不知道如何正确选择颜色和文字效果，灿烂的 星光效果又能有什么用？ 本着“少就是多”的理念，我们为你精选了十个简单好用的设计技巧 ，它们能大大提升你设计的专业性和感染力。 更多技巧可参阅(英文)：
基础先行。 学会走之前要先学会爬，让我们从最基础的简单有效设计的概念开始。 1. 增加对比很可惜，添加额外的对比是最被忽视和弃用的技巧之一。
Joost de Valk 采用了细的高对比度边线，让访客能更容易区分页面的不同区域。在上图中放大了的部分，你可以看到，大多数时候这种对比只是一条1像素的高亮线挨着1像素的暗线。 话说回来，这个页面上的“More”和“Go”按钮与周围的对比度太小，即使你刻意在找也很容易被忽略掉。
WordPress 为页面中最受欢迎的链接 “Download(下载)” 使用了对比色。 这种红色在冷灰色调的页面中自己跳了出来。但这红色在明度方面有所收敛，避免了影响页面整体效果。 如果你对于该不该使用对比犹豫不决，就把这一决定过程当做是化妆。你要做的不是让人们大吼“看呐，对比色！”，你需要的是自然而然的吸引他们注意页面中重要的内容，高亮出已经存在的重点。 2. 渐变技术的发展为所有想使用渐变的人提供了各种创造渐变的工具。但渐变真的很好么？
Media Temple 网站的每一个页面都使用了渐变，不过其渐变使用的节制和精妙才是设计成功的关键。logo，大标题，按钮和背景都有细微的或者镜像的渐变，以强调内容。最 复杂的渐变用在了那些简单的120像素宽的按钮(子页面中的“ACTIVATE”和“LEARN MORE”)上，因为它们是需要访客注意的重点。
Commission Junction的渐变运用远没有Media Temple的细致，而且采用了过于丰富的渐变类型：
这种设计有点冒险，大部分渐变式有用的，但还是存在一些问题。最突出的一点是，设计丧失了一致性。同选择可辨性强的色彩组合一样的道理，设计师也需要为每个项目选择合适的渐变组合。 例如，大的水平渐变(1)引导眼睛横向注视页面。这本没有什么问题，但就在此渐变的正下方又出现了把视线吸引到中心的径向渐变(2)和把视线引导到右下角的斜向渐变(3)。这会给访客造成困扰，起伏变化的视觉流（visual flow）也削弱了可读性。 使用渐变时，保证好的视觉流很重要：请保守而精致地使用渐变。最重要的一点，仅当对整体设计有帮助时才使用渐变。 3. 色彩合理使用颜色很有挑战性。在挑选完美的色彩组合和为各种色调找到合适位置的过程中，时间哗啦啦地就流走了。
Realmac Software 大胆地在404页面采用了全色系渐变。这样做有以下原因：首先，Realmac已经将页面背景设成了中性灰色，更重要的是，页面其余部分没有明显的色彩的，除了蓝色的文字链接和一些零星的毫无冲击力的色彩。 全谱色彩渐变完美地吸引了人们的注意。它保持了简单性，有着灰色的配合，也不会让眼睛感到不适。但在一项设计中采用四种或五种以上的颜色通常都显得太过了。除非你非常确信你的设计需要那么多颜色，还是采用简单的四色组合比较好。
当你在设计中克制而明智地使用色彩时，吸引访客对重要项目的注意力就变得相当容易。在 Interspire的 “About Us（关于我们）” 页面中，访客的注意力被迅速吸引到页面顶部LOGO那红色的一点上，然后是标题，然后是页面右边的LOGO照片。 在字体上花点功夫。字体的艺术博大精深，远远超出我们大部分人的想象。字体中超出x高度部分（ascenders ）和边位（side bearings）处的创作空间巨大，你可以在此处添加一些有趣的细节。不过还是运用接下来的一些技巧更重要。 4. 字符间距字符间距，或者称为字距调整 (kerning)，能对标题、段落、logo等文字相关内容造成巨大影响。其远不止每个字符之间的距离那么简单。
Krop’s 的新作品集创建器，在处理文字的时候，十分吝啬空间。该网站上大部分基于文字的图片中的字符间距都很小，使叙述内容显得更为简洁有力。
上图表现了字符间距对你的设计可能产生的负面影响。小而无抗锯齿的字体如果没有适当的字符间距，将更加难以阅读。 如果你以前没有在意，试试现在对你设计中的字符间距做一些调整，你会为调整后带来的不同而震惊。推荐图片中使用“Myriad Pro” 字体，HTML文字中使用“Trebuchet MS”字体进行尝试。 5. 大小写改变字母大小写不过是按一下Shift或者Caps Lock键的功夫，但很少有设计师好好利用了这一技巧的潜能。
MSNBC’s 对大小写的使用很值得参考。logo是全小写的，页面其他部分的字体大小写更有着微妙的变化。页面上方的大横幅通告，一般用大写字母写着“WATCH LIVE（观看直播）”或者 “BREAKING NEWS（最新消息）” 。这些通告都是非常重要的内容，这种方式很好地吸引了访客的注意。 另外，采用纯大写的按钮，让他们的小按钮足够清楚易读。 在这种5像素高的应用里，小写字母，如a, m, x，可能只有2到3像素高，非常难以辨认。
继续关注新闻站点， CNN 在字体大小写上缺少变化来平衡页面。导航条是全部大写的，但页面中的其余部分则很传统地几乎全部采用了首字母大写。 6. 消锯齿虽然技术上比较复杂，消锯齿仍可以归纳为“使边缘平滑”，在各种设计中都有运用到。在Web设计的世界里，是否消锯齿部分决定于文字是要出现在图片 还是HTML文字中。另有一个让事情变得复杂的情况，部分浏览器或操作系统会自动在一定程度上消锯齿，但总的来说，HTML文字是不具有抗锯齿功能的。
Stockxpert 非常聪明地在广告页面中部分使用消锯齿，而部分文字不消锯齿。大部分文字都有平滑边缘，但页面顶部和底部的小字则保留了锯齿。同上面说的MSNBC按钮一个道理，5像素高的文字需要有尽量锐利的边缘来保持可读性。这种情况中的模糊或平滑边缘会让眼睛很累，最终放弃阅读。 混搭是王道！ 完美的东西一般都显得很假或者乏味。树木的枝叶并不完全对称；任何形式的照明都不会产生平衡的影子；照相机镜头有时会让部分景物模糊，以及产生镜头光晕…… 有些设计需要干净的人造风格，另一些则需要混搭一点~ 7. 制造瑕疵任何人都能在使用一台电脑十分钟后告诉你它并不完美。但在设计过程中，电脑可以为你创造完美的结果。在你最喜欢的设计工具中使用直线工具时，只需要采用默认设置，你就能画出特定两点间的完美直线。
这个怀旧Ace牌的教程提供了很多步骤来让这张牌看起来不完美。不得不说，这一过程并不简单。不过其中的概念十分简单——让事物显得老旧，创造不完美，给你的作品以独特的肌理。
这张蝴蝶照片看起来就像是20世纪中期拍摄的，另一个不完美的例子。其实它是用数码相机拍摄的，使用了一些滤镜和颜色调整，赋予其怀旧效果。 为设计创造艺术风格化的瑕疵比你想象中要容易。你只需要将素材变成灰色或褐色，再添加一点细节…… 8. 模糊如果你还在为如何让内容突出、消隐而一筹莫展，请试试各种不同的模糊方式。通过模糊前景、模糊背景，甚至整个设计，你可以动态地增加你的项目的冲击力。模糊的焦点，需要至少部分地相关联。通过模糊一个元素，焦点被带向另一内容。
Ios V2 壁纸使用简单的模糊创造平静的、生机勃勃的感官。一些明锐的线条用来形成图像的焦点，而模糊的背景对于壁纸的整体效果至关重要。
模糊亦可形成深度和层次覆盖的感觉。 Windows Vista的Aero效果将窗口后面的内容模糊掉，形成很酷的漫反射玻璃效果。使用高斯模糊 即可创造类似效果。 9. 对齐即使我们强调保证整洁和直线，你仍然有需要为你的设计添加一些额外趣味。
这个示例标志中的“logo”几个字母被提到了右上角。更改设计元素的对齐方式可以让它们更容易被记住，更容易被人们讨论起，结果是让整个设计更高效。 这一技巧并不只是用于文字。部分设计师在思考一项设计概念时会利用模板化内容或者个人工作习惯。这可以加快给客户回应的速度，但也经常会限制了创意——尤其是在内容对齐方面。
Icon Designer通过旋转某些元素让自己与众不同。这一页面很容易成为稀松平常的无聊之作，但简单的几个旋转让它趣味十足。 现在的网页大部分是700到900像素宽，一般在浏览器中居中，并且是方盒子式的构造。大部分案例中，这样做使内容安排有序，但也有一些站点，需要设计师考虑跳出盒子，创造特色。 接下来，最重要的是… 10. 消除累赘这可能是最重要也最被忽视的设计技巧了。去掉不必要的部分，也是最难做的部分之一。
通过去掉所有不必要的部分， CSS Remix只留下了必要部分，可以同时展示7个大广告 (128 * 96 像素),，53个favico广告 (16 *16 像素) ，以及一大群网站（56个）——全部在页面上方1000像素内！甚至网站的logo都被削减到了53乘 7 像素。 生活中也是如此，好事做得太好就不是一件好事了。上面的logo太小以至于难以辨认，特色站点也难以同彼此区分开来。奇怪的是，页面顶部的Twitter feed，相对于站点logo和导航来，又过分突出。 关于作者Mark Praschan是一位具有将近十年经验的网页设计师，Web开发师，Web项目经理人。 他拥有并负责运行Arrival Media . You can follow Mark on Twitter as well. 4/10/2009 程序员的八种境界原文作者：Jeff Atwood 是否曾有人问过你那道经典的面试题“你未来5年里打算做些什么？”，当别人问我这道题时，我的思绪总是情不自禁地把我带回到“扭曲姐妹”乐队1984年发行的某个MTV中（译注1）。 我要你告诉我——不，你最好站起来，告诉班里的所有人——
你当然是想唱摇滚！或者……至少做个摇滚程序员（译注2）。这不是那种需要严肃回答的问题——有点像另一道老掉牙的雷人面试题一样，“你的最大缺点是什么？”，你的最大缺点就是偶尔摇滚摇得太疯狂，对吧？无辜路人都会被你撞伤。 但我认为不该如此，我们应该以认真严谨的态度，深思熟虑之后再回答它。不是为面试官，而是为我们自己。 “你未来5年里打算做些什么？”，这貌似不难回答，许多人都能不假思索地说出答案。但我们应该再想得长远些：对软件开发者来说，有哪些职业发展道路是走得通的？诚然，我们干这行是因为热爱它，而且在这行里发展得还不错，可是你能一直干到50、60岁吗？对于那些渴望成为程序员的……程序员来说，怎么发展才是最好的呢？ 要是我告诉你程序员有八种境界，你会怎么想？呵呵，可别太较真。
这八种境界说来带有几分调侃。没有哪个程序员喜欢以按图索骥的方式来规划职业。但是想想一个程序员在10年、20年、30年、甚至一生之中到底能达到何种境界，这无疑是具有启发性的。你最崇拜的是哪些知名程序员？在他们所达到的境界中，哪些特征吸引你崇拜？ 简而言之，你这辈子打算做些什么？
4/6/2009 10 skills developers will need in the next five years原文作者：Justin James 由
于最近经济形势的变化，很多开发人员只关注他们短期的工作前景。与此同时，把时间和精力花在学习最能带来回报的新技术上是件非常重要的事情。这里是我们列
举的10种你需要马上开始学习的技术，让你的简历在未来5年不会落伍。这个列表并不完全，有很多业界的领域（比如大型机开发人员）没有涉及。尽管如此，对
通常的主流开发来说，学习其中至少7项技能肯定不会错 ——不但要达到能在面试时侃侃而谈的程度，还得能在工作中运用自如。
1: “三大”之一 (.NET, Java, PHP)除非开发世界有根本的改变（类似小行星击中雷德蒙），在不远的将来，大部分开发人员将需要了解三大开发系统——.NET (VB.NET或者C#), Java, 或者PHP——中的至少一个。并且只了解核心语言也是不够的。因为项目会包含越来越多不同的功能，你需要对相关框架和库有深入的了解。
2: 丰富互联网应用 (RIAs)不管爱她还是恨她，最近几年，Flash的用途突然间不仅仅是制作政治人物弱智歌曲演唱动画而已了。Flash也萌生出了以Flex和AIR为形式 的附加功能。Flash的竞争对手，比如JavaFx和Silverlight，也在不停的在特性和性能上加筹码。HTML5集成了所有RIA的功能，包 括数据库连接和把正式的W3C印章加到AJAX（译者：这个地方拿不准）。在不久的将来，RIA专家将会是简历的一个重要筛选条件。
3: Web开发Web开发在近期内不会消失。很多开发人员满足于忽略Web或者只是使用他们的框架给他们提供的"基本元素"。但是公司需要越来越多的真正知道怎样使用底层技术进行“手工编码”的人。所以要获得成功请在未来5年里努力钻研JavaScript，CSS和HTML。
4: Web服务REST或者SOAP? JSON或者XML? 尽管选项和答案取决于项目本身，不使用或者创建Web服务对一个开发人员（甚至是那些不做Web应用程序的）来说越来越困难。那些原来采用 ODBC，COM或者RPC domains的领域，现在也在某种程度上过渡到了Web服务。不会用Web服务的开发人员将会发现他们被排挤或者沦为维护人员。
5: 软技能有一种已经开始了很久的趋势，IT在企业内部或者外部变得越来越透明。开发人员被卷入越来越多的非开发性会议和过程以给与反馈。举个例子，CFO要 改变会计规则不能不依靠IT去更新系统。如果没有IT去升级CRM的工作流，运营经理就不能更改呼叫中心的流程。同样的，客户常常需要和开发小组一起工作 来保证他们的需求被满足。每一个开发人员都需要找主持人帮助或者去学习《怎样结交朋友并影响别人》么？不是。但是拥有这种能力的开发人员对他们的雇主来说 更有价值——并且更抢手。
6: 一种动态的和/或者函数编程语言像Ruby，Python, F#, 和Groovy这样的语言并不很主流——但是他们包含的想法却是。比如说，微软的.NET中的LINO系统是函数编程技术的直接产物。Ruby和 Python在某些部门很热门，分别感谢Rails框架和Silverlight。学习其中的一门语言不只会提升你的简历；它能开阔你的视野。我见过的每 一个顶级开发人员都推荐学习至少一种动态或者函数编程语言，用来理解新的思考方式，个人经验来讲，我可以告诉你确实有用。
7: 敏捷开发方法在敏捷开发方法刚开始进入主流视线的时候，我持怀疑态度，和其他我认识的很多家伙一样。它看起来就像某种对传统的下意识反应，丢掉控制和标准而偏爱 混乱。但是随着时间的推移，敏捷开发背后的智慧被更好的定义和表达出来。很多团队不是应用了敏捷开发就是在进行敏捷开发的概念证明实验。尽管敏捷开发不是 治愈项目失败的终极灵药，它的确在很多项目上有一席之地。在未来几年里，对有着敏捷开发环境的理解和成功经验的开发人员的需求将会高速增涨。
8: 领域知识和敏捷开发密切关联，开发小组在项目定义中被越来越多的看做是同伴。这意味着了解问题领域的开发人员能够用更可见的，高价值的方式给项目作出贡献。 敏捷开发中，一个能够说，“从这里，我们也可以很简单的添加这项功能，而且这能给我们带来很多回报，” 或者 “噢，这个要求和我们的日志中显示的使用模式并不相符” 的人将是优胜者。正如许多开发人员有抵制了解问题领域的想法，不可否认的是越来越多的组织希望（如果不是要求）开发人员至少能理解基本的内容。
9: “清洁”开发几年之前，很多（如果不是大部分）团队都没有使用bug跟踪系统，版本控制，和其他类似工具；只有开发人员和他们选择的IDE。但是，感谢新的整合 套件的开发，比如Microsoft Visual Studio Team System以及高质量开源环境的爆炸性发展，没用到这些工具的组织变得更不常见。开发人员必须比知道怎么在代码控制中提交和获得代码或者怎样用VM系统 配置测试环境了解更多的东西。他们需要在适当的地方养成严格的卫生习惯以保证他们和其他的小组恰当的合作。“代码牛仔”，把所有的东西存放在私人USB盘 上，不把对任务对象的相应改变记录成文档，等等的人，在传统的团队里不受欢迎，在需要团队成员之间紧密合作的敏捷开发环境中更是如此。
10: 手机开发上世纪90年末代web开发被主流接受开始在很多领域将传统的桌面程序边缘化，在2008年，手机开发开始兴起，在未来5年里，它将会变得越来越重 要。当然，手机开发有很多不同的方法:针对手机设备的web应用程序开发，针对市场的RIAs，和直接在设备上运行的应用程序。不管你选择了哪个方向，把 手机开发加入你的技能集会保证你满足未来的需求。 2/1/2009 JS常用正则1、 非负整数：”^d+$” 2、 正整数：”^[0-9]*[1-9][0-9]*$” 3、 非正整数：”^((-d+)|(0+))$” 4、 负整数：”^-[0-9]*[1-9][0-9]*$” 5、 整数：”^-?d+$” 6、 非负浮点数：”^d+(.d+)?$” 7、 正浮点数：”^((0-9)+.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*.[0-9]+)|([0-9]*[1-9][0-9]*))$” 8、 非正浮点数：”^((-d+.d+)?)|(0+(.0+)?))$” 9、 负浮点数：”^(-((正浮点数正则式)))$” 10、英文字符串：”^[A-Za-z]+$” 11、英文大写串：”^[A-Z]+$” 12、英文小写串：”^[a-z]+$” 13、英文字符数字串：”^[A-Za-z0-9]+$” 14、英数字加下划线串：”^w+$” 15、E-mail地址：”^[w-]+(.[w-]+)*@[w-]+(.[w-]+)+$” 16、URL：”^[a-zA-Z]+://(w+(-w+)*)(.(w+(-w+)*))*(?s*)?$” 17、匹配中文字符的正则表达式： [\u4e00-\u9fa5] 18、匹配双字节字符(包括汉字在内)：[^\x00-\xff] 19、匹配HTML标记的正则表达式：/<(.*)>.*<\/\1>|<(.*) \/>/ 20、匹配国内电话号码：\d{3}-\d{8}|\d{4}-\d{7} 21、匹配中国邮政编码：[1-9]\d{5}(?!\d) 22、匹配身份证：\d{15}|\d{18} 1/8/2009 Linux下SVN提交时强制写日志进入仓库project/hooks目录，找到pre-commit.tmpl文件，重命名为pre-commit。 |
||||||||
Send a private message
Tell a friend
Add to My MSN
Add to your network
Sign up for alerts
|
|
