




版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
1、浅谈网站建设和网页制作的方法摘要internet的h益兴起和以网页为载体的网络信息的广泛传播和应用,使得网站 的建设及网页制作得到发展的空间,人至人型企业的产殆推销、伟厉服务、解决方案,小至 个人血b页面开发,形形色色,五彩缤纷,网站建设和网页制作也成为计算机网络领域最热 门的话题。本文介绍了网站建设前的准备,网页制作的一些方法与技巧,以及在建设和制作 中值得注意的一些问题。关键词网站;网页;网站建设;网页制作随着计算机网络的广泛应用,尤其是互联网的普及与发展,上网已成为人们新的生活方 式。上网可以了解发生的新闻事件,查询各种所需资料信息,利用网络购物,办公,还可以 进行商务贸易和休闲聊天。对
2、互联网的需求自然拉动了供应,各种网站便成几何倍数的增长 起来。在网络空间里,网站是发布和获得知识与信息的载体,是个人、企业和政府机关在网 络空间的形象和存在。网站山许多相关网页构成,因此著作也就成为这个时代的热门技术。 本文介绍了网站建设询的准备,网页制作的一些方法与技巧,以及在建设和制作中值得注意 的一些问题进行了介绍。1网站建设前的准备1. 1网站的定位和规划要建设-个网站,首先需要定位,既要清楚建设网站的tj的和而向浏览的对象,只有定 位准确的网站才会有可观性和应用性。在日标明确的基础上,完成网站的构思创意即规划。 网站的设计者必须清楚地了解本网站的浏览者的棊本情况;对网站的整体风格和特
3、色做出定 位,规划网站的组织结构,主题鲜明突出,要点明确,以简明的语言和画面休现站点的主题; 最后,在此基础上收集、制作网站所需的素材,在进行页面制作时,要调动一切手段充公表 现网站的个性和情趣,展示出网站的特色。12网站整体风格的统一网站在设计时耍考虑到网站整体风格的统一。从页面的排版和布局下手,各个页面使用 相同的页边距,文本、图形之间保持相同的间距;主要的图形、标题或符号旁边留下相同的 空白;如果在第一页的顶部放置了站点标志,那么在其他各页面都放上这一标志;如杲使用 图标导航,则各个页面应当使用相同的图标。如图1和图2:曾强聪(电子系) 睜张敏波(电子系) *吴家强(电子系)访问统计总访
4、问星:33今日访问:3图1 图2耍实现这样的效果通常有两种方法,一种是使用模板,模板是dreamweaver中一种特 殊类型的文挡。设计者在模板中将各贝面中相同的部位定义为锁定区域,而将不同的部位定 义为可编辑区域。此后在制作每个页而时,都选择由模板新建,然厉在编辑区域输入不同的 文字内容,从而简化了设计主页的工序。此外,模板最强人的用途z在于一次更新多个页 面。山模板创的文挡与该模板保持连接状态,修改模板就可以更新所有基于该模板的文挡中 的设计,大大降低了页面维护的时间。另一种方法是使用框架,框架(frame)也叫帧页,是现在制作页面时较为常用的- 种技术。该技术可以把浏览器窗口划分为儿个小
5、窗口,每一个窗口都显示一个页而的内容, 并分别设置人小、有无滚动条等信息。这样就方便了设计网站的结构,可以在上方的框架里 放置网站的标志,在左面的框架甲显示导航拦,而在下方的框架里女置版权信息。当然这只 是一个比较公式化的设计,每个人可以根据口己的实际需耍和创意來做安排。而口浏览时, 可以指定连接的页面在哪个椎架甲显示,从而避免了网页上相同内容的重复卜载,这对于提 髙网页显示速度和网络传输效率方而都有着积极的意义。1. 3网站页面的版式及色彩网站页面耍简洁大方,在贝面中不要过多的加入与本页内容无关的信息,保证主题内容 让浏览者一目了然。如果希望人们在看完你的页面后能留下卬象,最好用一个简单的关
6、键词 语或图像吸引他们的注意力。如图3:设计网站询要先确立网站的主题色。一个网站必需有一种或两种主题色,不至于讣浏览 者迷火方向,也不至于单调、乏味。例如:儿童类网站一般都使用橙色、红色用以体现儿童 的活泼和、温翰气氛等效果。主题色确定好以后,使用其他配色时一定要注意它与主题色的 关系,要表现什么样的效呆。例如:教育类网站使用蓝色为主题色,再用红色和黑色作为配 色,就能表达出严肃、稳重的效果。同时,在使用色彩时要考虑它会带给人心理上的感觉。 比如,冷色使人平静,而暖色使人激动;强的色彩对比造成紧张感;暗的颜色给人以沉重感 和压迫感;亮的颜色给人轻松、开放的感觉。我们nj以根据所耍表达的主题,选
7、择合适的色 彩与主题色进行搭配。2网页制作方法与技巧在网页制作中,为了提高页而效果,需要使用一些技巧和方法。2. 1应用表格的定位功能运用衣格可以口山地控制文本和图像在网页上出现的具体位置,而不用担心不同对象之 间的影响,从而使整个网页看上去紧凑统一。要充分利用表格的定位功能,准确地将每一段 文字、每一副图片按照一定的次序进行介理的编排和布局。对于表格的框度,应采用绝对定 位,不用百分比,以便浏览者在不同的显示分辨率下都能看到同样的效果。考虑到丨1前上网 浏览者使用电脑屏幕的分辨率多为800x600,因此,每个页面在设计时也要设定在此分辨 率下,如有特殊,述要给浏览者做出提示。表格内容的下载比
8、较耗时,往往要在整张表格中全部内容下载完成厉,才能显示该表格 内容。因此,表格中尽量不要嵌套过多的表格,以免影响页面的下载速度。浏览器解释html 页而的顺序是口上而下依次逐行解释和显示,但当碰到表格中所有的元素后才将结果在页而 中显示出來,在页面内容教多而访问者浏览的速度又很慢的情况下,浏览器的这种解释次序 将明显衣露出来,只有等到浏览器解释到了贝面的最后,才会将整个页面的内容在访问者眼 询显示出来,而在浏览器解释过程中,访问者什么也看不到,这将会使访问这产生不耐烦的 心情。一些优秀网站的设计,通常也都采用表格来定位,而且人多都是一行一行来设计的, 当然每个单行排列的表格里也存冇表格嵌套,但
9、各个页面的内容最好不要放于一张的表格里 面。因此在使用表格进行网页元素布局时,应尽量避免使用整个表格。2. 2修改html代码来实现页面的动态效果现在冇了那些“所见即所得”的网页制作工具,假如只想制作出功能简单的网页,使用 这些网页制作工具即可。但是,要想制作出功能完善、风格独特的网页,只靠那些工具是远 远不够的,述是要学习一些html语言。如在网页制作中使用“跑马灯”,可以使网页增色 不少,因为其中的文字有一种动感的效果,这种效果完全可以用修改html代码来实现。先来谈一下如何制作绘简单的跑马灯效果。一般情况下,在层或表格中输入若干个文字, 先对其中的文字设置颜色、字体及大小等,然后选小该文
10、字切换到代码窗口,你会看到代码 窗口的文字还是呈现选中状态,在第一个文字前输入<marquee>,你会发现口动牛成 </marquee>,只要将</marquee>移到最后一个文字后面,在预览时,就町以看到文字从右往 左移动,就像跑马灯一样。文字的默认运动方向就是从右往左移动,相当于用了语句direction “left”,如果想让 “文字”从左往右移动,只要把“left”改成“right”就可以了。同样的道理,要使文字上 下移动,只要再把“right”改为“up”,或“down”就可以了。改成上下运动的跑马灯你会发现速度很快,读者根本无法阅读滚动的文字,修
11、改时只需 加入scrollamount= “1”参数,值得一提的是scrollamount的值越人,其上下移动的速度就 越快。scrollamount= “6”就是默认的速度很快的效果。此外,还可以用width, height参数来设置跑马灯区域的范围。下面这段html代码 是与一个从下而上的跑马灯效果相对应的:vmarquee width才40(t height 100" direction="up" scrollamount=,r,欢迎光临木网站 </marquee>,如果你把文字内容换成新闻, 就可以做成动感公告供读者阅读。2.3适当运用网页特效
12、网页特效是指在网页中调用一种特殊的小程序如javascript和vbscript程序等使网页页面有一种特殊的效果,如动态口期与时钟,鼠标跟随、状态栏屮活动的信息、在页而屮有 不断飘落的尼朵等。这些特殊效果在dreamweaver中用html语言是无法实现的。javascript和vbscript对于非专业人员來说学起來比较困难,口己编一段这样小程序 也很麻烦,为此我们町以引用他人提供javascript源程序。例如中国较大的计算机教程网 豆豆技术网中提供了一些源代码程序,可以直接拷贝引用。例:制作一个页面转换特效:(1) 登录 hup:/ 进入豆豆技术网(2) 进入该技术网中的网页特效 hg:
13、/www.ddvid.net/web/effect/index.asd(3) 点页面背景按扭,找到“页面转换特效”的文章并打开(4) 选中如下代码进行复制:<meta http-equiv=,page-enter,content=,revealtrans(duration=6.0,transition=23),> <meta http-equiv=,page-exit,content=,revealtrans(duration=6.0,transition=23),>(5) 进入dreamweaver,打开口己的网页。进入代码编辑窗口,在<head>和<
14、;/head>中 粘贴上述代码。3几个值得注意的问题31预览时看不到图片有时图片在编辑状态下是好的,而在预览时或在网页发布后无法显示,究其原因,一个 方面可能是路径问题,另一方面可能就是因为图片用的是中文文件名而招來的麻烦。如果是 路径的问题,可能是图片不在站点内,这就需要把图片存人相应的文件夹中,然后改变图片 的路径就可以了。如果图片是在站点内,在预览时仍看不见图片,则往往是使用了中文的文 件名、目录名或文件名。解决的方法是把中文名字改为英文字母、数字和下划线等符号组合 成文件名或目录。3.2不要忽略页面属性的设置设置左边界、顶部边界、边界宽度和边界高度。细心的用户会发现在没有进行设置
15、前浏 览时页面会在上下、左右,各留一片空白,这块区域用户不能利用,白白浪费了,为了节省 网页中的宝贵空间,建议把这四个选项都设置为0。3.3适当变化网页中的字体网页中的字体字号、字距、行距和文字颜色可作些适当变化,以求最美的视觉效果。需 耍突出的地方可以用不同的字体、字号和不同的颜色表示。字体最好采用系统口带的字体, 因为字体的显示效果是由浏览者的浏览器来决定的。许多漂亮的文字,浏览器可能并不支持, 可以把文字做成图片的方式来处理,不过这种方法不适合在大段的文字上采用。恰当的运用 css样式表会使文字处理达到事半功倍的效果。但每一页屮的字体要限制在4种以内,过多 的字体反而显得杂乱无序。4结束语设计一个好的网站,除了要有一定的网站基
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 标准体育场馆租赁合同
- 房产担保借款合同
- 世纪英才文化课件五上
- 《房地产基础》课件 情境二 教你选对小区
- 与人共处班会课件
- 山东省泰安市宁阳二中2025届高三3月7号月考生物试题试卷含解析
- 山东省济南市汇才校2025年初三年级月考(三)物理试题含解析
- 2025年度餐饮场地租赁合同示范文本
- 江苏省大丰区金丰路初级中学2024-2025学年初三4月仿真训练语文试题试卷含解析
- 西华大学《新能源与化石能源利用技术》2023-2024学年第一学期期末试卷
- 人教版四年级美术下册单元测试题及答案全套1
- 脑梗死的健康宣教及指导
- 江苏省南京市2021年中考道德与法治真题试卷(含答案解析)
- 科室业务学习计划安排表
- 校舍抗震安全鉴定服务投标方案
- 2023年河南测绘职业学院单招考试职业适应性测试试题及答案解析
- Python自然语言处理-课件-第05章-词向量与关键词提取
- 五年级下册综合实践活动教学设计-有趣的拉线偶人 全国通用
- 医疗废物管理PPT演示课件
- 海康监控阵列不可用数据不保留处理
- 卓越密码:如何成为专家
评论
0/150
提交评论