Web前端设计基础
网站建设流程
网站形象设计
网站布局设计
导航及栏目设计
网页层次及目录设计
网站建设流程
- 确定网站主题
- 资料搜集整理
工具：搜索引擎、信息采集软件、RSS订阅 - 规划网站
规划的内容：
形象设计
布局设计
导航及栏目设计
页面层次结构
目录结构设计 - 选择制作工具
文本编辑器：记事本、写字板、EditPlus、Sublime Text、Notepad++等
所见即所得的制作工具：Dreamweaver、Visual Studio等
图像编辑工具：Photoshop、美图秀秀等
动画制作工具：Flash、After Effects、Cool 3D、GIF Animator等
音视频制作工具、网页特效工具等
- 设计制作网页
原则：
先大后小：设计好大结构，再逐步完善小的结构
先简单后复杂：先设计出简单的内容，再设计复杂的内容
多灵活运用模块
网页设计原则：
对比性原则、简洁性原则、平衡性原则
网站首页的制作：
文档创建
内容编辑
样式创建
样式设计
元素定位
制作完善
形象设计
-
网站的标志
各主要栏目要求一致性、首页及各级页面都要有网站logo，并链接到网站首页
页面长度原则：长度不超过3屏，宽度不超过1屏
Banner广告 -
网站的色彩
标准色彩不超过3种
色彩搭配技巧：
相同色系
对比色、互补色
过渡色
黑色和一种色彩
背景和文字的对比要尽量大 -
网站的字体
字体大小：9pt、12pt或12pt、14pt的宋体
文章正文的自豪一般使用16pt宋体
行距：10：12 即字号为10pt则行高为12pt
- 网站的宣传标语
用一句话让用户指导网站的定位
布局设计
- 页面布局形式
国字型
拐角型
标题正文型
框架布局型
POP型
- 页面布局原则
主次分明，中心突出；大小搭配、相互呼应；图文并茂，相得益彰；动静结合，平衡对称。
3. 页面布局技术
DIV+CSS布局
HTML5布局
导航设计
主次导航之分
主导航放于页面首次导航一般放于页面底端
面包屑导航：主要告诉用户如何到达的位置，以及如何返回（类似电脑里打开文件一样）
栏目设计
分清栏目主次
分类、分层合理、结构合理、具有一定拓展性
注意：紧扣主题
网页层次结构
树状结构
线性结构
网状结构
目录结构设计
原则：以最少的层次提供最清晰简便的访问结构
按栏目建立子目录
目录层次不宜太深
使用意义明确的目录