《网站设计的组成介绍ppt课件.ppt》由会员分享，可在线阅读，更多相关《网站设计的组成介绍ppt课件.ppt（56页珍藏版）》请在三一办公上搜索。
1、网站设计的组成介绍,主要内容一、网站基本知识二、网站设计三、网站的开发流程四、常用网站开发工具本章习题,要求：,网站及其组成网站的文件及资源网站的工作机制,一、网站基本知识,网站就是由网页、图象、声音、动画及数据库等各种服务器资源构成的集合体。网站的组成部分：硬件组成：连接到网络上的计算机服务器。在服务器上运行的网络操作系统、Web服务器、应用程序服务器软件等。各种信息服务的文件资源，如网页文件、图象文件、声音文件等。对网站进行管理和维护的网站管理人员和开发人员等。,1、网站及其组成,资源：静态网页：最基本的网站提供内容，由HTML语言描述，包括文本、表格、图象及其它内容，每个用户访问时内容均
2、相同。静态网页只要放在网站服务器的文件夹中授权用户访问即可。动态网页：网页内容随不同用户、不同的访问需求而不同，网页中不仅包含HTML代码，同时包含在Web服务器端执行的脚本程序代码。通过脚本程序代码进行计算。网页能够访问服务器端的数据资源。并将结果返回给用户。,2、网站文件及资源,图象文件：如图象、动画，.gif、jpg、bmp、tif类文件等，可以作为网页中的插图、网页的背景图片，极大改善了网页的显示效果。数据库：当网站要通过动态网页提供各种 服务时，通常要利用数据库来保存数据并提供数据服务。例如电子商务、BBS等。其它文件：声音、动画、流媒体资源等，可嵌入到网页或以超级链接方式下载到用户
3、端执行。如 swf、wma、rm、avi等。,当用户浏览器通过网络向网站发出请求时，网站的Web服务器会根据浏览器请求的页面是静态、动态网页而采取不同的处理机制。静态网页的处理机制：网站的Web服务器只是简单地将页面返回发送到请求的浏览器。动态网页的处理机制：Web服务器将控制权转交给应用程序服务器，应用程序服务器解释执行网页中包含的服务器端脚本代码，并根据脚本代码的要求访问数据库等服务器端资源，最后将计算结果 转变为标准的HTML文件代码，由Web服务器将文件发送到浏览器。,3、网站的工作机制,网站的定位站点风格网站的CI形象网站的栏目和版块网站目录和链接结构,二、网站设计,一个网站要有明确
4、的目标定位，只有定位准确、目标鲜明，才可能作出切实可行的计划，按部就班地进行设计。网站的目标定位可体现在三个方面：题材和内容：应紧扣主题，并突出个性和特色。定位要准确，内容要精，不能过于宽泛，更不能包罗万象，漫无边际。网站域名网站名称：申请好记的域名和命名一个别致的网站名称对网站的形象和宣传推广有很大影响。如：搜狐、新浪、网易、263等。,1、网站的定位,风格指的是站点的整体形象给浏览者的综合感受，包括版面布局、浏览方式、交互性和文字等诸多因素。网站风格要体现自己的特色，独树一帜。通过网站的某一点，如文字、色彩、技术等，能让浏览者明确分辨出此部分就是网站所独有的。注意：风格建立在有价值的内容之
5、上。网站有风格而无内容，是不行的，必须保证内容的质量和价值性；清楚自己希望站点留给浏览者的印象。,2、网站的风格,CI(corporate identity)：指企业形象认同,通过视觉来统一企业的形象。包括：标志、色彩、字体和标语。网站的CI形象设计包括：设计网站的标志(logo)：logo是一个网站的特色和内涵的集中体现，必须设计并制作网站的标志。标志的设计、创意来自该网站的名称和内容，让浏览者一看到标志就联想到这个网站。设计网站的标准色彩：不同的色彩搭配产生不同的效果，并可能影响到访问者的情绪。标准色彩是指能体现网站形象和延伸内涵的色彩，主要用于标志、标题、主菜单和主色块。适合于网页标准色
6、：蓝色、黄/橙色、黑/灰/白等,3、网站的CI形象,设计网站标准字体：是指用于标志、标题和主菜单的特有字体。设计网站宣传标语：最好用一句话甚至是一个词来高度概括,制作网页前，一定要先规划好网站，确定合理的栏目和版块。栏目实质上是一个突出显示网站主题的大纲索引。设计网站的栏目时应考虑以下内容：紧扣网站的主题一般做法是将网站主题按一定的方法分类并将其作为网站的主栏目，且主题栏目个数在总数上要占绝对优势。2. 设计一个最近更新或网站指南栏目若主页未安排版面放置最新更新内容信息，需设置一个“最新更新”栏目，若主页层次较多，又无站内搜索引擎，则应设置一个“站点指南”栏目3. 设定一个可以双向交流的栏目设
7、定论坛、留言簿或邮件列表等，让浏览者留下信息或建议等。版块的概念比栏目大，每一个版块都有自己的栏目。设置版块时，注意各版块要相对独立，相互关联，且版块的内容要围绕站点的主题。,4、网站的栏目和版块,网站目录是指建立网站时创建的目录，站点上的所有网页及相关资源都分门别类、有序地存放在目录中。目录结构好坏对浏览者没有太大影响，但对站点本身的上传维护，内容扩充和移植有重要影响。,5、网站的目录和链接结构,建议：不要将所有文件都存放在根目录下，会造成文件管理混乱，上传速度慢等。应尽量减少根目录下的文件数；按栏目内容建立子目录：子目录的建立应基于主菜单栏目；需要经常更新的栏目，可建立独立的子目录，相关性
8、强，不需经常更新的栏目，可合并放在一个统一的子目录下。所有程序文件应放在特定目录下所有需要下载的文件最好放在一个目录下在每个主目录下都建立 images 目录目录的层次不要太深，一般不超过三层；,网站的开发人员（由一个集体来完成）主导网站开发的单位和客户项目负责人美术动画设计人员程序设计师维护人员网站开发的流程定义站点建立网站结构设计和制作主页其它页面制作测试页面发布和维护,三、网站的开发流程,明确建立网站的目的，确定网站提供的内容，及搜集网站资料。建立网站目的很多，如销售产品、树立形象、提供信息或游戏娱乐等。目的一定要明确，否则会影响到以后的设计。确定建立网站的目的：需要参与网站设计的各单位
9、及成员一起构思，讨论，取得共识后确保开发过程不会发生争议，能够有效地进行网站建设。,1、定义站点,确定网站内容：网站内容必须按照网站目的来选择且不能有内容越多越好的思想。应该有所侧重，与网站主题有关的内容选择相对多一点。进行资料的搜集：主要指文本、图片、动画及背景音乐等。设计企业网站时，一般由客户提供大部分资料，然后对资料进行整理和筛选。,规划出网站的外观及工作方式；第一步就是建立网站结构流程图，图中应包括网站的所有关键页面及与其它网页的关系，技术要点和主要的链接也应在其中。建立结构时，可先绘制网站结构的草图，将所希望的网页内容全部加入进去，然后与其它开发人员一起研究讨论，最后确定网站结构图注
10、意事项：网页的浏览线路是否流畅，是否能够引导浏览者正确地浏览等,2、建立网站结构,网站栏目结构图,对于一个网站来说，主页是至关重要的。主页制作要先绘制一张草图，图中应包括网站标志、广告条、菜单栏、友情链接等基本部件，且根据部件重要性合理布置。主页内容一般是比较概括性文字，只是起一个引导性作用，文字不应太多。制作主页时不要使用太多或容量太大的图片和动画。太大将影响传输速度。,3、设计和制作主页,其它页面没有主页复杂，但方法相同。需要注意的问题：和主页保持相同的风格要有返回主页的链接目录结构不要超过三层,4、其它页面制作：,主要包括网页的测试及网站的验证与调试；测试网页：兼容性测试：检查浏览器版本
11、的兼容性链接测试：检查链接是否有效和正确实地测试：将网页上传到Web服务器，测试链接，下载速度等。,5、测试页面,网站的验证与测试：尽最大努力找出网站的所有错误。注意网站的可浏览性，在不同浏览器中浏览的效果有所差异。最好在几个不同的浏览器及不同版本中浏览测试。,网站在服务器上发布-上传网站常用软件：CuteFTPFlash FXPLeap FTPWS_FTP等发布网站以后，还需要对网站做定期维护，如内容更新和版面扩展等。,6、发布和维护,FrontPage：Microsoft公司，最新版本2003优点：易学易用，图形化界面，和Word相似缺点：生成代码过大主要功能：允许客户使用图片库组件类似P
12、owerPoint的图形工具通过浏览器远程管理一个SharePoint团队站点使用分析报告追踪访客如何访问并使用网站增强的发布功能改进的查找和替换使用数据库向导，用户可在网页上显示数据库内容。,四、常用网站开发工具,Dreamweaver MX: Macromedia特点：最佳的制作效率网站管理控制能力：提供代码视图、设计视图与代码/设计视图切换，并包含HomeSite等HTML代码编辑器梦幻模板和XML浏览器适应性Web应用程序开发能力,超文本(hypertext):是一种特殊的文本，与一般文本不同之处在于用户阅读超文本时，可以按非线性的方式，在不同的文本之间随机地转来转去，随心所欲地进行阅
13、读。超链接:是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序。而在一个网页中用来超链接的对象，可以是一段文本或者是一个图片。当浏览者单击已经链接的文字或图片后,链接目标将显示在浏览器上，并且根据目标的类型来打开或运行。,五、网站设计基础,1.6 IP地址概述,IP地址: 是INTERNET中对主机及网络设备进行识别的唯一标识, 由32个二进制位组成.IP地址由两部分构成：net-id，host-id网络号:标识所连接的网络，相当于电话号码的区号。主机号:标识网络中的主机，相当于市内的电
14、话号码。,IP地址由两部分构成,IP地址分类,常用的IP 地址有,四类，其中,B,C,三类最常用，它们的网络号字段分别为：,个字节，网络号前有4个不同的类别比特。,常用的三种IP地址说明：A类地址的net-id字段占一个字节，7个比特，网络号为27-2，主机号224-2。全0:为本地地址；全1:是广播地址；回路测试地址127.XX.YY.ZZ不能分配,IP地址,A类IP地址：以0开头的IP地址范围:(网络地址和主机地址不能全部为0或全部为1)00000001.00000000.00000000.0000000101111111.11111111.11111111.11111110即1.0.0.
15、1到127.255.255. 254网络数量：全世界只有126个（1-126）？每个网络的主机数量：224-2=16777214,A类IP地址,B类地址的net-id字段占2个字节，14个比特，网络号为214，主机号216-2。,IP地址,B类IP地址: 以10开头的IP地址范围:(网络地址和主机地址不能全部为0或全部为1)10000000.00000000.00000000.0000000110111111.11111111.11111111.11111110即128.0.0.1到191.255.255. 254网络数量： 21416384每个网络的主机数量：216-2=65534,B类IP
16、地址,C类地址的net-id字段占3个字节，21个比特，网络号为221，主机号28-2,Class C: 以110开头的IP地址范围:(网络地址和主机地址不能全部为0或全部为1)11000000.00000000.00000000.0000000111011111.11111111.11111111.11111110即192.0.0.1到223.255.255. 254网络数量： 2212097152每个网络的主机数量：28-2=254,C类IP地址,特殊的IP地址,1、主机地址全零代表整个网络192.168.1.0代表网络本身2、主机地址全1代表网络上的全部设备，也称广播地址192.168.
17、1.2553、网络地址与主机地址全1也称为广播，指世界上所有主机。255.255.255.255,点分十进制表示方法：点分十进制记法：为提高IP地址的可读性，将位IP地址每八位为一组，每组用一位十进制数代替，并在这些数字之间加上一个点。,IP地址,223.1.1.1 = 11011111 00000001 00000001 00000001,随着Internet的发展，Internet上可用的IP地址数量越来越少了。为了解决这个问题，对于一般的拨号用户，ISP(Internet Service Provider，因特网服务提供商)采用了一种动态分配IP地址的方法。假设一个ISP有1000个用户
18、，那它只需要申请100个IP地址来满足用户的上网需要。因为1000个用户同时上网的概率是非常小的，当某个用户想上网时，就分配一个给他使用，一直到他下网时，再收回这个IP地址。使用这种“谁想用就分配给谁”的动态机制，100个IP地址就可满足1000个用户的上网需要了。这种以动态形式分配给用户的IP地址就是动态IP地址。,3.动态IP地址与静态IP地址,静态IP地址：长期地分配给用户使用的不会改变的IP地址。静态IP地址是相对于动态IP地址而言的。对于一个有静态IP地址的Internet上的主机，其IP地址是不变的，已经长期地分配给它使用。,目前IPv4地址协议最主要的问题就是IP地址已经不能满足
19、需要。IPv4的IP地址大约为40多亿，但因为美国掌握了绝对的控制权，在IP地址这种资源的分配上，明显偏袒美国，加上不珍惜，目前IP地址面临枯竭。所以，以IPv6为核心的下一代互联网就提上了日程。IPv4的地址是32位编码，而IPv6的地址是128位编码，能产生2的128次幂个IP地址，其资源几乎是无穷的。我国于1998年由中国教育和科研计算机网CERNET率先建立了IPv6试验床，并获得国际组织认可，于1999年开始分配IPv6地址。2001年，CERNET提出建设全国性下一代互联网CERNET2计划。2003年8月，CERNET2成为国家发展和改革委员会等八部委联合领导的中国下一代互联网示
20、范工程核心网的重要组成部分。,ipv4 与Ipv6,虽然INTERNET中的每台主机都有唯一的IP地址,但要记住这些由数字组成的IP地址并不容易.为方便记忆,有必要为每台主机命名一个唯一的字符标识, 即域名.域名只是个逻辑上的概念，并不反映计算机所在的物理地点。因特网设立专门的机构管理域名：ICNN：因特网名称和数字合作机构（Internet Corporation for Assigned Names and Numbers）CNNIC：中国互联网络信息中心(China Internet Network Information Center ）域名采用分级管理的方法。每一级的名字都是各不相同
21、的。,域 名,因特网的域名分为：顶级域名 二级域名 三级域名 四级域名因特网中设有很多的域名服务器 DNS，用来把域名转换为 IP 地址。例如，DNS 收到 后，经过查询过程，就把这个域名转换为 IP 地址：1001010011011001111100111001110顶级域名采用组织模式与地理模式两种划分方式,域 名,域 名,顶级域名采用组织模式与地理模式两种划分方式,中央电视台向因特网提供万维网服务的计算机的域名是： ,域 名举 例,意思是：,顶级域名,二级域名,三级域名,清华大学向因特网提供网站服务的计算机的域名是： ,域 名举 例,意思是：,URL(统一资源定位符):用于识别WEB上的
22、各种文档,使用URL使得整个因特网上每一个文档有一个唯一的标识符. URL 实际就是文档在因特网中的地址。URL 的格式: URL的访问方式:/ 主机:端口号路径文件名例: http:/:8080/guizhou/default.htm,URL (统一资源定位符),URL的访问方式:是访问该资源所采用的协议，即访问该资源的方法，它可以是：HTTP,FTP,TELNET等. 主机:指存放资源的计算机的IP地址或域名. 端口号:在使用默认端口时不必给出端口号,只有使用非默认端口时才需给出.默认端口号:HTTP: 80 FTP: 21 路径,文件名:是资源在主机内的存放路径及文件名,若省略则访问主机上的默认主页.,URL (统一资源定位符),例,举例：,http,:/,/news/china/index.shtml, 网站建设、网站制作 mui456h6,1、网站就是由_和图象、声音、动画及数据库等各种服务器资源构成的集合体。2、_指的是站点的整体形象给浏览者的综合感受。A、风格B、布局C、CI形象D、栏目3、静态网页和动态网页的工作机制。4、网站的CI形象设计内容5、网站的开发流程。,本章习题,第1章 结束, 网站建设、网站制作 mui456h6,
