3第三章网站开发技术.docx
- 文档编号:10173354
- 上传时间:2023-02-09
- 格式:DOCX
- 页数:13
- 大小:42.59KB
3第三章网站开发技术.docx
《3第三章网站开发技术.docx》由会员分享,可在线阅读,更多相关《3第三章网站开发技术.docx(13页珍藏版)》请在冰豆网上搜索。
3第三章网站开发技术
网站建设与管理
一、授课题目:
第三章网站开发技术
二、教学时间安排:
6
三、教学目的:
了解确定网站主题与风格的方式与步骤;了解划分网站栏目和版块的方法;了解目录结构和链接结构在网站建设中的作用;了解目录结构和链接结构的方法;了解版面布局的方法;能够根据网站的特点,选择合适的网站开发语言;能够根据网站的特点,选择合适的网站后台数据库;掌握CMS系统的原理,并能根据不同的网站选择合适的CMS系统;掌握div+css语法基础;掌握JavaScript实现网页特效的方法。
四、教学重点和难点:
网站主题与风格的确定;版面布局;网站后台开发语言的选择;网站后台数据库的选择;CMS原理及应用;JavaScript特效。
五、教学方法及手段:
使用引导式教学方法,通过实例法,讨论法和项目教学法。
六、教学内容与过程:
一.复习(复习上一章内容)
二.引入新课
1.网站主题与风格
1)网站主题
设计一个站点,首先遇到的问题就是定位网站主题,网站主题就是设计的网站的题材。
网站可以是任意主题,没有什么限制。
2)确定网站主题的步骤:
(1)主题定位要小,内容要精
网站内容越多,给人的感觉越是没有主题,没有特色,每样东西都有,你不可能有那么多的精力去维护,导致每样东西却都很肤浅。
(2)题材要根据网站设计者的兴趣和爱好确定。
大多数网站设计者建站都有自己的目的,比如一个擅长编程的网站设计者,可能会建一个编程爱好者网站,一个医生可能建一个有关寻医问药的网站,一个衣服批发商可能会建一个卖衣服的网店等。
(3)题材定位不要“太高”或者“太广”。
“太广”是指到处可见,人人都有的题材;比如软件下载,免费信息等,这样的主题没有什么新意,很难吸引人。
“定位太高”是指在这一题材上已经有非常优秀,知名度很高的站点,你要超过它是很困难的。
(4)名称要有特色
一个有特色名称的网站,能体现一定的内涵,给浏览者更多的视觉冲击和空间想象力,这样的网站很容易被人记住而不容易忘记。
3)网站风格和网站创意
网站风格具有以下几个特点:
(1)网站风格具有抽象性。
抽象性是指站点的整体形象给浏览者的综合感受。
这个“整体形象”包括站点的CI(标志,色彩,字体,标语),版面布局,浏览方式,交互性,文字,语气,内容价值,存在意义,站点荣誉等等诸多因素。
(2)网站风格具有独特性。
独特性是自己站点不同与其他网站的地方。
或者色彩,或者技术,或者是交互方式,能让浏览者明确分辨出这是你的网站独有的。
(3)网站风格具有人性的。
通过网站的外表,内容,文字,交流可以概括出一个站点的个性,情绪。
是温文儒雅,是执著热情,是活泼易变,是放任不羁。
4)树立网站风格步骤
(1)确定风格首先要建立有价值的内容
(2)你需要彻底搞清楚自己希望站点给人的印象是什么。
(3)在明确自己的网站印象后,开始努力建立和加强这种印象。
5)网站栏目和版块
网站栏目安排要注意以下几个问题:
(1)网站栏目要紧扣主题
主题栏目个数在总栏目中要占绝对优势,这样的网站显的专业,主题突出,容易给人留下深刻印象。
(2)至少设一个可经常更新的栏目
如果你的首页没有安排版面放置最近更新内容信息,就有必要设立一个“最近更新”的栏目。
这样做是为了照顾常来的访客,让他们经常能看到新鲜的信息。
(3)设定一个可以双向交流的栏目
(4)设一个下载或常见问题回答栏目
设立一个常见问题回答的栏目,能及时了解浏览者出现的问题,及时帮助浏览者解决这些问题,这样可保障浏览者会经常浏览网站。
学生试训任务:
确定汽车网主题风格与栏目版块
分析迪斯尼与IBM等大型网站的主题与风格;学习确定网站主题的基本步骤;学习确定网站风格的基本步骤;分组讨论汽车网主题风格及栏目版块的划分;写出汽车网主题风格及栏目划分方案。
2.目录结构和链接结构
1)目录结构
网站的目录是指你建立网站时所创建的目录,目录结构则主要是指物理结构和逻辑结构这两种。
(1)物理结构
网站物理结构指的是网站目录及所包含文件所存储的真实位置所表现出来的结构。
对于小型网站来说,所有网页都存在网站根目录下的扁平式结构,这种单一的目录的扁平结构对搜索引擎而言是最为理想的,因为只要一次访问即可遍历。
(2)逻辑结构
网站的逻辑结构也叫链接结构,主要是指由网页内部链接所形成的逻辑结构或者叫链接的结构。
这样的结构可以实现文件虽然存在不同的物理结构目录之中,但是访问的链接的目录层级只需要一层即可转向访问。
2)网站的链接结构
建立网站的链接结构有两种基本方式:
(1)树状链接结构(一对一)。
类似DOS的目录结构,首页链接指向一级页面,一级页面链接指向二级页面。
(2)星状链接结构(一对多)。
类似网络服务器的链接,每个页面相互之间都建立有链接。
关于链接结构的设计,在实际的网页制作中是非常重要一环。
采用什么样的链接结构直接影响到版面的布局。
3)版面布局
版面布局也叫做布局设计,就是我们在浏览器上看的一个完整的页面。
网站设计者对所有要体现的内容进行有机的整合和分布,达到某种视觉效果,这就叫做版面布局。
(1)版面布局的原理
版面指的是浏览器看到的完整的一个页面(可以包含框架和层)。
网页的整体宽度可分为三种设置形式:
百分比、象素、象素+百分比。
(2)常用的版面布局形式
“T”结构布局
指页面顶部为横条网站标志+广告条,下方左面为主菜单,右面显示内容的布局。
“口”型布局
这是一个象形的说法,就是页面一般上下各有一个广告条,左面是主菜单,右面放友情连接等,中间是主要内容。
这种布局的优点是充分利用版面,信息量大,缺点是页面拥挤,不够灵活。
“三”型布局
特点是页面上横向两条色块,将页面整体分割为四部分,色块中大多放广告条。
对称对比布局
顾名思义,采取左右或者上下对称的布局,一半深色,一半浅色,一般用于设计型站点。
POP布局
页面布局象一张宣传海报,以一张精美图片作为页面的设计中心。
优点显而易见:
漂亮吸引人。
缺点就是速度慢。
(3)版面布局的步骤
Ø结构的搭建
Ø粗略布局
Ø定案
Ø深入优化
实训任务:
确定汽车网的目录结构与版面布局。
通过分析华夏名网等一些网站的目录结构与版面布局使学生对目录结构与版面布局有一定认识;分组讨论确定目录结构与版面布局的方法;学习确定目录结构与版面布局的方法与步骤;写出确定汽车网目录结构与版面布局的方案。
3.常用开发语言介绍
常用的网站开发语言有ASP、PHP、JSP和ASP.NET等
1)ASP
优点:
(1)简单易学。
服务器脚本用的是vbscript,它具有简单易学的特点。
(2)安装使用方便。
装好一个Windows2003,只要你安装了IIS那么ASP就可以使用了,从没有什么需要你花心思去配置的。
(3)开发工具可任意选择。
只要使用一般的文书编辑程序,如Windows记事本,就可以编辑。
当然,其他网页发展工具,例如,Dreamweaver、FrontPageExpress等也都可以;可以根据需要来选择合适的开发工具。
弱点:
(1)Windows本身的所有问题都会一成不变的也累加到了它的身上。
安全性、稳定性、跨平台性(Win2K已经不再支持Alpha了)都会因为与NT的捆绑而显现出来。
(2)ASP由于使用了COM组件所以它会变的十分强大,但是这样的强大由于WindowsNT系统最初的设计问题而会引发大量的安全问题。
只要在这样的组件或是操作中一不注意,哪么外部攻击就可以取得相当高的权限而导致网站瘫痪或者数据丢失。
(3)由于ASP还是一种Script语言,所以除了大量使用组件外,没有办法提高其工作效率。
它必须面对即时编译的时间考验,同时我们还不知其背后的组件会是一个什么样的状况。
(4)无法实现跨操作系统的应用。
当然这也是微软的理由之一,只有这样才能发挥ASP最佳的能力。
(5)还无法完全实现一些企业级的功能:
完全的集群、负载均衡。
2)PHP
优点:
(1)一种能快速学习、跨平台、有良好数据库交互能力的开发语言。
(2)与Apache及其它扩展库结合紧密。
(3)良好的安全性
弱点:
(1)支持的数据库变化较大。
(2)安装复杂。
(3)缺少企业级的支持。
(4)缺少正规的商业支持。
(5)无法实现商品化应用的开发。
3)JSP
优点:
(1)一次编写,到处运行。
(2)系统的多平台支持。
(3)强大的可伸缩性。
(4)多样化和功能强大的开发工具支持。
弱点:
(1)与ASP一样,Java的一些优势正是它致命的问题所在。
(2)占用资源较大。
4.)网站开发语言选择依据
主要考虑以下几个方面
1)易学易用性
2)执行速度
3)主机空间
4)安全性
实训任务:
确定汽车网的后台开发语言。
通过分析大量网站的后台开发语言,了解每个开发语言的特点;分组讨论确定网站的后台开发语言的方法及依据;学习确定后台开发语言的依据;写出确定汽车网后台开发语言的方案。
4.网站数据库选择
常用的数据库一般是以下四种:
Access、SQLServer、MySQL,Oracle。
1)Access
Access作为MicrosoftOffice组件之一是在Windows环境下很流行的桌面型数据库管理系统。
使用MicrosoftAccess无须编写任何代码,只需通过直观的可视化操作就可以完成大部分数据管理任务。
不仅易于使用,而且界面友好,因此被用户广泛采用。
使用Access的时候不需要数据库管理者具有专业的程序设计水平,任何非专业的用户都可以用它来创建功能强大的数据库管理系统。
2)SQLServer
SQLServer是基于服务器端的中型的数据库,可以适合大容量数据的应用,在功能上管理上也要比Access要强得多。
在处理海量数据的效率,后台开发的灵活性,可扩展性等方面强大。
因为现在数据库都使用标准的SQL语言对数据库进行管理,所以如果是标准SQL语言,两者基本上都可以通用的。
92HeZu网全部双线合租空间均可使用Access数据库,同时也支持SQLServer。
SQLServer还有更多的扩展,可以用存储过程,数据库大小无极限限制
3)MySQL
MySQL是一个开放源码的小型关系型数据库管理系统,开发者为瑞典MySQLAB公司,92HeZu网免费赠送MySQL。
目前MySQL被广泛地应用在Internet上的中小型网站中。
提供由于其体积小、速度快、总体拥有成本低,尤其是开放源码这一特点,许多中小型网站为了降低网站总体拥有成本而选择了MySQL作为网站数据库。
4)Oracle
Oracle是一个对象一关系数据库管理系统。
它提供开放的、全面的、和集成的信息管理方法。
每个Server由一个OracleDB和一个OracleServer实例组成。
它具有场地自治性(SiteAutonomy)和提供数据存储透明机制,以此可实现数据存储透明性。
Oracle作为一个通用的数据库管理系统,不仅具有完整的数据管理功能,且是一个分布式的数据库系统,支持和种分布式功能,特别是支持Internet应用,作为一个应用开发环境,Oracle提供了一套界面友好、功能齐全的数据库工发工具。
其使用PL\SQL语言执行各种操作,具有可放性、可移植性、可伸缩性等诸多功能。
Oracle可以运行于目前所有主流平台上,如SUNSolarise、SequentDynix/PTX、IntelNT、HPUX、DECUNIX、IBMAIX等。
Oracle的异构服务为同其他数据源以及使用SQL和PL/SQL的服务进行通信提供了必要的基础设施。
Oracle包括了几乎所有的数据库技术,因此被认为是未来企业级主选数据库之一。
实训任务:
确定汽车网的后台开发数据库。
通过分析大量网站的后台数据库,了解每个后台数据库的特点;分组讨论网站各个数据库的特点。
;学习确定后台开发数据库的依据;写出确定汽车网后台数据库的方案。
5.网站开发工具
1)Photoshop
Photoshop是Adobe公司开发的一个功能十分强大的专业级的图像编辑工具,它将选择工具、绘画和编辑工具、颜色校正工具及特殊效果功能结合起来,对图像进行编辑处理。
它能帮助用户创建绝对优秀的能与照片逼真的图像,并且工作质量将随用户工作经验和对图像编辑原则的了解而呈指数上升。
Photoshop是当今图形设计、处理工作者的首选工具。
在众多的图像处理软件中,Photoshop以其完备的图像处理功能和多种美术处理技巧为许多的专业人士所青睐。
它既是一种先进的绘图程序,同时也可以用来修改和处理图像。
Photoshop集图像编辑、图像合成、图像扫描等多种图像处理功能于一体,同时支持多种图像文件格式,并提供有多种图像处理效果,可制作出生动形象的图像效果,是一个非常理想的图像处理工具。
2)Fireworks
Fireworks是一个强大的网页图形设计工具,你可以使用它创建和编辑位图、矢量图形,还可以非常轻松的做出各种网页设计中常见的效果,比如翻转图象,下拉菜单等,设计完成以后,如果你要在网页设计中使用,你可以将它输出为html文件,还能输出为可以在photoshop,illustrator和flash等软件中编辑的格式。
Fireworks是Macromedia三套网页利器之一,它相当于结合了Photoshop(点阵图处理)以及CorelDRAW(绘制向量图)的功能。
网页上很流行的阴影、立体按钮...等等的效果,也只需用鼠标点一下,不必再靠什么KPT之类的外挂滤镜。
而且Fireworks很完整的支持网页16进制的色彩模式,提供安全色盘的使用和转换,要切割图形,做影像对应(ImageMap)景透明,要图又小又漂亮,在Fireworks4中做起来都非常方便,修改图形也是很容易的,不需要再同时打开Photoshop和CorelDRAW等各类软件进行切换。
3)动画处理工具
动画可分为二维动画和三维动画,二维动画可以实现平面上的一些简单造型、位块移动、颜色变化等,常用的工具软件有:
AnimatorStudio、Flash等。
三维动画可以实现三维造型、各种具有三维真实感物体的模拟等,常用的工具软件有:
3DStudioMAX。
在网页中主要使用的动画处理工具是Flash。
6.CMS系统介绍
1)CMS系统产生的前提
随着网络应用的丰富和发展,很多网站往往不能迅速跟进大量信息衍生及业务模式变革的脚步,常常需要花费许多时间、人力和物力来处理信息更新和维护工作;遇到网站扩充的时候,整合内外网及分支网站的工作就变得更加复杂,甚至还需重新建设网站;如此下去,用户始终在一个高成本、低效率的循环中升级、整合。
于是就出现了以下问题:
页面制作无序,网站风格不统一,大量信息堆积,发布显得异常沉重;内容繁杂,手工管理效率低下,手工链接视音频信息经常无法实现;应用难度较高,许多工作需要技术人员配合才能完成,角色分工不明确;改版工作量大,系统扩展能力差,集成其它应用时更是降低了灵活性;对于网站建设和信息发布人员来说,他们最关注的系统的易用性和的功能的完善性,因此,这对网站建设和信息发布工具提出了一个很高的要求。
2)CMS系统的优点
(1)简单易学
(2)安全性较高
(3)稳定性强
(4)网站运行快
(5)采集功能
(6)搜索引擎友好
(7)风格模板
(8)节约建设成本
(9)网站修改很灵活
7.CMS系统选择
1)常用的CMS系统介绍
(1)动易网络()
动易在ASPCMS系统中应用最广,国内著名的站长综合网站“网页吧”采用的也是这套系统,这套国产AspCMS是一套非常强大的且人性话系统,一路走来,动易不断完善,而且也不断加强功能,包括个人版,学校版,政府版,企业版,后台包括的功能,信息发布,类别管理,权限控制,信息采集,而且跟第三方的程序,比如论坛,商城,blog可以完美结合,基本上可以满足一个中大型网站的要求.动易CMS分为ASP版的SiteWeaver™系列产品和ASP.NET版的SiteFactory™。
但从2009年10月28号,动易公司停止对SiteWeaver产品进行新功能开发及销售了,进而把所有精力都转到SiteFactory™上的开发及研究上来。
(2)乔客()
乔客从最早的整站系统,到V系列,再到CMS1.0/1.2/2.0/3.0,一路走来经历不少波折,从早期的大红大紫到被动易的迎头赶上如今似乎一直处于压抑状态,3.0的使用者了了无几,远不如1.2受欢迎,但饿死的骆驼比马大,这位ASPCMS界中元老级别的系统在不断的探索着CMS新的出路,其系统最大的特点是整合了各类的程序模块,有自带论坛,博客圈,影视频道,音乐频道,下载频道,新闻频道等等,非常适合需要多种模块而不想整合的人使用
(3)风讯()
风讯的系统功能强大,自由度高,是现在人气比较高的系统之一,可以根据自己的想法做出一个网页从而建立一个有自我风格的网站,更新速度快。
风讯也有ASP和.NET版本的系统,其中ASP版本已经到了5.0,.NET版本目前是1.0。
开源是它最大特点,希望保持。
风讯的缺点就是后台人性化差了一点,上手有点难度,而且连一套默认的模板都没有,因为自由度太高了,让一些新手更难上手,不过综合来说风讯也是一款非常值得关注的CMS系统。
(4)科汛()
科汛是一套新出的网站系统,其功能非常强大,目前主流网站的功能在其系统内均能实现,具有强大的标签(JS)管理功能,个性化的标签(JS)参数配置功能,做一个个性的大站不再是梦想。
网站整体开源,具有文章模块,图片模块,下载模块,动漫模块,音乐模块,会员模块,采集模块等等,功能非常不错。
但其网站的整体概念脱离不了动易风讯的影响,不过就冲着科汛的诸多好用的功能,这款CMS也是非常值得关注的。
科汛在2009年底准备推出.NET的版本,这将是科汛发展史上的一个重要阶段。
(5)DEDE(
织梦内容管理系统(DedeCms)以简单、实用、开源而闻名,是国内最知名的PHP开源网站管理系统,也是使用户最多的PHP类CMS系统,在经历了二年多的发展,目前的版本无论在功能,还是是易用性方面,都有了长足的发展,DedeCms免费版的主要目标用户锁定在个人站长,功能更专注于个人网站或中小型门户的构建,当然也不泛有企业用户和学校等在使用本系统,据不完全统计,目前正在运行的使用DedeCms开发的网站已经超过一万个。
织梦内容管理系统(DedeCms)居于PHP+MySQL的技术架构,完全开源加上强大稳定的技术架构,使你无论是目前打算做个小型网站,还是想让网站在不断壮大后系仍能得到随意扩充都有充分的保证。
(6)phpcms(
一个综合的网站管理系统,由PHP+MYSQL构架全站生成html,能够快速高效地应用于LINUX和WINDOWS服务器平台,是目前中国LINUX环境下最佳的网站管理应用解决方案之一。
(7)帝国网站管理系统(
帝国网站管理系统-Ecms全称为“帝国网站管理系统”,英文译为“EmpireCMS”简称“Ecms”。
Ecms是基于B/S结构,且功能强大而易用的网站管理系统。
该系统由帝国开发工作组独立开发,是一个经过完善设计的适用于Linux/windows/Unix等环境下高效的网站解决方案。
从帝国新闻系统1.0版至今天的帝国网站管理系统,她的功能进行了数次飞跃性的革新,使得网站的架设与管理变得极其轻松!
(8)酷源()
酷源采用主要包括功能为新闻系统和会员系统,酷源软件在.net2.0+vs2005的基础上研发,系统采用了N层架构的思想,目前支持mssql2000和mssql2005数据库。
酷源是后起之秀,虽然起步较晚,但由于其灵活的建站方式,较容易的二次开发功能,吸引了大量客户。
2)CMS系统选择的依据
(1)易于理解和使用
(2)灵活、易于自定义
(3)可通过插件和模块进行扩展
(4)程序语言要合适
(5)性能和速度优化
(6)安全性
(7)文献和社区支持
实训任务:
掌握CMS原理。
通过演示一个CMS系统,让学生了解CMS系统的功能作用;让学生分组讨论并查询CMS原理,并写出详细内容;通过展示一个具体的实例,向学生详细介绍CMS原理与作用。
8.JavaScript介绍
Javascript就是适应动态网页制作的需要而诞生的一种新的编程语言,如今越来越广泛地使用于Internet网页制作上。
Javascript是由Netscape公司开发的一种脚本语言(scriptinglanguage),或者称为描述语言。
在HTML基础上,使用Javascript可以开发交互式Web网页。
Javascript的出现使得网页和用户之间实现了一种实时性的、动态的、交互性的关系,使网页包含更多活跃的元素和更加精彩的内容。
运行用Javascript编写的程序需要能支持Javascript语言的浏览器。
Netscape公司Navigator3.0以上版本的浏览器都能支持Javascript程序,微软公司InternetExplorer3.0以上版本的浏览器基本上支持Javascript。
微软公司还有自己开发的Javascript,称为JScript。
Javascript和Jscript基本上是相同的,只是在一些细节上有出入。
Javascript短小精悍,又是在客户机上执行的,大大提高了网页的浏览速度和交互能力。
同时它又是专门为制作Web网页而量身定做的一种简单的编程语言。
9.Div+Css布局
DIV+CSS是网站标准(或称“WEB标准”)中常用术语之一,通常为了说明与HTML网页设计语言中的表格(table)定位方式的区别,因为XHTML网站设计标准中,不再使用表格定位技术,而是采用DIV+CSS的方式实现各种定位。
CSS是英语CascadingStyleSheets(层叠样式表单)的缩写,它是一种用来表现HTML或XML等文件式样的计算机语言。
任务:
能够应用JavaScript与div+css实现网页特效。
1.分析漂浮广告实例
实例如图:
实现代码:
absolute"> --链接地址--> "target="_blank"> --图片地址-->
varx=50,y=60
varxin=true,yin=true
varstep=1
vardelay=10
varobj=document.getElementById("codefans_net")
functionfloat(){
varL=T=0
varR=document.body.clientWid
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 第三 网站 开发 技术
![提示](https://static.bdocx.com/images/bang_tan.gif)