《网页制作》第七章--网站设计思想.pptVIP

第七章 网站的设计思想 教育技术与信息中心 彭旭 一、定位网站主题和名称 （一）主题选择 一、定位网站主题和名称 （二）名称确定 比较下列名称好坏 电脑之家与电脑学习室 MIDI乐园与迷笛乐园 中国幼儿园与儿童天地 一、定位网站主题和名称 （二）名称确定 一般建议： 1.要正式 合法、合理、合情 2.要易记 国内最好为中文 六字以下 3.要有特色 体现内涵 二、定位网站的CI形象 CI 借用广告术语,corporate identity的缩写。即通过视觉来统一企业的形象。 网站和实体公司一样，学要整体形象的包装和设计，即也需要CI形象。 CI的关键 标志、色彩、字体、标语 二、定位网站的CI形象 CI设计的经验做法： 1.设计网站的标志logo 2.设计网站的标准色彩 3.设计网站的标准字体 4.设计网站的宣传标语 二、定位网站的CI形象 标准色彩 指能体现网站形象和内涵的色彩。用于网站的标志、标题、主菜单和主色块，给人以整体统一的感觉。其他颜色也可用，但是只做点缀和衬托。 适合的颜色： 蓝色 黄/橙色 黑/灰白色 二、定位网站的CI形象 标准字体 指用于标志、标题、主菜单等特有的字体。 一般网页默认的字体是宋体，但为了体现网站的风格可选择一些特殊的字体。 体现专业可以使用粗仿宋体 体现设计精美可以用广告体 体现亲切随意可以用手写体 三、确定栏目和板块 （一）栏目设置 栏目的实质：网站的大纲索引 三、确定栏目和版块 （二）版块设置 版块比栏目要大，板块包含自己的栏目。 如：网易分新闻、体育、财经、娱乐、教育等板块，每个版块下又有各自栏目。 设置板块要注意： 各版块要相对独立；又要有相互关联；版块内容要围绕站点主题 四、确定目录结构和链接结构 （一）目录结构 四、确定目录结构和链接结构 （二）链接结构 四、确定目录结构和链接结构 （二）链接结构 以上两种结构在实际网站设计中一般混合使用。首页与一级页面间用星状，一级二级页面间用树状。 网站如超过三级页面，建议在页面中显示导航条，来帮助浏览者明确位置 五、确定网站的整体风格和创意 （一）风格 五、确定网站的整体风格和创意 （二）创意 创意是传达信息的一种特别方式，它是思考的结果。创意是将现有的要素重新组合。 创意的五阶段： 准备期 孵化期 启示期 验证期 形成期 六、首页设计 首页的设计是网站成功与否的关键。从根本上来说首页就是全站内容的目录，一个索引。 设计步骤： 1确定首页的功能模块 2设计首页的版面 3处理技术上的细节 七、版面布局的窍门 常用形式： “T”结构布局 结构清晰主次分明 规矩呆板 “口”型布局 充分利用版面，信息量大 页面拥挤，不灵活 “三”型布局 页面由两条色块分成四部分 对称对比布局 视觉冲击强 POP布局 显而易见，吸引人 速度慢 八、网页设计的通用规则 （一）网站的设计目的决定设计方案 （二）浏览者的需求第一位 （三）页面的有效性 （四）页面布局保持统一性 （五）使用表格和帧结构来设计网页 （六）谨慎使用图片 （七）学好平面设计，做好页面设计 （八）减少Java Applet和其他多媒体的使用 九、网页字体的设置 （一）字符集的设定 meta http-equiv=“Content-Type” content=“text/html;charset=gb2312 给浏览器看的，告诉浏览器该网页是以gb2312字符集制作的 gb2312是GB简体码 iso-8859-1是英文 九、网页字体的设置 （二）字体的使用 font face=“Arial” 字体定义语句 默认是中文宋体和英文Times New Roman Windows自带40多种英文字体、5种中文 其他字体可能就显示不出，但可以用图片来解决 九、网页字体的设置 （三）字体样式 四种 正常体regular 斜体 Italic 粗体 Bold 粗斜体Bold Italic 九、网页字体的设置 （四）字体效果 span style=“text-decoration:overline overline 上划线