四维笔记

网页设计之如何使用对齐

小四 — Fri, 05 Feb 2010 01:09:32 +0000

设计新手往往很草率，只有页面上刚好有空间，就会把文本和图片放在那里，而完全不考虑页面上的其他项，这样就会给人一种杂乱无章的感觉，这有点像你的卧室，可能电脑桌上有个烟灰缸，旁边有个咖啡杯，上面放置一大堆的书籍，或者床上放置很多换洗衣服，地上很多垃圾，等待，如果要清理这些应该会花掉不少时间吧。

validation

小四 — Thu, 04 Feb 2010 02:42:53 +0000

woshao_0b68b57e15304692310f227a15143283

设计杂谈之字体

小四 — Tue, 02 Feb 2010 06:26:27 +0000

字体是搭建所有排版页面的基础模块。设计一个页面时，通常需要使用几种不同的字体，而且这绝对是有必要的。不过你知道哪些字体能够有效的一起工作呢？大千世界，万事万物都不是独立存在的，或多或少都会有动态关系，字体亦是如此，一个页面包含很多元素(标题、子标题、作者、日期等等)，如何使之搭配得当，而不是产生冲突呢？

网页设计中如何使用亲密性

小四 — Thu, 28 Jan 2010 04:31:00 +0000

最近朋友买了本 Robin Williams 写的《The Non-Designer‘s Design Book》中文版，本书是关于排版设计，主要是在印刷业产品设计原则，不过我觉得其中很多理论完全可以运用到网页设计中，之前有些过什么是好的用户设计，其中很多原则是一致的。 Robin 的亲密性原则是指：将相关的项组织在一起，移动这些项，使他们的物理位置相互靠近，这样一来，相关的项将被看作凝聚为一体的一个组，而不再是一堆无关的段。

10 Css 小技巧

小四 — Thu, 31 Dec 2009 07:55:04 +0000

1. 网页自动居中 HTML <div id="wrap"> </div> CSS .wrap{width:960px;magin:0 auto;} 2. 固定的页脚固定的页脚(使 footer 用於位于页脚，而不通过绝对定位的方式) HTML <div class="wrap"> <div id="main" class="clearfix" /> </div> <div class="footer" > </div> CSS * { margin:0; padding:0; } html, body, #wrap { height: 100%; } body > #wrap {height: auto; min-height: 100%;} #main { padding-bottom: 150px; } /* must be same height as the footer */ #footer { position: relative; margin-top: -150px; /* negative value of footer height [...]

好习惯培养你的创造力

小四 — Wed, 16 Dec 2009 03:08:19 +0000

1.Think for a half hour a day exclusively on one subject. You can start off by thinking about a single subject for five minutes a day, then increase the period daily until you reach a half hour. 每天花一个小时集中想一件事。开始的时候，你可以每天试着花5分钟，慢慢积累直到1个小时。 2.Write a letter or speak for 15 minutes without using the words I, me, my and mine. 写一封信或者说一段话，不准用“我”，“我们”，“我的”。 3.Have someone doodle [...]

什么是好的用户界面设计?

小四 — Sat, 05 Dec 2009 02:08:43 +0000

The way that you accomplish tasks with a product – what you do and how it responds – that’s the inter face –Jef Rashin. 谈到用户界面设计，现在流行称之为UED，也就是用户体验设计，包括范围更加广泛，何为用户界面设计，正如 Jef 所言，用户界面设计不仅仅是按钮、导航栏、字体、颜色等的设计，重点在于这个功能他能做什么，为用户带来什么利益，这是用户最关心的，这也是为什么现在把UI称之为“UED”，这从字义上让人了解我们设计的是用户体验。接下来谈谈什么是好的UED。清晰，界面设计语言、流程、层次结构、视觉元素来避免歧义产生。清晰的界面不需要操作手册，而且能够帮助用户减少犯错误可能性。简洁，可以通过对每个元素的详细描述来来达到界面清晰的效果，但是这样让界面很臃肿，很多说明元素放在一起，这样要找到你需要的就变得困难起来，这样的界面会让人感到冗长且乏味，如何让界面简洁而清晰，这是设计师的一个重要挑战。相似性,这就是设计与艺术的区别，设计的目的在于让所有人都明白你设计的东西，而艺术常冠之以神秘气息，越晦涩难懂越好。回过头讲设计，所设计的产品要符合人们的常识，比如地球是圆的，你却用一个方形来代表，这样会很难懂。好的设计要做到及时是第一次使用该功能，用户也能够明白的使用，应为你所设计的东西和他常识里某个东西很像，而且使用起来确实也是这样，那你在这方面就做得不错了。响应，这代表一系列动作和事情，首先是速度：好的设计不会感到停顿；其次是给与用户一个良性的回应，让用户知道它的操作时成功了还是失败了。一致性，保持产品设计中界面元素一致性是非常重要的，因为同一个元素你可能会多次使用，如果每次都不一样，你想结果会是怎样，再强调一点这不是艺术，不能像王羲之《兰亭集序》之之。美观，不必要把界面设计的引人入胜来完成用户的操作，你只需要让界面看起来很好，这样用户在操作过程中会更加愉快。让用户高兴一定不是坏事吧！效率，时间就是金钱，好的设计会提供快捷键等来提高用户生产力，毕竟，这对于很多用户来说是重要功能之一，用户总是希望用更少的时间来完成所有的工作。容忍，每个人都会犯错，你的产品如何处理这些错误关系到整个产品的品质。这个动作能重做么？能够恢复删除的文件么？好的产品设计不应该惩罚用户的错误，而是积极的帮助用户解决错误。总结设计用户界面是结合各种因素，总体考量各个特性来完成的，因为他们之前彼此是相关联的，修改一个也许会影响到另外一个。你使用的元素越多，你的用户就需要更多的操作，相反也是一样，不要因为提供太多的额外功能，而让用户对核心功能产生歧义，创建产品是保持简单、漂亮、简洁而清晰，当然根据产品特性的不同可以转移侧重点。

