网页设计
代码部分请查看前端基础html.css.js
常用ps及编程软件
header、 banner、main、footer
用实践来说话,每次作业认真对待
设计规范
字体:
字体最小12像素(ctrl+1可查看真实大小)
偶数方便排版
页面:宽度1920(最多),有效1200px左右,高度不限
top:宽1920,高35-65
导航:宽1920,高60-100
banner:宽1920,高450-750
字体设计规范和颜色搭配:
不用死黑死白
马卡龙色可用马赛克取色法
莫兰迪色系
logo、产品也可取色
扁平化设计、性冷淡、半扁平化设计、手绘风设计、视差滚动设计、无限滚动模式(瀑布流)
导航设计
字体12-18px(16、18)
高度80-100p
横向导航:5±3个比较美观
纵向导航
面包屑导航 :引导性(类似根目录)
折叠导航
混合导航
全屏页面导航
作业点评:图标和logo太大、导航栏太矮、有效区没设定、dance太紧密、文案和点击应该在放下来一点
banner
文字排版:
1.大小对比
2.粗细对比
3.对齐形式
4.亲密关系
5.线条装饰
三要素:对齐、间距、对比
加点缀
背景简约
作业点评:仙人掌近大远小,后图仙人掌应该放小一点、鞋子明暗对比不够强烈
简单更改:
网站框架搭建
作业点评:腰线不错、文字适当对齐、底部信息可完善
网站首页设计
使用可商业用的字体
最好不要超过三种字体
行段间距以字体两倍作为参考
作业点评:banner加一些英文装饰、功能图标可以在小一些
响应式网站
能适配多种终端,自动识别屏幕宽度,并做出相应调整的网页设计,能够提高用户体验度,提高转换率和成交量
拉参考线:alt+v+e
(位置可以直接写算式)
图文左右改上下:图在下标题在上,没有标题上下都行
企业官网设计
作业点评:搜索框可以在下来一点,搜索和搜索图标同义取其一,产品特色一般一排摆四个,中间banner矮一点,设计团队人物小一点
门户类网站
营销类
专题页
时效性、针对性强
头图与内容要有联系性
背景颜色要整体
专题页
全屏自适应网站
中国风:
对称、留白、配色、纹饰、具象
移动端H5页面设计
f12切换到开发者程序里面
www改为m进入移动端
模板网站:易企秀、兔展、MAKA
后台
就业