网页设计须知
2017-05-15 21:53:41 0 举报AI智能生成
UI设计网页设计须知
作者其他创作
大纲/内容
页面规划
尺寸
显示界面的尺寸取决于分辨率宽度 电脑页面(960px—1005px)
栏目
1.确定栏目内容
结构
顶部（头部）-网页的脸 含有特征元素 logo 导航栏 banner 搜索栏 注册登录入口 辅助栏目（加入收藏 设为首页等）
正文-网页躯干 含有：内容更新 用户登录 互动栏目
底部-网页的脚
包含网页的版权、审批、声明等辅助信息
2.确定栏目形式
布局
页面元素
色彩
色系
红色系 多用于政府、婚庆、餐饮等网站
橙色系 家居、动漫、儿童用品
黄色系 商业金融
绿色系 医疗 农业 保险
蓝色系 科技 电器 信息 （沉稳）
紫色系 美容 女
黑白色系 多于其他颜色混用
配色忌讳
脏
纯（大面积使用艳色）
跳（不能脱离整体）
花（有主色贯穿其中）
素
[蓝色忌纯 绿色忌黄 红色忌艳]
配色宗旨
相邻色 补色
风格
欧美风格 一类简单明了、色彩单一；一类构图复杂，色彩浓烈。
韩国风格 韩国惯用的界面设计，色彩清爽，多用蓝、绿色、多用大图片、渐变色、人物和卡通矢量图。
中国风格 具有古典风格的设计，古色古香，以具有中国特色的花纹或图案来装饰。
web2.0风格 近几年国际流行的风格
特点
设计简单 大面积留白和更少的内容 更大和更多样的标题文字
醒目简洁的LOGO
渐变
集中的布局
更少的分栏
分割头部
简单明了的导航
水晶图标
倒影
标签或价格签
灰色的文字
醒目简洁的LOGO
渐变
集中的布局
更少的分栏
分割头部
简单明了的导航
水晶图标
倒影
标签或价格签
灰色的文字
扁平化风格 去除冗余、厚重和繁杂的装饰效果
特点
去掉特效
极简的元素
有意义的图标
更多圆角
中性的颜色
鲜明的对比
简洁的字体
善用灰色
极简的元素
有意义的图标
更多圆角
中性的颜色
鲜明的对比
简洁的字体
善用灰色
细节
LOGO：不可随意变色、拉伸、模糊、更改
图片：不可模糊、变形、质量低下、带背景色
效果：不可强求特效
素材：不同风格不要共同使用
页面交互
统一
风格（颜色 图标 样式等） 导航 操作
醒目
文字 信息 功能
便利
（1） 导航
（2）搜索
（3）文字
（4）指示标与面包屑
（5）反馈
（6）控件
（7）扩展和维护
（8）广告
（2）搜索
（3）文字
（4）指示标与面包屑
（5）反馈
（6）控件
（7）扩展和维护
（8）广告
合格的网页是什么
美观舒适的风格
高效的导航
符合大众习惯的布局
简洁的操作
及时的反馈
明确的标注和指示
拥有吸引人的元素
良好的可维护性和可扩展性
高效的导航
符合大众习惯的布局
简洁的操作
及时的反馈
明确的标注和指示
拥有吸引人的元素
良好的可维护性和可扩展性
参考网站
优设网 lcon搜索
站酷 黄蜂网 花瓣网
站酷 黄蜂网 花瓣网
0 条评论
下一页
