第1部分 网站开发基础篇
第1章 网站开发基础
因特网(Internet)起源于美国国防部高级研究计划管理局建立的阿帕网(ARPANet)。随着因特网的普及,目前很多公司和机构都有自己的网站,他们利用网站来发布产品资讯、招聘信息、动画电影、社会性网络系统(SNS)及其他的信息等。同时,也出现了一批信息门户网站,如新浪、搜狐等,通常这些公司的网站上提供人们生活各个方面的资讯和服务,如新闻、旅游、娱乐、经济等信息。
随着网页制作技术的流行,很多人也开始制作个人主页,它通常是制作者用来介绍自我、展现个性的地方。
本章主要介绍网站开发的一些相关基础知识。涉及的知识点如下。
◆ 网站:介绍什么是网站。
◆ 网页:介绍什么是网页。
◆ 网站和网页的相关知识:介绍因特网、浏览器、超文本标记语言等。
◆ 网站建设的一般流程:如何从头规划开发一个网站,以及域名申请和虚拟主机申请等。
◆ 网站开发的相关软件:初步介绍Dreamweaver、Photoshop、Fireworks和Flash等。
注意
本章内容不深入介绍如何去开发一个网站,而仅仅介绍相关的基础知识。
1.1 认识网页和网站
本节介绍网页和网站的基本概念及相关知识,了解并掌握这些知识是开发网站的基础,也是熟悉因特网的基础。
1.1.1 什么是网页
所谓网页,指的是网站中的一个文件,它通常是HTML格式的,网页要使用网页浏览器来阅读,如图1-1所示,就是国内著名门户网站搜狐(http://www.sohu.com)的首页。
图1-1 搜狐的首页
网页存放在Web服务器上,而Web服务器一般都放在Internet服务提供商(Internet Service Provider,ISP)的机房里面,并能够对外提供Web服务。Web服务器上的每一个网页都有一个地址(URL),当我们在浏览器中输入网页地址后,浏览器软件(如Internet Explorer、Firefox、Chrome等)会自动根据输入的网址,从Web服务器上下载网页文件到本地机器上,并解释网页的内容,再展示到你的眼前。
文字与图片是构成一个网页的两个最基本的元素。可以简单地理解为:文字,就是网页的内容;图片,就是网页的美观。除此之外,网页的元素还包括动画、音乐、程序等。
右击网页中的空白处,从快捷菜单中选择“查看源文件”命令,就可以通过浏览器的默认网页编辑器看到网页的实际内容,如图1-2所示。可以看到,网页实际上只是一个纯文本文件,它通过各式各样的标记对页面上的文字、图片、表格、声音等元素进行描述(例如字体、颜色和大小),而浏览器则对这些标记进行解释并生成页面,于是就得到了你所看到的画面。
图1-2 搜狐网站首页的实际内容
注意
为什么在源文件中看不到任何图片?这是因为网页文件中存放的只是图片的链接位置,而图片文件与网页文件是互相独立存放的,甚至可以不在同一台计算机上。
通常我们看到的网页,都是以htm或html后缀结尾的文件,俗称HTML文件。不同后缀的网页分别代表不同类型的网页文件,常见的后缀有CGI、ASP、PHP和JSP等。在笼统意义上可以把网页分为动态、静态和伪静态页面三大类。
◆ 静态网页:指的是网页的内容在设计的时候就已经固定不变,当用户访问该网页时,Web服务器只是原封不动地把该网页发送到访问者的电脑上,并由浏览器显示出来。
◆ 动态网页:一般包含某些能够执行的代码,如CGI、ASP、PHP和JSP等,网页的全部或者部分内容在设计时并没有固定,当访问者访问到该页面的时候,由Web服务器或者其他应用服务器(如Apache Tomcat)执行里面包含的代码,并动态填充里面的内容,最终生成一个网页文件,并发送到访问者的计算机,由浏览器展示出来。
◆ 伪静态网页:伪静态网页实际上不是一种独立的网页类型,它实际上是一种动态网页。由于静态网页一般是比较固定的,不会无缘无故地消失,所以搜索引擎对于静态网页比较感兴趣。正是出于这种搜索引擎优化的目的,有的网站就采用一种URL重写(URL Rewrite)的技术,通过一定的规则,把某些动态网页的URL伪装成静态网页的URL(一般以htm或html为后缀)。
交叉参考
关于搜索引擎优化和伪静态,本书第22章会有详细的介绍。
一般来说,一个典型的网页通常有这些元素:文字资料、图像档案、声音、动画和超链接。Web服务器上的网页及相关文件组成网站。当我们打开一个网站,出现的第一个页面称为首页或者主页,是网站中最主要的页面,其他页面都是从首页延伸出去的。
1.1.2 什么是网站
所谓网站(Website),就是指在国际因特网上,由一定数量的静态网页或者动态网页组成的,能够提供某些服务的相关网页的集合。简单地说,网站是一种通信工具,就像布告栏一样,人们可以通过网站来发布自己想要公开的资讯(信息),或者利用网站来提供相关的网络服务。人们可以通过网页浏览器来访问网站,获取自己需要的信息或者享受网络服务。
网站的内容是由网页集合而成的,而大家通过浏览器所看到的画面就是网页,至于要多少网页集合在一起才能称为网站,这可没有严格的规定,即使只有一个网页也能被称为网站。
在因特网的早期,网站还只能保存单纯的文本。经过几年的发展,当万维网出现之后,图像、声音、动画、视频,甚至3D技术开始在因特网上流行起来,网站也慢慢地发展成我们现在看到的图文并茂的样子。通过动态网页技术,用户也可以与其他用户或者网站管理者进行交流。也有一些网站提供电子邮件服务。
网站由域名、网站内容和网站存储空间3部分构成。
◆ 域名:是访问网站的地址,例如www.baidu.com、www.163.com等。
◆ 网站存储空间:由专门的独立服务器或租用的虚拟主机承担。
◆ 网站内容:放在网站空间里面,表现为网站前台和网站后台。
注意
域名就相当于一个家的门牌号码,网站的空间就相当于一个家,可以存放许多的东西,网站的内容就存放在网站空间里面。
1.2 网页的相关概念
网页所涉及的内容非常多,从设计出网页,到发布网页,再到用户可以访问浏览,这个过程也是非常复杂的。本节主要介绍网页制作和发布所涉及的相关概念。
1.2.1 因特网
因特网是Internet的中文译名,它的前身是ARPANet。20世纪60年代末,正处于冷战时期,当时美国军方为了使自己的计算机网络在受到袭击时即使部分网络被摧毁,其余部分仍能保持通信联系,便由美国国防部的高级研究计划局(ARPA)建设了一个军用网,叫做“阿帕网”(ARPANet)。阿帕网于1969年正式启用,当时仅连接了4台计算机,供科学家们进行计算机联网实验用。这就是因特网的前身。
到70年代,阿帕网已经有了几十个计算机网络,但是每个网络只能在网络内部的计算机之间互联通信,不同计算机网络之间仍然不能互通。为此,ARPA又设立了新的研究项目,支持学术界和工业界进行有关的研究。研究的主要内容就是想用一种新的方法将不同的计算机局域网互联,形成“互联网”。研究人员称之为“internet work”,简称“Internet”。这个名词就一直沿用到现在。
因特网是由许多小的网络(子网)互联而成的一个广域网,每个子网中连接着若干台计算机(主机)。在这个网络中,存在着各种各样的网络设备、服务器及各种终端。因特网以相互交流信息资源为目的,基于一些共同的协议,并通过许多路由器和公共互联网联网而成,它是一个信息资源和资源共享的集合,如图1-3所示。
图1-3 因特网示意图
因特网是近几年来最活跃的领域和最热门的话题,而且发展势头迅猛,成为了一种不可抗拒的潮流。Internet之所以获得如此迅猛的发展,主要归功于如下的特点。
◆ 它是一个全球计算机互联网络。
◆ 它是一个巨大的信息资料库。
◆ 最重要的是它是一个大家庭,有全世界的网民参与,共同享用着人类自己创造的财富(即信息资源)。
1.2.2 万维网
万维网(World WideWeb,简称WWW)是因特网上集文本、声音、图像、视频等多媒体信息于一身的全球信息资源网络,是因特网上的重要组成部分。浏览器(Browser)是用户通向WWW的桥梁和获取WWW信息的窗口,通过浏览器,用户可以在浩瀚的Internet海洋中漫游,搜索和浏览自己感兴趣的所有信息。
WWW的网页文件是利用超文本标记语言HTML(Hyper Text Markup Language)编写、并通过超文本传输协议HTTP(Hyper Text Transmission Protocol)传输的。超文本中不仅含有文本信息,还包括图形、声音、图像、视频等多媒体信息,更重要的是超文本中隐含着指向其他超文本的链接,这种链接称为超链接(Hyper Links)。利用超文本,用户能轻松地从一个网页链接到其他相关内容的网页上,而不必关心这些网页在物理上分散在何处的主机中。
HTML并不是一种一般意义上的程序设计语言,它将专用的标记嵌入文档中,对一段文本的语义进行描述,经解释后产生多媒体效果,并可提供文本的超链接。
1.2.3 浏览器
WWW浏览器是一个客户端的程序,其主要功能是使用户获取万维网上的各种资源,并用一种方式展示给用户。此外,用户还可以通过浏览器来与Web服务器产生互动,即输入某些信息、下载某个文件等。
网页浏览器主要通过HTTP协议与网页服务器交互并获取网页,这些网页由URL指定,文件格式通常为HTML,并由MIME在HTTP协议中指明。一个网页中可以包括多个文档,每个文档都是分别从服务器获取的。大部分浏览器本身支持除了HTML之外的广泛的格式,例如JPEG、PNG、GIF等图像格式,并且能够扩展支持众多的插件(plugins)。另外,许多浏览器还支持其他的URL类型及其相应的协议,如FTP、Gopher、HTTPS(HTTP协议的加密版本)。HTTP内容类型和URL协议规范允许网页设计者在网页中嵌入图像、动画、视频、声音、流媒体等。
常见的网页浏览器包括微软的Internet Explorer、Mozilla Firefox、Apple的Safari、Opera、Google的Chrome、360安全浏览器、世界之窗、腾讯TT、搜狗浏览器及傲游等。图1-4、图1-5和图1-6所示的是三种不同浏览器对同一网站的浏览效果。
图1-4 Internet Explorer 8
图1-5 Mozilla Firefox浏览器
图1-6 谷歌浏览器
注意
由于对HTML和CSS的支持程度不同,不同浏览器在展示网页的时候效果会有所不同,这是网页设计人员必须考虑和解决的问题,即浏览器的兼容性问题。因为你不能确定或限制访问者使用什么浏览器来浏览你的网页,所以,必须考虑到各种浏览器的展示效果是否完全一致。
1.2.4 超文本标记语言
通过浏览器浏览主页时,看到的其实是一种所谓的超文本(Hypertext)文件,它一方面通过页面里面的“超链接”(即标签)相互关联,另一方面内含多媒体对象,因此称为“超文本”。在因特网上,使用超文本标记语言(HTML,Hypertext Mark-up Language)语法来描述超文本文件,而客户端的浏览器负责解释这些超文本,最终生成访问者看到的页面形式。
HTML是基于标准通用标记语言(SGML)而开发的,它通过各种各样的“标记”向浏览器说明页面外观、文字格式、超链接目标、图片属性等内容。同时,HTML的格式是一个公共标准,非常简单。
例如,以下代码在Windows Internet Explorer 8中的显示效果如图1-7所示。
图1-7 一个简单的网页
01 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 02 <html xmlns="http://www.w3.org/1999/xhtml"> 03 <head> 04 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 05 <title>我的第一个网页</title> 06 <style type="text/css"> 07 p { 08 text-align: center; 09 } 10 html { 11 margin-top:100px; 12 } 13 .title { 14 font-size: 36px; 15 } 16 .content { 17 font-size: 24px; 18 } 19 .content { 20 font-family: "方正启体繁体"; 21 } 22 </style> 23 </head> 24 <body> 25 <p class="title">早发白帝城</p> 26 <p>唐 李白</p> 27 <p class="content"><span class="content">朝辞白帝彩云间,千里江陵一日还。 </span></p> 28 <p class="content"><span class="content">两岸猿声啼不住,轻舟已过万重山。 </span></p> 29 </body> 30 </html>
在这个网页代码中,第1行中DOCTYPE即Document Type(文档类型),在页面中用来指定当前页面所使用的XHTML或HTML的版本。在一个规范的HTML文档中,DOCTYPE声明是必不可少的,只有确定了一个正确的DOCTYPE,XHTML里的标识和CSS才能正常生效。DOCTYPE的声明遵循一定的语法规则,关于其用法,本书后面章节会详细描述。第2行是整个HTML文档的根元素html,第3~第23行是head元素,当然head元素里面还包含许多子元素,如meta、title和style等。第23~第29行是body元素,在body元素内部包含p元素和span元素。
交叉参考
有关HTML元素的使用方法,此处先不多说,本书第2章会详细地对每个常用元素的用法进行介绍。
1.2.5 电子邮件
电子邮件(Electronic mail,E-mail),标志为“@”,又称电子信箱,它是—种用电子手段提供信息交换的通信方式。它是因特网应用最广,也是出现最早的服务。
通过网上的电子邮件系统,用户可以用非常低廉的价格,以非常快速的方式(几秒钟之内可以发送到世界上任何你指定的目的地),与世界上任何一个角落的网络用户联系,这些电子邮件可以包括文字、图像、声音等各种信息。同时,用户可以得到大量免费的新闻、专题邮件,并实现轻松的信息搜索。
1.2.6 统一资源定位符
统一资源定位符即URL,URL是Uniform / Universal Resource Locator的缩写,也被称为网址,它是因特网上标准的资源地址。统一资源定位符是用于完整地描述因特网上网页和其他资源地址的一种标识方法。因特网上的每一个网页都具有一个唯一的名称标识,通常称之为URL地址,这种地址可以是本地磁盘,也可以是局域网上的某一台计算机,更多的是因特网上的站点。
尽管因特网上面的资源的类型非常多,例如网页、新闻组和文件,但是这些资源的URL具有统一的格式,采用相同的基本语法。因此,无论寻址哪种特定类型的资源,都可以使用URL。URL的一般格式为:
protocol://hostname[:port]/path/filename
从上面的语法可以得知,URL由3部分组成,分别为协议类型、主机名、路径及文件名。通过URL可以指定的资源主要有以下几种,分别为http、ftp、gopher、telnet、file等。
注意
URL中的端口部分在使用标准协议且端口为该协议的默认端口时是可以省略的。
1.协议
协议指定与该URL通信时使用的传输协议,即通信双方主机必须共同遵守的规则。在因特网上,常用的协议如下。
(1)File协议
文件协议所指向的资源是本地计算机或者局域网内的主机上的文件。其格式为:
file://path
在上面的语法中,path参数用来指定文件的绝对路径,包括文件名。例如file://c:/temp/test.txt,该URL指向C盘temp目录里面的test.txt文件。
(2)FTP协议
FTP协议的全称为File Transfer Protocol,即文件传输协议。FTP协议包括两个组成部分,其一为FTP服务器,其二为FTP客户端。其中FTP服务器用来存储文件,用户可以使用FTP客户端通过FTP协议访问位于FTP服务器上的资源。在开发网站的时候,通常利用FTP协议把网页或程序传到Web服务器上。此外,由于FTP传输效率非常高,在网络上传输大的文件时,一般也采用该协议。
默认情况下FTP协议使用20和21这两个端口,其中20用于传输数据,21用于传输控制信息。但是,是否使用20作为传输数据的端口与FTP使用的传输模式有关,如果采用主动模式,那么数据端口就是20;如果采用被动模式,则具体最终使用哪个端口要服务器端和客户端协商决定。
注意
如果使用默认端口,则URL中的端口号可以省略。
Windows平台上常用的FTP服务器软件有微软的文件传输协议(FTP)服务、FileZilla Server和Serv-U等。Windows平台常用的FTP客户端主要有FileZilla Client、FlashFXP和CuteFTP等。其中FileZilla的服务器端和客户端都是开源软件,其他的都是商业软件。
Linux/UNIX平台上常用的FTP服务器有vsftpd、ProFTPd和PureFTPd等,这些都是开源软件。
(3)HTTP协议
HTTP协议的全称为Hypertext Transfer Protocol,即超文本传输协议。该协议是万维网上最常用的协议,用户在浏览网页的时候,浏览器就是通过该协议从Web服务器上获取网页文件的。其默认端口是80,如果使用该默认端口号,则URL中的端口号部分也可以省略。这样的话,在访问网页的时候,就只看到一个域名,而没有看到端口号。
(4)HTTPS协议
HTTPS协议全称为Hypertext Transfer Protocol over Secure Socket Layer,是以安全为目标的HTTP通道,简单讲是HTTP的安全版,即HTTP下加入SSL层。HTTPS的安全基础是SSL,因此加密的详细内容就需要SSL。HTTPS使用的默认端口不同于HTTP,其默认端口号是443。此外HTTPS协议包含一个加密/身份验证层,该层位于HTTP与TCP之间。
这个系统最初由网景(Netscape)公司开发,并内置于其浏览器Netscape Navigator中,提供了身份验证与加密通信方法。现在它被广泛用于万维网上安全敏感的通信,例如交易支付方面。
(5)Mailto协议
Mailto协议即电子邮件协议,通过该协议可以创建一个指向电子邮件地址的超链接,当访问者单击该链接时,会自动调用浏览器的默认电子邮件程序,发送邮件至Mailto中冒号后面所指定的E-mail地址。例如在网页代码中插入如下代码:
a href=mailto:abc@xxx.com
用户在网页上单击该超链接就会打开默认的邮件客户端程序,输入相应的邮件内容后就可以向abc@xxx.com发送邮件。另外,在IE浏览器的地址栏中输入mailto:abc@xxx.com,回车后同样可以达到这样的效果。如果要使用mailto同时实现多个功能的话,第一个功能必须以“?”开头,后面的每一个功能都以“&”开头;另外,cc后为抄送地址,bcc后为暗送地址,subject后为邮件的主题,body后为邮件的内容。例如:
<a href="mailto:sample@163.com?subject=test&cc=sample@gmail.com&body=use mailto sample">send mail</a>
以上例子会向sample@163.com这个邮箱发送一封主题为“test”、内容为“use mailto sample”的邮件,并将该邮件抄送给sample@gmail.com。
(6)MMS协议
MMS协议的全称为Microsoft Media Server protocol,是一种流媒体传送协议,用来访问并流式接收Windows Media服务器中ASF文件的一种协议。MMS协议用于访问Windows Media发布点上的单播内容。MMS是连接Windows Media单播服务的默认方法。
访问者在Windows Media Player中键入欲播放内容的URL来观看视频。例如:
mms://media-wm.cac.washington.edu/ifs/umd_mom_edwards_wm9.asf
以上URL指向了位于media-wm.cac.washington.edu主机上的一个流媒体文件umd_mom_edwards_wm9.asf。在Media Player中可以直接打开该URL,如图1-8和图1-9所示。
图1-8 在Media Player中打开URL
图1-9 通过Media Player播放MMS流媒体
MMS的默认端口是1755。现在除了Windows Media外,如KMPLAYER、暴风影音和射手影音播放器等流行的播放器也支持该协议。
2.主机名
主机名是指存放资源的服务器的域名系统(DNS)主机名或IP地址。
3.端口号
端口是计算机与外界通信的出口,端口是通过端口号来标记的。端口号是一个整数,范围是从0到65535,一共有216(即65536)个端口。
一台拥有IP地址的主机可能会提供许多种不同类型的服务,比如Web服务、FTP服务、SMTP服务等,这些服务完全可以通过共用一个IP地址来实现。那么,主机怎样区分不同的网络服务呢?显然不能只靠IP地址,因为IP地址与网络服务的关系是一对多的关系。实际上操作系统是通过“IP地址+端口号”来区分不同的服务的。
如前所述,各种传输协议都有默认的端口号,如果输入时省略,则使用默认端口号。有时候出于安全或其他考虑,可以在服务器上对端口进行重定义,即采用非标准端口号,此时,URL中就不能省略端口号这一项。
4.路径
路径是由零或多个“/”符号隔开的字符串,一般用来表示主机上的一个目录或文件存放的地方。
1.2.7 域名
域名(Domain Name),是由一串用点分隔的字符组成的长串,其作用是用来表示Internet上某一台或者某一组计算机的名称。在正常情况下,每个域名都与一个IP地址相对应。当用户通过浏览器访问域名时,浏览器会自动将域名转换为对应的IP地址。与IP地址相比,域名非常容易记忆,便于使用。
例如网易公司的域名是www.163.com,该域名由3部分组成,最前面的www代表一台主机的名称。通常来说,提供网站服务的域名的第一部分都是www,表示World Wide Web服务。中间的163是这个域名的主体,这一部分往往就是公司的名称。域名的最后一部分表示域名的类型或者国家。其中com代表的这是一个商业类型的国际域名。
域名中的各部分中只能含有英文字母、数字或者下画线。每一个部分的长度不能超过63个字符,也不区分大小写字母。总的域名长度不能超过255个字符。
1.2.8 文件传输协议
文件传输协议用于Internet上的控制文件的双向传输。同时,它也是一个应用程序(Application)。用户可以通过它把自己的PC与世界各地所有运行FTP协议的服务器相连,访问服务器上的大量程序和信息。
FTP的主要作用,就是让用户连接上一个远程计算机(这些计算机上运行着FTP服务器程序)察看远程计算机有哪些文件,然后把文件从远程计算机上复制到本地计算机上,或把本地计算机上的文件传送到远程计算上去。
TCP/IP协议中,FTP标准命令端口号为21,数据端口号一般为20。FTP协议的任务是从一台计算机将文件传送到另一台计算机,它与这两台计算机所处的位置、连接的方式、甚至是否使用相同的操作系统无关。假设两台计算机通过FTP协议对话,并且能访问Internet,你可以用FTP命令来传输文件。每种操作系统使用上有一些细微差别,但是每种协议基本的命令结构是相同的。
FTP的传输有两种方式:ASCII传输模式和二进制数据传输模式。
(1)ASCII传输模式
ASCII传输模式是用来传输ASCII文本文件的。使用这种传输模式,被传输的文本会根据双方的实际情况发生变化,这种变化主要体现在回车换行符。例如,如果用户从一台Windows的主机上传输一个文本文件到一台UNIX主机,文件中的回车和换行符会自动转换成一个换行符。反之,如果用户从一台UNIX主机上下传一个文本文件,则文件中的换行符会自动转换成一个回车符加上一个换行符。这样做的目的主要是为了使不同平台间的文本文件格式一致。
由此可以看出,使用ASCII模式传输文件,文件的大小和内容都会发生变化。但是这不能说是不同的系统对于回车换行符的解释不同,而是不同的操作系统有不同的行结束符定义。在Windows下面是两个字节,其ASCII值为十六进制的0A0D,即\r\n(一个回车符加上一个换行符),在UNIX下面是一个字节,其值为十六进制的0A,即\n,在Mac下面也是一个字符,ASCII值为十六进制的0D,即\r。
(2)二进制传输模式
在二进制传输模式中,FTP双方会原封不动地把文件传输过去,不做任何转换。这样的话原始文件和复制的文件是逐位一一对应的。
从以上说明中可以看出,ASCII模式和二进制模式的区别就在于换行符的处理上。当使用ASCII方式从UNIX的FTP服务器上下载文件时(不管是二进制或者文本文件),每检测到1字节是0A,就会自动插入1个0D,如果此时传输的文件是二进制文件(比如可执行文件、压缩包什么的),就肯定不能用了。
如果传输的文件是UNIX平台下的文本文件,使用ASCII模式是正确的,要是误用了二进制模式,则在Windows上看到的这个文件是没有换行的,里面只是一个个的黑方块。
一般来说,最好都用二进制模式,这样可以保证不出错。如果有文本格式转换的问题,即UNIX格式的文本和Windows格式的文本之间的转换,有很多工具可以做的,不要在FTP传输的时候冒险,尤其是对要传输的文件不是非常清楚的时候。
FTP的工作方式有两种:主动方式和被动方式。下面介绍这两种方式的工作原理。
(1)主动方式下FTP客户端首先和FTP服务器的TCP 21端口建立连接,通过这个通道发送命令,客户端需要接收数据的时候在这个通道上发送PORT命令。PORT命令包含了客户端用什么端口接收数据。在传送数据的时候,服务器端通过自己的TCP 20端口连接至客户端的指定端口发送数据。FTP服务器必须和客户端建立一个新的连接用来传送数据。
(2)被动方式在建立控制通道的时候和主动方式类似,但建立连接后发送的不是PORT命令,而是PASV命令。FTP服务器收到PASV命令后,随机打开一个临时端口(也叫自由端口,端口号大于1023小于65535),并且通知客户端在这个端口上传送数据的请求,客户端连接FTP服务器的这个端口,然后FTP服务器将通过这个端口进行数据的传送。这个时候FTP服务器不再需要建立一个新的和客户端之间的连接。
很多防火墙在设置的时候都是不允许接受外部发起的连接的,所以许多位于防火墙后或内网的FTP服务器不支持PASV模式,因为客户端无法穿过防火墙打开FTP服务器的高端端口;而许多内网的客户端不能用PORT模式登录FTP服务器,因为从服务器的TCP 20端口无法和内部网络的客户端建立一个新的连接,造成无法工作。
1.2.9 IP地址
众所周知,在电话通信领域中,拨打电话首先要知道对方的电话号码,在整个电话网络中,号码是唯一的。同样的道理,在计算机网络中,每台计算机也要有一个类似于电话号码的识别码,它被称为IP地址。
在计算机领域里电信号都用0或1来表示和识别,不论是计算机内部通信还是在网络中传输一个文件,对于硬件来说它都是由一连串的0和1的代码组成的。例如下载一个MP3文件时,网络设备和计算机所接收到的信息实质上就是一长串0和1的代码,像00000100011111100000111100001010101010000。
当然IP地址也不例外,网络设备分析IP地址时也通过0、1代码来识别。当今IP地址分为IPv4和IPv6两种版本。下面分别对这两种版本的IP地址进行介绍。
(1)IPv4
IPv4使用32位地址,因此最多可能有4294967296个地址,即232个地址。例如11000000101010000000000100000001就是一个IPv4的地址。这么长的地址记忆起来非常困难,所以人们用“点分十进制”来表示IP地址,将32位代码分成4组,每组8位,中间用句号“.”分隔,所以上述代码就可以写成11000000.10101000.00000001.00000001,之后用十进制法则将4组8位代码用数字来表示,它就变成了192.168.1.1。这样就容易记忆了。其中每组8位代码称为1字节,1个IP地址由4字节组成。
通常把IP地址分为A、B、C、D四类,把32位的地址分为两个部分:前面的部分代表网络地址,全球统一分配,后面部分代表局域网地址。例如在C类网络中,前24位为网络地址,后8位为局域网地址,可提供254个设备地址,即28-2个IP地址。之所以减去2个,是因为有两个地址不能为网络设备使用。这两个不能使用的IP地址为255和0,255为广播地址,0代表此网络本身。
网络掩码限制了网络的范围,1代表网络部分,0代表设备地址部分,例如C类地址常用的网络掩码为255.255.255.0。
除了上面介绍的IP地址外,还有一些特殊用途的IP地址段。这些地址段主要有以下几个。
◆ 127.x.x.x:该IP地址段给本机使用。
◆ 224.x.x.x:该IP地址段为多播地址段。
◆ 255.255.255.255:该地址为通用的广播地址。
◆ 10.x.x.x,172.16.x.x和192.168.x.x:这些地址段仅供内部网使用。如果具有这些IP地址的主机需要连接到Internet上与其他的主机通信,则需要对这些内部网地址进行转换,即网络地址转换。
(2)IPv6
IPv6即因特网协议版本6,是被指定为IPv4继任者的下一代因特网协议版本。IPv6产生的背景是IPv4类型的IP地址空间面临着即将被耗尽的困境。IPv6在1998年12月被因特网工程任务小组(Internet Engineering Task Force,简称IETF)通过公布因特网标准规范(RFC 2460)的方式定义出台。
IPv6具有比IPv4大得多的地址空间,这是因为IPv6使用了128位的地址,而IPv4只有32位。因此新增的地址空间支持2128(约3.4×1038)个IP地址。这一扩展提供了灵活的地址分配及路由转发,并消除了对网络地址转换(NAT)的依赖。NAT是获得了广泛部署的减缓IPv4地址耗尽的最有效的方式。
通常情况下,在使用IPv6时,会将128位写成8组、每组4个十六进制形式的数字。例如:
2001:0db8:85a3:08d3:1319:8a2e:0370:7344
它是一个合法的IPv6地址。如果某组中的四个数字都是0,则该组可以被省略。例如:
2001:0db8:85a3:0000:1319:8a2e:0370:7344
它等同于:
2001:0db8:85a3::1319:8a2e:0370:7344
1.3 网站建设的一般流程
网站的建设是一个非常复杂的过程,它涉及很多种技术。除了技术之外,还有很多商业上的因素。因此,要建设一个好的网站,必须按照一定的流程来操作。本节讨论如何从头开始建设一个网站。
1.3.1 确定网站主题
建设一个成功的网站,首先必须要解决的就是网站内容问题,即确定网站的主题和网站的定位。如果是做比较小型的网站,那么网站的中心思想容易确定,因为小网站本身规模很小,资金也不多,不会想去做面面俱到的综合性站点。这样的话,针对性就非常强。如果是做比较大型的网站,那么网站的主题就没有那么容易确定了,既要内容充实,又要重点突出,体现特色,避免面面俱到。
说起网站的中心思想,这个东西说大也不大,说小也不小。因为最初建站的时候,开发者就应该换位思考,并设想一下网站的目标客户群是谁,这些用户会单击哪些关键词,以及这个网站以后如何宣传,在宣传时所涉及的人力和财力。
假如是商业性质的站点,例如网络购物,一般对于草根站长是很难的,因为建立和维持一个购物类网站需要花费很多的人力、物力和财力。对于商业性质的网站来说,非常关键的一点,就是有足够多的用户访问所提供的购物平台以及相信网站中所宣传的商品,不但要做人气还要做信用,两者缺一不可。在目前形势下,草根站长不太容易做到这些。
假如是做公司网站,刚开始开发的时候,就必须制定好用户需求,同时制定经营方案。如果只制定好需求,仅仅只是确定了主题,并没有确定好定位,而中心思想是既包括主题也包括定位的。当制定好运营方案以后,基本上可以知道可行性有多高了。运营方案的内容包括很多,最基本的应该包括客户怎样宣传,怎样让网站流量多、回头客高,前期的宣传,后期怎样完善,网站的主题怎样宣传,IP值达一万以后如何运营,流程是否可以走通,网站有没有竞争对手,竞争对手是如何做的。
中心思想里面最重要的是主题,越大的网站主题却越容易搞不清楚。就像前面所说,小网站的主题很容易定位,因为小,所以不会从大方面想,要实现的功能也不会太多,这样容易做精做全。如果对于一个网络购物类网站来说,除了购物之外,还考虑加上论坛、博客和圈子功能,尽管说这几个都很流行,但是用户登录网站之后感觉不到这是购物类网站还是一个社区门户。这样的话会导致网站功能重点不突出,用户会失去继续浏览的兴趣。
一般来说,常见的网站题材有以下几种。
◆ 网上求职。
◆ 网上聊天/即时信息。
◆ 网上社区/论坛/邮件列表。
◆ 计算机技术和软件下载。
◆ 娱乐网站。
◆ 旅游。
◆ 参考/资讯。
◆ 家庭/教育。
◆ 生活/时尚。
下面分别对这些常见类型的网站进行举例说明。
(1)求职类的网站目前主要有前程无忧及智联招聘等,如图1-10和图1-11所示。
图1-10 前程无忧网站
图1-11 智联招聘网站
(2)网上聊天类的网站目前比较少,主要是因为现在即时通信工具(Instant Messenger,IM)非常多,如QQ、MSN、Skype、Google Talk。这些IM工具使用起来比聊天网站要方便得多,因此逐渐代替了以前的聊天网站。
(3)网上社区类的网站目前主要是SNS网站,如开心网等,如图1-12所示,还有猫扑网,如图1-13所示。
图1-12 开心网
图1-13 猫扑社区
(4)论坛类的网站则比较多,几乎每一个行业都有比较有名的论坛,如综合新闻类的有西祠胡同、新浪论坛、搜狐社区、百度贴吧等。如图1-14所示的是西祠胡同的主页。股票类的有MACD技术分析论坛,如图1-15所示。
图1-14 西祠胡同
图1-15 MACD技术分析论坛
其他题材的网站读者可以自己去搜集,在此不再赘述。
从上面的例子可以看到,其实网站的内容题材丰富多彩。如果自己在某些方面有兴趣,或掌握的资料较多,也可以做一个自己感兴趣的东西。一来,可以有自己的见解,做出自己的特色;二来,在制作网站时不会觉得无聊或者力不从心。
提示
兴趣是制作网站的动力,没有创作热情,很难设计制作出优秀的作品。
1.3.2 网站整体规划
不论是正规的商业网站还是个人网站,要想把它搞得丰富多彩,吸引大量用户前来访问,网站规划设计是至关重要的。除非只是设计一两个网页,否则网页制作应按网站来考虑,首先对网页内容进行规划设计。创建新网站的最佳方法是先建立原型系统,再进行详细设计,最后正式实施。
原型系统的建立是一个非常重要的阶段,在这个过程中要解决网站建设的一些基本问题,例如:
◆ 网站的结构。
◆ 新添文件与原有系统保持一致的措施。
◆ 信息的组织与管理。
◆ 信息存储的方法,即采用数据库还是文件系统。
◆ 文档版本控制,例如,如何确保多个用户同时编辑同一个文件。
◆ 结构的完整性和一致性的维护方法。
这些问题没有绝对正确的答案,只能根据实际情况进行选择。详细设计包括画面的布局、系统的内部结构、实现方法和维护方法等。这些对于以后的系统开发和投资估计都有着极其重要的意义。
进行详细设计时,最重要的是确定网站的运行模式。网站的开发目标仅仅是宣传性网站或者随意性很强的个人站点,还是通过广告、销售等方式获利的站点,设计的方式和内容有着很大的区别。
对于商业网站,必须充分考虑财力、人力、计算机数目、网络连接方式、系统的经济效益、网站验证和用户反馈回复等诸多方面的问题。从长远角度考虑,必须准确地知道网站的目标和系统的资金投入。
1.网站内容开发
影响网站成功的因素主要有网站结构的合理性、直观性,多媒体信息的实效性和开销等。成功网站的最大秘诀在于让访问者感到网站对他们非常有用。因此,网站内容开发对于网站建设至关重要。进行网站内容开发的要点如下。
◆ 网页的效果由其自身的质量和浏览器解释HTML的方法决定。由于不同浏览器的解释方法不尽相同,所以在网页设计时要充分考虑到这一点,让所有的浏览器都能够正常浏览,尽最大可能地保证浏览器的兼容性。
◆ 网站信息的组织没有任何简单快捷的方法,吸引用户的关键在于总体结构的层次分明。应该尽量避免形成复杂的网状结构。网状结构不仅不利于访问者查找感兴趣的内容,而且在信息不断增多后还会使维护工作非常困难。
◆ 图像、声音和视频信息能够比普通文本提供更丰富和更直接的信息,产生更大的吸引力,但文本字符可提供较快的浏览速度。因此,图像和多媒体信息的使用要适中,减少文件数量和大小是必要的。
◆ 对任何网站,每一个网页或主页都是非常重要的,因为这些网页能够给访问者带去第一印象,好的第一印象能够吸引用户再次光临这个网站。
◆ 网站内容应是动态的,随时进行修改和更新,以使自己的网站紧跟市场潮流。在主页上注明更新日期及本站的网址对于经常访问的用户非常有用。
◆ 网页中应该提供一些联机帮助功能。比如输入查询关键字就可以提供一些简单的例子,甚至列出常用的关键字。千万不能让访问者不知所措。
◆ 网页的文本内容应简明、通俗易懂。所有内容都要针对设计目标而写,不要节外生枝。文字要正确,不能有语法错误和错别字。
2.网站页面风格的设计
简洁明快、独具特色、保持统一的网站风格能让用户产生深刻印象,不断前来访问。优秀的网页画面少不了漂亮的图像,但更主要的是布局效果。网页布局采用的主要技术是HTML的表格(Table)、框架(Frame)及样式表(CSS)等。关于这些布局方法的实现,在本书的后面章节中会详细介绍。以下是网站页面设计时所要注意的问题。
◆ 整体规划合理,主辅菜单清晰。
◆ 网站建设导向明确,重点突出。
◆ 各栏目统一规划,整个网站比较清晰。
◆ 网站的促销功能得到明显体现。
对于网页中的菜单设置,则需要注意以下问题。
◆ 菜单不宜采用图片形式,图标标识明确,有文字说明,不用用户移动鼠标进行猜测。
◆ 菜单层次不宜过多,有效信息层次要少,不需要多次单击才能找到有效信息。
◆ 过多采用鼠标响应式菜单,栏目设置不合理,使得用户难以发现需要的信息。
◆ 全Flash首页和菜单,无法优化处理,也没有相应的文字说明,不采用。
对于网站首页,需要注意以下问题。
◆ 少采用大型图片,用户关心的信息在首页体现,不应多次单击。
◆ 首页下载速度要快。
◆ 首页有效信息量丰富。
◆ 首页有标题。
◆ 提供一种以上语言链接页面。
对于页面中的信息来说,需要注意以下问题。
◆ 重要信息完整,如联系方式和产品介绍等。
◆ 页面信息足够,减少多次翻页。
◆ 去除与企业形象、产品、促销等方面无关的信息。
◆ 产品详细介绍内容过少。
◆ 内容页面没有标题,或者全部使用公司名为标题。
◆ 客户能够方便、及时地维护补充,保持其时效性。
1.3.3 申请网站域名
前面讲过,域名对于一个网站来说是至关重要的,好的域名可以使人过目不忘,如8848.com、163.com、sohu.com、alibaba.com及taobao.com等。网站的域名既要容易使人记住,又要与网站的主题内容密切相关。如“taobao”是中文“淘宝”的拼音,“淘宝”一词又与网站的内容“电子商务”密切相关,因此“淘宝”作为电子商务网站的域名是非常恰当的。
申请域名的过程包含两个,首先要选择一个好的域名,其次再到域名注册机构申请域名。下面分别对这两个过程进行简单介绍。
1.选择域名
域名的选择需要根据用户和网站的实际情况来进行。通常来说,选择域名有以下技巧。
◆ 用企业名称的汉语拼音作为域名:这是为企业选取域名的一种较好方式,实际上大部分国内企业都是这样选取域名的。例如,红塔集团的域名为hongta.com,新飞电器的域名为xinfei.com,海尔集团的域名为haier.com,四川长虹集团的域名为changhong.com,华为技术有限公司的域名为huawei.com。这样的域名有助于提高企业在线品牌的知名度,即使企业不做任何宣传,其在线站点的域名也很容易被人想到。
◆ 用企业名称相应的英文名作为域名:这也是许多企业选取域名的一种方式,这样的域名特别适合与计算机、网络和通信相关的一些行业。例如,长城计算机公司的域名为greatwall.com.cn,中国电信的域名为chinatelecom.com.cn,中国移动的域名为chinamobile.com。
◆ 用企业名称的缩写作为域名:有些企业的名称比较长,如果用汉语拼音或者相应的英文作为域名就显得过于烦琐,不便于记忆。因此,用企业名称的缩写作为域名不失为一种好方法。缩写包括两种方法: 一种是汉语拼音缩写,另一种是英文缩写。例如,广东步步高电子工业有限公司的域名为gdbbk.com,泸州老窖集团的域名为Izlj.com.cn,中国电子商务网的域名为chinaeb.com.cn,计算机世界的域名为ccw.com.cn。
◆ 用汉语拼音的谐音形式给企业注册域名:在现实中,采用这种方法的企业也不在少数。例如,美的集团的域名为midea.com.cn,康佳集团的域名为konka.com.cn,格力集团的域名为gree.com,新浪网站用sina.com.cn作为它的域名。
◆ 以中英文结合的形式给企业注册域名:荣事达集团的域名是rongshidagroup.com,其中“荣事达”三字用汉语拼音,“集团”用英文名。这样的例子还有许多,例如,中国人网的域名为chinaren.com,华通金属的域名为htmetal.com.cn。
◆ 在企业名称前后加上与网络相关的前缀和后缀:常用的前缀有e、i、net等,后缀有net、web、line等。例如,中国营销传播网的域名为emkt.com.cn,网络营销论坛的域名为webpromote.com.cn,联合商情域名为it168.com,脉搏网的域名为mweb.com.cn,中华营销网的域名是chinam-net.com。
◆ 用简单数跟与企业名不同但有相关性的词作为域名:一般情况下,企业选取这种域名的原因有多种,或者是为了让人很容易记住网站,或者是因为企业的品牌域名已经被别人抢注不得已而为之,或者觉得新的域名可能更有利于开展网上业务。例如,上海雨林翻译公司是一家翻译服务公司,他选报了021fy.com作为他的域名,021是上海的电话区号,fy是翻译两字的拼音缩写,容易让人一下子记住。这样做的好处显而易见,只要客户看了一遍,就很容易记住。
◆ 不要注册其他公司拥有的独特商标名和国际知名企业的商标名:如果选取其他公司独特的商标名作为自己的域名,很可能会惹上一身官司,特别是当想要注册的域名是一家国际或国内著名企业的驰名商标时。换言之,当企业挑选域名时,需要留心挑选的域名是不是其他企业的注册商标名。
此外,域名的最后一部分是有特殊含义的。常见的域名后缀列表如下。
(1)常见的国际域名后缀
◆ .com:商业机构。
◆ .net:网络服务机构。
◆ .org:非盈利性组织。
(2)常见的国内域名后缀
◆ .cn:国内顶级域名。
◆ .com.cn:商业机构。
◆ .net.cn:网络服务机构。
◆ .org.cn:非盈利性组织。
◆ .gov.cn:政府机关。
(3)新增国际域名后缀
◆ .biz:.biz是.com的替代者,取意来自英文单词business(商业)。
◆ .info:信息时代最明确的标志,取意来自英文单词information(信息)。
◆ .name:一般由个人注册和使用。
(4)世界各国域名后缀
◆ ad:Andorra,安道尔。
◆ ae:United Arab Emirates,阿联酋。
◆ af:Afghanistan,阿富汗。
◆ ag:Antigua and Barbuda,安提瓜和巴布达。
◆ ai:Anguilla,安圭拉。
◆ aI:Albania,阿尔巴尼亚。
◆ am:Armenia,亚美尼亚。
◆ an:Netherlands Antilles,荷兰属地。
说明
关于世界各国域名由于较多,在此不再一一列举,想了解者请参考相关文献。
在选择域名的时候,要注意使用www.whois.net网站或者域名注册商提供的域名查询工具来查询想要的域名是否已经被注册。如果已经被注册,也可以通过whois工具了解到该域名的相关信息。如图1-16所示就是http://www.whois.net网站的首页。如图1-17所示就是通过www.whois.net查询到的163.com这个域名的WHOIS信息。
图1-16 http://www.whois.net网站的首页
图1-17 通过www.whois.net查询到的163.com域名的WHOIS信息
对于国内的域名,即CN域名,则应该通过http://ewhois.cnnic.net.cn/网站来查询域名的相关信息,如图1-18所示。
图1-18 国内域名(CN域名)的查询网站
如图1-19所示就是国内著名域名注册商珠海时代互联的首页。在该首页上面提供了域名查询的功能。如果输入163,在下面选中.com域名后缀,单击“查询”按钮以后,会出现如图1-20所示的页面。该页面告诉用户有哪些域名已经被注册了,哪些域名还没有被注册。对于其中已经被注册的域名,用户可以通过单击该域名来查询其注册信息,如图1-21所示。
图1-19 时代互联首页
图1-20 域名查询结果
图1-21 通过时代互联的网站查询到的163.com的WHOIS信息
2.注册域名
注册域名的过程比较简单,就是把选择好的域名提交给域名注册商就可以了,其他的工作由域名注册商来完成。这个提交过程可以通过网络在线提交,有些域名注册商的网站还支持在线支付,这样就更加方便了。
目前,国内比较有名的域名注册商有万网(http://www.net.cn)、时代互联(http://www.now.cn)、中资源(http://www.zzy.cn/)、美橙互联(http://www.cndns.com/)等。对于国际域名,还可以通过国外的域名注册商来申请。
1.3.4 准备主机或虚拟主机
注册好域名之后,网站建设的任务还没有完成。接下来的任务就是在互联网上为网站找一个“安家之处”,即存放网站内容的存储空间。网站内容的存储空间可以为独立主机、虚拟主机或者虚拟专用服务器。下面分别对这3种类型的空间进行介绍。
1.独立主机
如果用户对网站的性能、可维护性要求比较高,可以采用独立主机的方式。所谓独立主机,是指客户独立使用一台服务器来展示自己的网站或提供自己的服务。独立主机是作为虚拟主机的高端产品出现的,它是一台独立的包含操作系统环境、拥有独立IP并联网的服务器。它为互联网高端用户提供了更为宽松的使用环境,满足企业级用户各种不同的需求。
独立主机的优点是有比虚拟主机有空间更大、速度更快、CPU计算独立等优势。由于是独享整台服务器,性能和自由度更好。与虚拟主机相比,独立主机限制较少,用户可以自己完成各种所需的环境配置和个性化应用的安装。因为都是独享,所以不存在资源受影响的情况,安全、可靠。缺点是自己一定要对服务器安全有一定的认识才行,要有专门的技术人员来维护这台独立主机。其次就是价格比较昂贵。
独立主机有两种形式,一种是租用,一种是托管。租用就是用户租用网络服务提供商,即ISP的一台独立主机,该主机产权属于ISP,使用权属于用户。根据主机的硬件配置不同,独立主机的租金从几千到几万元不等。用户可以根据自己的实际情况来租用不同等级的主机。
主机托管就是用户自己购买主机,然后把主机放到ISP的机房里面,接入Internet。这样的话,用户就拥有主机的全部产权和使用权。而且用户可以根据自己的实际情况,灵活地选择硬件和软件配置。主机托管的价格一般比租用的价格要低一些,但是,用户要自己出资购买主机。
2.虚拟主机
所谓虚拟主机,是在一台网络服务器上划分出一定的磁盘空间供用户放置站点、应用组件等,提供必要的站点功能与数据存放、传输功能。多台虚拟主机共享一台真实主机的资源,把一台运行在网上的服务器划分成多个虚拟的服务器,每一台虚拟主机都具有独立的域名和完整的Internet服务器,例如WWW、FTP、E-mail等功能。同一台服务器上的不同虚拟主机是各自独立的,并由用户自行管理。但一台服务器主机只能够支持一定数量的虚拟主机,当超过这个数量时,用户将会感到性能急剧下降。
虚拟主机技术是Internet服务器采用的节省服务器硬件成本的技术,虚拟主机技术主要应用于WWW服务,将一台服务器的某项或者全部服务内容逻辑划分为多个服务单位,对外表现为多个服务器,从而充分利用服务器硬件资源。虚拟主机的缺点是性能较差,且不同的虚拟主机之间会相互影响,此外对于用户的限制也很多,一般只能通过FTP来管理网站内容。
提示
虚拟主机的价格相对比较便宜,一般从几百到几千元不等。
3.虚拟专用服务器(VPS)
VPS主机(虚拟专用服务器)是利用虚拟服务器软件,例如微软的Virtual Server、VMware的ESX server、SWsoft的Virtuozzo、Sun的Virtual Box等,在一台物理服务器上创建多个相互隔离的小服务器。这些小服务器(VPS)本身就有自己的操作系统,让用户以虚拟主机的价格享受到独立主机的服务品质。即每个VPS都可分配独立公网IP地址、独立操作系统、独立空间、独立内存、独立CPU资源、独立执行程序和独立系统配置等,VPS用户除了可以分配多个虚拟主机及无限企业邮箱外,更具有独立服务器功能,可自行安装程序,单独重启服务器。
VPS的优点是管理方便,对用户限制很少,较大程度独享资源,安全可靠的隔离保证了用户对于资源的使用和数据的安全。此外价格适中,比较适合中小企业、小型门户网站、个人工作室、SOHO一族。缺点是性能不及独立主机。表1-1对虚拟主机、VPS和独立主机的各种指标进行了对比。
表1-1 虚拟主机、VPS和独立主机的对比
1.3.5 设计网页页面
在网页的设计里面,最重要的一个方面就是网页的风格。网页的风格包含很多内容,主要包括色彩、网页排版、网页的交互、多媒体的形式、内容架构及网页内容等。下面分别对这些方面进行介绍。
1.色彩
色彩包括网页的底色、文字的色彩、图片的色系、颜色等。
2.排版
主要是网页的整体结构、各个组成部分内容的展示形式、表格、框架的应用、文字缩排、段落等。
在开始编写文字、寻找图像和进行正式网页设计之前应该先把基本的网页结构组织好。要是开始的时候在脑子里没有一个相当明确的结构,那几乎肯定会以一团糟而告终。参考一些用户喜欢的页面,研究它们的布局和风格,看它们是如何表现内容的。整页地复制别人的东西是剽窃行为,但是向别人学习则是研究过程。
对要设计的网页有了初步的思考之后,就可以把思考的结果以草图的形式表示出来。这样做的目的有二:其一是把大脑中的东西变成一个实实在在的图片,这样自己可以验证实际效果如何。其二是可以把设计草图发给别人,让别人提一下意见。
草图的设计可以使用Photoshop或者其他的图像设计软件,主要内容是对网页的整体结构做个规划。例如网页整体分为几个大的部分,每个部分应该放什么内容,内容的展现形式如何,是图片、动画还是文字。如图1-22所示即为一个网页的草图。
图1-22 网页的版面设计图
3.网页的交互
主要是网页的交互形式,客户端及服务器端的程序,例如在客户端是否采用JavaScript的框架来增强用户体验,服务器端的程序是如何实现的,例如ASP、PHP、XML、CGI等。
4.其他的媒体形式
这部分主要是让网页看起来生动活泼的各种内容形式,如Flash动画、SiIverlight程序等。
5.内容架构
主要是指网站的目录规划、网站及网页内容的层次性要明确。如图1-23所示是网易的一篇新闻。这个网页的内容架构就非常有代表性。首先是一个非常醒目的标题,一目了然。下面就是内容的发布时间和来源,因为这个内容不是重点,但是又不能缺少,所以采用较小的字号来展示。再接下来是一段摘要,用户只要阅读这几行字就可以了解这篇文章的内容。最后就是正文,图文并茂。
图1-23 网易新闻
这种结构非常值得借鉴。当用户设计一个展示产品的网页的时候,同样也应该把产品的名称放在网页的最上面,让用户一看就知道是什么东西。如果介绍产品的内容较多,也应该放一个摘要在正文前面,简单地介绍产品的性能及一些指标。最后把产品详细地介绍给用户。
初学者往往在这个方面犯错。例如经常会把产品的名称与产品介绍混在一起,或者产品介绍得非常详细,但是却没有提供一个简介。这样的话用户要了解网页的内容就非常困难。
6.网页内容
主要是指网站是否主题明确、网站的整体实用性如何、网站内文件之间的关联性如何、网页内容与主题切合度如何、是否有不必要的档案等。
1.3.6 网站程序设计
在目前的网站当中,单纯的静态页面组成的网站已经非常罕见了。几乎所有的网站都有丰富的交互功能,例如留言板、新闻评论、内容搜索等,这些功能背后都由网站程序来支持。目前常用的网站程序设计语言有以下几种。
1.PHP
全称是Hypertext Preprocessor,是一种非常流行的脚本语言。主要用于Web开发,可以嵌入到HTML代码里面。
PHP是一种面向过程和面向对象的语言。作为面向过程的语言,PHP拥有独特的语法,它混合了C、Java、Perl及PHP自创新的语法。可以像写C程序一样来编写PHP程序。作为面向对象的语言,PHP包括类、对象、接口、继承等基本概念。
PHP拥有非常多的函数,可以很方便地实现各种功能。目前使用PHP开发的开源网站系统非常多,例如Discuz!、Shopex、WordPress等。
2.Java
Java是由Sun Microsystems公司于1995年5月推出的Java程序设计语言和Java平台的总称。由于其非常强的健壮性和跨平台的特性,使得Java非常流行,成为许多大型企业级的应用系统的首选开发语言。
Java是一种完全面向对象的语言。Java语言提供类、接口和继承等原语,为了简单起见,只支持类之间的单继承,不直接支持多重继承。但支持接口之间的多继承,并支持类与接口之间的实现机制(关键字为implements)。Java语言全面支持动态绑定。
Java目前的最新版本是1.6,分为JRE和JDK,前者是运行环境,后者除了提供运行环境以外,还提供开发编译环境。
3.C#
C#是微软公司在其.NET平台中提供的一种新的编程语言。在微软的宣传当中,C#被誉为是C/C++家族中第一种面向组件的语言,实际上C#更像Java。
C#是一种面向组件的编程语言,它通过属性、索引器、委派、事件、操作符重载、特征、版本等实现了其对组件编程的第一手支持。
说明
C#目前只能运行于Windows系统之上。因此,其跨平台的特性不如Java,这也是其使用范围不及Java的原因之一。
4.Ruby
Ruby是一种简单快捷的面向对象的程序设计语言,在20世纪90年代由日本人松本行弘开发,遵守GPL协议和Ruby License。它的灵感与特性来自于Perl、Smalltalk、Eiffel、Ada及Lisp语言。由Ruby语言本身还发展出了JRuby(Java平台)、IronRuby(.NET平台)等其他平台的Ruby语言替代品。
除了以上几种常见的网站程序设计语言以外,还有其他的一些语言,例如C/C++、ASP、Perl等,都可以用于开发网站程序。但这些语言与以上几种相比,使用没有那么广泛。
1.3.7 网站的发布
网站的发布是指把设计好的网页及开发完成的网站程序放到Web服务器上面,提供浏览服务。
网站的发布过程要根据具体的Web服务器来进行。总的说来,就是把完成的网站内容通过一些方式(如FTP)上传到Web服务器,再对Web服务器进行相应的配置。
1.4 常用的网页设计软件
工欲善其事,必先利其器。要开发网站,没有功能完善的软件工具是不行的。本节介绍在网页设计和网站开发中最常用的软件。主要有网页设计工具Adobe Dreamweaver、平面设计工具Adobe Photoshop、网页图片设计和切图软件Adobe Fireworks及交互式矢量图和Web动画的设计工具Adobe Flash。
1.4.1 网页设计软件Adobe Dreamweaver
Dreamweaver是美国Macromedia公司开发的专业的网页编辑器。2005年Macromedia公司被美国Adobe公司收购,因此Dreamweaver也改名为Adobe Dreamweaver。目前最新版本是Dreamweaver CS5,其界面如图1-24所示。
图1-24 Adobe Dreamweaver CS5
Adobe Dreamweaver是集网页制作和网站管理于一身的所见即所得网页设计软件,是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。
除了可视化设计网页之外,Dreamweaver还有网站管理的功能。在使用Dreamweaver开发网站的时候,可以利用FTP、SFTP、WebDAV及RDS等协议与Web服务器连接,从而把本地设计好的网页上传到远程服务器上。
除此之外,Adobe Dreamweaver CS5还有版本控制功能,可以通过SVN协议与Subversion服务器通信。
1.4.2 平面设计软件Adobe Photoshop
Photoshop是Adobe公司推出的一款图像绘制处理软件,Adobe公司是世界上久负盛名的图形图像多媒体公司之一,其推出的软件被公认是世界范围内功能最强大的图形图像制作软件。Photoshop以其简单的操作方法和强大的功能,赢得了全世界众多图像制作人员的青睐,并成为图形图像制作和设计领域事实上的标准软件。
Photoshop拥有众多的插件(滤镜)和工具,能够很容易地实现各种绚丽多彩的效果,因此是网页设计中图像设计的首选软件。Photoshop目前最新版本是Photoshop CS5,其界面如图1-25所示。
图1-25 Adobe Photoshop CS5
1.4.3 网页图片设计和切图软件Adobe Fireworks
Fireworks是Macromedia公司发布的一款专门进行网络图形设计的图形编辑软件,由于Macromedia公司被Adobe公司收购,因此改名为Adobe Fireworks。它大大简化了网络图形设计的工作难度,无论是专业设计师还是业余爱好者,使用Fireworks都不仅可以轻松地制作出十分动感的GIF动画,还可以轻易地完成大图切割、动态按钮、动态翻转图等,因此,对于辅助网页编辑来说,Fireworks是非常有用的图像处理工具。其界面如图1-26所示。
图1-26 Adobe Fireworks CS5
1.4.4 动画设计软件Adobe Flash
Flash同Fireworks及Dreamweaver一样,原属Macromedia公司,后由Adobe收购,最新版本为Adobe Flash CS5。Flash是一种二维矢量动画软件,用于设计和编辑Flash文档,目前Flash动画是Web动画的标准。
Flash技术被大量地运用于网页设计当中,主要有网页广告、视频播放、音频播放,甚至网页游戏。恰当地使用Flash技术,可以使网页充满动感效果。
1.5 小结
网站开发是一个充满挑战和激情的职业。网页设计是一个感性思考与理性分析相结合的复杂的过程,它的方向取决于设计的任务,它的实现依赖于网页的制作。正所谓“功夫在诗外”,网页设计中最重要的东西,并非在软件的应用上,而是在我们对网页设计的理解及设计制作的水平上,在我们自身的美感及对页面的把握上。
本章介绍了网站当中的一些基础知识、基本概念及一些常用的技术和软件工具。这些知识是网站建设所必须了解的。关于本章所提到的这些技术和软件工具,本书后面会有详细的介绍,在此不做深入说明。在后面的一章中,将详细介绍网页设计的基础,即HTML语言。