funny time

小四 — Sat, 21 Nov 2009 08:57:38 +0000

笑话一一小孩坐在家门口哭泣，路人问道：“小孩，你怎么哭啊？”小孩抬头说：“我爸爸用铁锤时砸到自己手指了。”路人说：“那也不该你哭啊！”小孩说：“因为我当时笑了！” 笑话二一场紧张激烈的高速追车后，Vlad把车停在路边。“给我一个理由，我就不罚你。” 警官说。 “三个星期前，我妻子抛弃我，跟一个条子跑了，”Vlad解释，“看到你的车，我以为你想把她送回来。”

8 个常见的 IE6 Bug

小四 — Thu, 19 Nov 2009 08:30:41 +0000

IE 虽然已经发布 IE 8，但是在很多公司仍然使用 IE 6 ，比如我们公司有一半左右的同仁使用的是 IE 6，重点是使用 IE6 的基本都是高级主管，所以对设置好 IE6 支持对我们来说是尤为重要，本文就几个常见的 IE bug 进行说明，并修正，供大家参考。 1. 居中设置每一位设计师都会用到居中对其，最简单的方法是设置Margin：0 auto,但是这并不能在 IE6 中生效，看如下代码。 #container{ border: solid 1px #000; background: #777; width: 400px; height: 160px; margin: 30px 0 0 30px; } #element{ background: #95CFEF; border: solid 1px #36F; width: 300px; height: 100px; margin: 30px auto; } 你期望的是这样：但是在 IE6 中的结果却是：出现这种 Bug 的原因是因为在 IE6 中不识别 margin 的 auto 属性，幸运的是这种 bug 很容易纠正。改进在 IE6 中最简单实用的居中对齐方法就是为父元素设置 text-align:center , 并且设置该元素 [...]

如何回答问题

小四 — Thu, 12 Nov 2009 07:06:31 +0000

生活中常常需要回到各种问题，也许你已经掌握了回答问题的技巧，准确来讲，不是技巧是一门学问。如果你还没有掌握！那下面将列出回答问题的一些注意事项

万圣节图片设计

小四 — Mon, 02 Nov 2009 02:38:03 +0000

万恶的南瓜节，没有什么庆祝的在家看看别人设计的东西，呵呵！ Halloween by sandara Halloween by eguana This is Halloween by the-black-rabbit Halloween by hockmen Halloween by Kissmysteffy Halloween 2009 by anmarija3 Haloween witch by lycoris-vampire Flying Pumpkin Advertisements Miller Lite: Halloween Burger King: Veg City, Halloween Party City: HouseOfHalloweenies.com In house ads Honda Fit: Cavernous Universal Studios: Mother Universal Studios: Friends San Fransisco Zoo: Owl San Fransisco Zoo: Koala Articles And Wallpapers Photoshop tutorials – most shocking ever 55+ Amazing Halloween Wallpapers to Charm Up [...]

精美的动画插图

小四 — Mon, 26 Oct 2009 09:17:55 +0000

Fading Dreams of Sakura by cherriuki Sakura by DeEtta Kimi ni aete… by blizztheevilone Barcarolle by Rocktuete Tsukiakari :: for Ten-chan by blizztheevilone Thousand Paper Stars by cherriuki Frontier of love by maxwindy PF Fei Long by UdonCrew New Dream by Rueme over the [...]