资源描述：
《网页的设计与制作》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。
1、网页的设计与制作第27卷第10期2011年10月赤峰学院（自然科学版）JoumalofChifengUniversity（NaturalScienceEdition）V01.27No.lO0et.2011网页的设计与制作吴振华（赤峰学院物理与电子信息工程系，内蒙古赤峰024000）摘要:本文是以指导”赤峰学院第四届'挑战杯'大学生课外学术科技作品竞赛"的网页设计——物理与电子信息工程系网建站为例谈谈网页设计的相关问题•首先说明了系网站的页面设计与制作主题，站点的规划以及网页设计的风格，最后简要地介绍所需工具，材料的收集和
2、网页的制作•在对学生的指导上重点突出设计思想和制作流程•本网站主要由物理系简介，教学管理,专业简介，课程简介，精品课程,EDP考试,信息资源以及学生管理等栏目组成主页.关键词:页面布局;站点规划;网页制作中图分类号:TP391文献标识码：A文章编号:1673—260X(2011)10—0037—03对非计算机专业的学生,如何让其在最短的时间内能够掌握网页设计制作技术，并能制作出好的参赛作品是问题的关键•根据学生的实际情况初步制定指导计划:一是根据参赛作品的要求确定网页制作的主题,以方便对素材的收集和准备工作;二是选择网页
3、制作工具，确定指导学习的内容•最终目的是使学生在最短的时间内掌握网页制作技术,并能做出高质量的作品参加竞赛.1站点的规划与设计1」确定网页设计制作的主题确定网页设计的主题是决定网页设计活动最关键的一步.主题是否鲜明,不仅是参赛作品能否中成功的问题，更是网页设计制作的一个非常重要的技术指标•由于作品确定以物理与电子信息工程系为网站作为主题，就要以专业设置，课程建设，教学管理等因素确定网页设计及制作的类型•有了明确的主题，并要按照视觉心理规律和形式将主题传达给评判人•这就耍求网页设计不但要简练，清晰和精确，而且在强调艺术性的
4、同吋，更应该注重通过独特的风格和强烈的视觉冲击力，来鲜明地突出设计主题.1.2规划站点的结构根据参赛作品要求及素材的具体情况,决定采用树形结构，如图1所示，处于顶部的是站点的首页，在首页上链接若干个二级网页,每个二级网页图1系站点结构链接若干三级网页.1.3确定网页的风格在网页设计过程中包含着主观和客观两方面的因素•在确立了网页主题和结构之后，就要在颜色搭配，页面布局和内容结构进行风格设计•网页风格的设计虽然没有统一的标准，但一定要符合人们的心里感受，要么给人生动活泼，要么给人雅致整洁，要么给人宁重严肃•成功的网页设计给
5、人们留下的都是难忘的记忆•只有形成了口己风格的网页，才能有无限的生命力.颜色搭配是网页风格设计的关键•当我们距离显示器较远时候，看到的不是网页优美的版面或者是美丽和图片，而是网页的色彩•网页色彩搭配设计包括背景色彩，色调的选择和文字，图片色彩的选择•我们知道:白纸黑字是永远的主题，谁都说不出不好来•而网页最常用流行色是：兰色—蓝天白云，沉静整洁的颜色.9绿色—绿白相间，雅致而有生气.9橙色——活泼热烈，标准商业色调.9暗红——宇重，严肃，高贵，需要配黑和灰来压制刺激的红色.几种固定搭配是：9蓝白橙——蓝为主调•白底，蓝标
6、题栏，橙色按钮或ICON做点缀.9绿白兰绿为主调•白底，绿标题栏，兰色或橙色按钮或ICON做点缀.9橙白红——橙为主调•白底，橙标题栏，暗红或桔红色按钮或ICON做点缀.9暗红黑暗红主调•黑或灰底，暗红标题栏，文字内容背景为浅灰色.在具体的设计制作中，主页采用了深蓝，浅蓝37—和白色几种颜色的搭配，其它页面根据内容的需要进行了亮色与暗色近似色的搭配，并且在一个页面里都控制在3—4种色彩内.页面布局设计页面布局类型有不同的分类方法,有的将网页布局分为"国"字型,拐角型，标题正文型，左右框架型，上下框架型，综合框架型，封面型
7、,Flash型，变化型等;还有的将网页布局分为骨骼型，满版型,分割型，中轴型,曲线型，倾斜型，对称型，焦点型,三角型，自由型等;不管那类分法都可以简单地概括为：(1)最上面是网站的标题以及横幅广告条，接下来就是导航链接，在下面就是网站的主耍内容，左右分2栏，或3栏或4栏,最下面是网站的一些基本信息，联系方式,版权声明等.(1)上面是标题及广告横幅，接下来的左侧是窄列链接等，右列是很宽的正文，下面也是一些网站的辅助信息•在这种类型中，一种很常见的类型是最上面是标题及广告，左侧是导航链接.(2)最上面是标题或类似的一些东西,
8、下面是正文.(3)左右或是上下为分两部分,左面或上面是导航链接，有时最上面会有一个小的横幅,右面或下面是正文.(4)在网站的首页，放置一些小的动画或图片，再配上几个简单的链接或者仅是一个”进人”的链接甚至直接在首页的图片上做链接而没有任何提示的页面.(5)以上页面结构的结合，做的无规律可循，相对复杂一些，大多和图片结
