Dreamweaver网站设计基础.pptVIP

网站设计基础 学习目的 1、熟练掌握网页制作软件的使用方法 2、能制作出具有一定水准的网页乃至商业级网站 3、为web应用程序开发和动态网站开发打基础 一、网站定位 合理定位： 准确把握网站定位，明确受众群体；不要贪大求全； 对于提供商业技术开发服务则应首先明确用户的需求，利用网站需求调查表与客户进行沟通 五、配色技巧 尽可能用很少的颜色（照片除外，但大面积使用照片最好对照片的色调进行处理），最好不超过三种,不要将所有颜色都用到; 同一种颜色,可以用不同的透明度和饱和度加以变化，也可以用渐变加以变化;如：用蓝色和黄色就是这样确定的。整个页面色彩丰富但不花稍; 用同一种色系，加以强调的局部可以用对比色,例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。 背景和前景的颜色反差要大,绝对不要用花纹繁复的图案作背景，以便突出主要文字内容。 六、网站的规划 1、栏目规划 根据概念开发，构思出网站的整体逻辑构架（相当于模块），栏目规划决定链接结构、目录结构 应用实例： 某学院网站栏目规划 3、网站的链接结构规划： 树状结构 4、导航系统设计 栏目导航 栏目内位置导航 导航的种类： 1、并列式：常用于一级栏目的首页或站点首页。 2、层次式：常用于栏目内 导航的位置：一般在左边或上面 设计目标：让用户快速有效地在站点内找到所需的信息。 七、站点布局 目前用户常用的分辨率是1024*768或1280*800，为满足在不同分辨率下方便浏览，一般网页设计时应考虑用户浏览网页时无须横向滚动页面，而高度一般不限制，但不宜太高，一般高度不超过屏幕高度的3倍，如果太高则考虑分页显示。 可使用页面框架，也可以使用类似风格，避免风格凌乱，尽量保持风格的一致性。 首页一般不主张用框架结构，次级栏目可以考虑用框架导航。 八、确定网站的整体风格和创意设计 网站的风格即网站的气质 九、总体设计 1、栏目规划； 2、目录规划、栏目主页定位； 3、将根据栏目划分站点分解成若干小模块和小的Web应用程序； 4、规划建立数据库，有相关联系的数据放在同一数据库中； 5、对每个小的Web应用程序设计 6、设计目录结构和命名规则 十、建立站点并发布网页 定义站点 向站点中添加网页和文件夹 编辑网页，向网页中插入对象 设置链接 发布网站 我的部分网站设计 风格(style)是抽象的。是指站点的整体形象给浏览者的综合感受。 这个“整体形象”包括站点的CI（标志，色彩，字体，标语），版面布局，浏览方式，交互性，文字，语气，内容价值，存在意义，站点荣誉等等诸多因素。 例如：??我们觉得迪斯尼是生动活泼的，IBM是专业严肃的。这些都是网站，但给人们留下的不同感受。 风格是独特的，是站点不同与其他网站的地方。或者色彩，或者技术，或者是交互方式，能让浏览者明确分辨出这是你的网站独有的。 创意到底是什么，如何产生创意呢？ 创意是引人入胜，精彩万分，出奇不意的； 创意是捕捉出来的点子，是创作出来的奇招.... 这些讲法都说出了创意的一些特点，实质上， ○创意是传达信息的一种特别方式。 ○创意是将现有的要素重新组合。 比如，网络与电话结合，产生IP电话。 网络游戏、在线书店，电子社区，在线拍卖。 创意（idea）是网站生存的关键 优秀学生作品赏析 四、色彩搭配： 通常用浅色调的背景色，干净整齐 标题栏、导航栏体现主色调 文字颜色，需反差大，兼顾周围颜色 初学者不易用好的颜色(尤其是文字)：饱和度大的颜色 初学者易于掌握的颜色（饱和度较小，即纯度小） 反面教材： 反面教材： 首 页：导航系统，登录窗口、投票、栏目版块、 栏目： 学校简介－－学校沿革、校园风光、教学设施、院长信箱 机构设置－－院办、党办、教务处、科教部、工会、研究生 教学管理－－教学科研、规章制度、、课程建设、办学层次、专业设置 师资队伍－－教学成果、名师风采、师资引进 院系设置－－计算机系、电子信息系、机电工程系、自动化系…… 招生就业－－招生计划、招生简章、招生问答、就业招聘、就业指导 学院新闻－－学院新闻、系部新闻、学术新闻 校园文化－－文学天地、电脑世界、音乐之友、体坛纵横、美术摄影 公共服务－－办公电话、图书馆、成绩查询、学生作品、资料下载 2、网站的目录结构规划： 首先建立站点根目录 通常按栏目在站点根目录下建立栏目子目录，但尽量不要与逻辑名相同，以避免猜出目录结构 每个目录下应建立独立的images目录 目录层次不要太深 WEB程序和网页分开放置 不要使用中文文件名和目录名 根据逻辑结构创建子目录， 主页 栏目1 栏目n 优点：结构清晰 缺点：效率低 软件学院网站架构修改方案规划（草稿） 星状链接结构： 优点：浏览方便