写给大家看的web设计书

写给大家看的web设计书

web文体：可读性（readability）在大量文本时用字体Serif；易读性（Legibility）在识别小段文本（导航，列表，符号）用字体sans serif，有时也有更好的可读性。

web文本：文字大小（9-16）;不要大量字体设置为斜体粗体大写手写体等（下划线和斜体只选其一）；避免太长的文本行；文字和背景要足够对比（白色背景的黑色文字最好）；

拼写和语法要正确。

基本的设计原则：对齐(alignment)，亲密性(proximity)，重复(repetition)，对比(contrast)。

对齐：

整个页面都采用一种对齐方式（不用居中），多左对齐； 除非多种对齐方式有增强之效。
水平对齐和垂直对齐同样重要。
去掉槽糕的边框
让文本远离左边界； 长文本要从右边界缩进，以免文字很长；

亲密性：

同样的元素更靠近，不同元素有间距。

如标题和内容要近。

重复：

统一网站风格：相同的导航，颜色，样式，排版， 布局…使之体现同一理念。

对比：

对比要明显，不要畏首畏尾，要截然不同。 突出一个焦点。 背景色不能是暗色，对黑色文字不形成对比。

比如，标题的字体比其他字体大。但网页喜欢用大字体会让人感觉不成熟。 放大一个很重要的图片。

 

 

 

 

设计备忘录：

不良设计备忘录	优秀设计备忘录
背景： 采用默认背景灰色；文本和背景色很难读；   文本： 挤在左边界；对齐方式不一致；不要大量字体设置为斜体粗体大写手写体等；有下划线但不是链接；字体大小适中；   链接： 默认蓝色；有边框；死链接；没下划线；图片作链接显示不是手形光标；   图片： 很大下载时间长；没有alt标签；没有意义花哨的图片；图片边界有锯齿；   表格： 有边框；作为设计元素比如难看大边框；   闪烁和动画： 多个闪烁或动画，没有停止的动画；缺乏重点；   垃圾： 有计数器；垃圾广告；滚动边栏；首页很多获奖图片   导航： 不清晰；复杂；有滚动条；没有身份标示；   框架： 网页中有滚动条；   字体设计： 重要内容没在1024*768内；没有焦点或太多焦点；元素杂乱放置；缺乏对比；不能跨浏览器；	文本： 背景不影响文本；字体大小合适；层次要清晰；文本栏比图书行宽要窄，易于阅读；   导航： 易于理解和使用，慎用框架；连接当前位置；   图片： 按钮不；有alt标签；图片链接都有文本连接；动画会自动结束；   总体设计： 页面很快下载；重要内容在1024*768内；用适当元素分割很大的文本区；网站的每个页面有重复性元素使之体现同一网站；

 

 

附录：

1推荐Robin著《写给大家看的设计书》或参考好的设计网站：Adobe.com； Apple.com；

2.设计网站时，用单一尺寸，比如1024*768，如有延伸但重要内容要在这个空间。直引号和直撇号不专业，用引号（&#147和&#148）及单引号（&#145和&#146）。缩进换行不能同时存在。段落(<p>)有间隔，换行(<br>)没有间隔。

3.网站具体设计：导航一定要返回到主页；小心框架的应用，用不好是灾难；网站复杂时提供网站地图或索引；外部链接要在新窗口打开；不要让人滚动边栏。

4.好的颜色：看到好的颜色，就记下来。设计人员没有科学方法配色，只有反复尝试。

5.图片：GIF适用于大面积单一颜色图像，如简单插图，logo，文本图像，卡通像；JPEG适合照片，水彩，素描或木炭画。素材：EyeWire; iStockPhot; Veer; Dgusa; FotoSearch;ArtBitz。

6.为了web排版跨平台，最好用CSS格式化。

7.FTP程序：Windows上可以用WS_FTP和AceFTP。