网站中的页面设计.ppt

网站中的页面设计 页面设计与导航系统 确定页面大小 页面主题的设计 页面结构划分 页面原始结构图设计 导航系统 确定页面大小 影响因素：显示器分辨率、浏览器版本 原则： 少用滚动条； 不出现水平滚动条 ； 建议： 分辨率使用：800*600象素点 水平大小：800*600分辨率情况下为772px 1024*768分辨率情况下为996px 垂直方向：1-3页 页面主题 页面主题 指能够反映页面风格的一种设计，主要是通过使用统一风格的图标、按钮、分隔线、题材图等。 作用 它是一种约束，是同一网站中各个页面于五彩缤纷中体现出统一风格的约束； 它也是一种力量，是将各个设计者的作品有机的结合起来的力量。 页面主题 页面主题确立： 在实用的内容上确定网站风格 确定你的网站想给浏览者什么印象 确定目标 页面主题 确定目标 突出标准色彩（文字的链接色彩，图片的主色彩，背景色，边框等色彩尽量与标准色彩一致。） 突出字体（关键的标题，菜单，图片里使用的统一的标准字体。） 网站特有的标志 有自己设计的花边、线条、点 统一的图片效果 页面主题 视觉平衡 色彩组合醒目，但一般不超过3种 图片、动画等多媒体素材的合理使用，不要过度。 页面结构划分 应用框架、表格、线条和色块来划分页面区域，否则会给人整个页面粘成一团的感觉。 常见的页面结构 页面结构划分 页面结构划分 页面结构划分 页面结构划分 页面结构的划分不局限于上述的几种方式，可以把他们结合在一起应用 页面布局无定式，“简单即美”是设计者最求的最高境界 /success.htm 页面结构划分 一般一个网站通常包括： 1． 通用顶部：网站的首页及每个栏目页面顶部都会显示该内容 2． 主要内容：不同于其他页面的特殊内容3． 通用底部：网站的首页及每个栏目页面底部都会显示改内容  页面原始结构图设计 先在纸上画出页面的结构草图，最终得到满意的布局设计。 例： 综合性站点的原始结构图例 企业网站的原始结构框图例 页面导航 导航的作用 使用导航系统，可以帮助人们简单快速地得大目标页面 网站导航系统方式 主要有：菜单导航、站点目录、站内有哪些信誉好的足球投注网站、网站地图、你的位置等 页面导航 菜单导航 菜单导航系统的设计并没有具体的规则，这部分设计应该满足网站的层次需要，而且容易让浏览者理解你的网站结构 页面导航 站点目录的建立 较为庞大的网站，会有目录页面，方便浏览者来回翻看，寻找相关信息，就同察看一本书的目录一样。 页面导航 站点目录的建立 (1)把站点内容分划为各个栏目，用标题表示 (2)在各栏目下面建立子栏目 (3)在各子栏目下面，加入子栏目的全部页面的标题 (4)通过字体大小、粗细和缩进格式使栏目，子栏目和页面标题区分开来 (5)栏目名称应链接到该栏目首页，子栏目名称应同该子栏目首页相链接 (6)使用分隔线分隔目录中的各个栏目(主区段) (7)在站点首页和其他各页面插入通向目录页面的链接 页面导航 站点地图 网站地图并没有规范的制作要求，只要能够正确反映网站的结构就可以了。 页面导航 站内有哪些信誉好的足球投注网站 有哪些信誉好的足球投注网站引擎在界面中一般放在站点的首页及其他所有页面的显眼位置，以便浏览者能够随时使用它。它的使用方法很简单，用户只要将需找的内容中的关键词输入有哪些信誉好的足球投注网站表单，程序会自动为用户找出合适的页面。 制作方法 在 web上免费的引擎程序 或自己开发新的有哪些信誉好的足球投注网站引擎。 页面导航 你的位置 显示用户当前在网站中的位置 页面导航 在制作导航系统中还应注意以下几个事项： 可根据网站结构图中页面之间关系进行设计 导航帮助要清楚； 给用户直接的向导； 页面不要死循环； 简洁和一致性； 链接的稳定性； 设计与技术总结 站点内多个网页若布局结构一样，局部内容不同时，可选用模板技术或框架技术（显式框架和隐式框架） 站点内多个网页或同一网页某些元素风格相同时可选用CSS进行控制 网页布局技术：表格和层（有需要才用） 网页前景：不同层级文字格式设置要有层次感；各要素之间色彩搭配和谐，且能反映主题； 网页背景：背景与前景搭配和谐，衬托出前景；与主题风格一致；少用动画； 页面之间导航明确稳定，不出现死链，不出现死胡同 * * 注意站点中网页风格的统一 两 栏 式 三 栏 式 横两栏纵两栏 横两栏纵三栏 横3栏纵2栏 横3栏纵3栏 标志区 广 告 区 导 航 区 新闻区 广告区 导 航 区 广 告 区 版 权 区 栏 目 区 专 题 区 网站新 动态 专家咨询 活动特区 综合性网站首页结构图示 企业标志图 站点主导航区