网页制作技术及网站建设

（四）网页制作技术及网站建设

除了网络硬件和软件基础建设外，企业开展电子商务的首要工作是开发制作商务定位的网页，并将网站系统上传到网络空间，这样才算在网上安了家。

1.客户端软技术选择

（1）HTML的特点及技术方案

HTML是超文本标记语言Hyper Text Markup Language的简称。HT-ML语言的特点是简单易用，它通过提供一定的文本结构和格式，使其能够在浏览器上呈现给访问它的用户。HTML不同于一般的ASCII文件，是对ASCII文件的一种增强版本。它在文件中加入标签，使其可以显示各种各样的字体、图形及闪烁，还增加了结构的标记，如头元素、列表和段落等，并且提供到Internet上其他文档的超文本链接。HTML成为Web上的通用语言，用它可以方便地制作网页、建立链接，很快它便成为了Web蓬勃发展的基石。但是，HTML过于简单，随着Web文件内容的增多和形式多样化，越来越显得不适应，原因是HTML定义了唯一的文件类型，并且标记集不能被改动，简单易用却牺牲了语言性能。

（2）XML的特点及技术方案

XML是扩展标记语言Extensible Markup Language的简称。它继承了SGML的可扩展性、结构性及可校验性。与HTML语言相比，其区别主要在三个方面：一是扩展性。HTML不允许用户自行定义他们自己的标识或属性，而在XML中，用户能够根据需要，自行定义新的标识及属性名，以便更好地从语义上修饰数据。二是结构性。HTML不支持深层的结构描述，XML的文件结构嵌套可以复杂到任意程度，能表示面向对象的等级层次。三是校验性。HTML没有提供规范文件以支持应用软件对HTML文件进行结构校验；而XML文件可以包括一个语法描述，使应用程序可以对此文件进行结构确认。HTML用来显示数据，XML则是描述数据本身，后者可以多种方式显示，也可以由其他应用软件进行深入的处理。在超链接方面，HTML虽然可以链接本机或其他主机上的文件，但只能指定单向且固定的链接位置，XML可以建立多重链接，除目标网页位置外，同时可提供如何从其他网址链接的信息，可以进一步指定目标网址找到后的动作。

（3）Javascript的特点及技术方案

Javascript（Scripting Language）是由网景Netscape公司开发的一种脚本语言，或者称为描述语言。它是一种由Netscape的LiveScript发展而来的原型化继承的面向对象的动态类型的区分大小写的客户端脚本语言，主要目的是为了解决服务器端语言，为客户提供更流畅的浏览效果。在HTML基础上，使用Javascript可以开发交互式Web网页。Javascript的出现使得网页和用户之间实现了一种实时性的、动态的、交互性的关系，使网页包含更多活跃的元素和更加精彩的内容。运行用Javascript编写的程序需要能支持Javascript语言的浏览器。微软公司还有自己开发的Javascript，称为JScript。Javascript短小精悍，又是在客户机上执行的，大大提高了网页的浏览速度和交互能力。

（4）CSS的特点及技术方案

CSS是Cascading Style Sheet的简写，有时也译为“层叠样式单”或“级联样式单”。在主页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其他效果实现更加精确的控制。CSS的特点是：在几乎所有的浏览器上都可以使用；以前一些必须通过图片转换实现的功能，现在只要用CSS就可以轻松实现，从而更快地下载页面；使页面的字体变得更漂亮，更容易编排，使页面真正赏心悦目；可以轻松地控制页面的布局；可以将许多网页的风格格式同时更新，不用再一页一页地更新了。可以将站点上所有的网页风格都使用一个CSS文件进行控制，只要修改这个CSS文件中相应的行，那么整个站点的所有页面都会随之发生变动。

2.服务器端技术方案选择设计

（1）CGI的特点及技术方案

CGI是Common Gateway Interface的简写。在物理上是一段程序，运行在服务器上，提供与客户端HTML页面的接口。绝大多数的CGI程序被用来解释处理来自表单的输入信息，并在服务器产生相应的处理，或将相应的信息反馈给浏览器。CGI程序使网页具有交互功能。在运行环境方面，CGI程序最初在Unix操作系统上CERN或NCSA格式的服务器上运行；同时，在其他操作系统（如：Windows NT及Windows95等）的服务器上也广泛地使用CGI程序，同时它也适用于各种类型机器。CGI解决了静态页面的两个问题：一是可以动态地将数据和页面模板组合在一起，然后通过Web服务器发给客户端，实现Web服务器的动态网页功能；二是实现了客户端向Web服务器的数据传送和处理。

（2）ASP的特点及技术方案

ASP（Active Server Page）是服务器端的脚本环境，可以生成和运行动态的、交互的、高性能的Web应用程序。其特点是使用了简单易用和强大的COM对象技术。ASP使用VBScript、JScript等脚本语言作为开发工具，镶嵌于HTML文本中。当用户从浏览器向Web服务器提出请求时，Web服务器会自动将ASP的程序解释为标准的HTML格式的主页内容，用户端只要使用常规可执行HTML程序的浏览器，就可浏览ASP所设计的主页内容。另外，用户既可以直接在ASP页面中使用VisualBasic和VisualC^＋＋各种功能强大的COM对象，同时还可以创建自己的COM对象，直接在ASP页面中使用。通过使用第三方开发的各种COM对象，可以大大地节省开发人员编写代码的数量和时间。ASP＋是微软在ASP之后新推出的一种动态网站开发语言。

（3）JSP的特点及技术方案

JSP（Java Server Pages）是由Sun Microsystems倡导、许多企业参与一起建立的一种动态网页技术标准。JSP技术有点类似ASP技术，它在传统的网页HTML文件中插入Java程序段和JSP标记，从而形成JSP文件。它将内容的生成和显示进行分离。在服务器端，JSP引擎解释JSP标识和小脚本，生成所请求的内容，并且将结果以HTML（或者XML）页面的形式发送回浏览器。用JSP开发的Web应用是跨平台的，既能在Linux下运行，也能在其他操作系统上运行。JSP页面的内置脚本语言是基于Java编程语言的，并拥有Java语言“一次编写，各处运行”的特点。

（4）PHP的特点及技术方案

PHP是超级文本预处理语言Hypertext Preprocessor的简写。PHP是一种HTML内嵌式的语言，是一种在服务器端执行的嵌入HTML文档的脚本语言，语言的风格类似于C语言，应用广泛。它的特点是免费、简单实用、功能强大并具有可扩展性。它的语法混合了C、Java、Perl语言风格和语法框架，但能更快速地执行动态网页。在资源开放模式下，只要加入相应的模块，就可以使PHP的功能得到增强。PHP能够支持Sybase、Oracle、Informix、MSSQL等多种数据库，PHP还支持生成动态图像、IMAP、SNMP、LDAP、XML等。PHP具有良好的跨平台可移植性，可以在Windows、Unix和Linux系统下的Web服务器上正常运行，支持包括IIS、Apache等在内的多种流行的Web服务器。此外，当用户变换工作平台时，不需要更改PHP代码，直接就可以在新的平台上使用。PHP最大的优点是其跨平台性与免费，成本低。用户完全可以采用PHP＋Apache＋Linux＋MYSQL的全套自由软件进行开发。

（5）Java的特点及技术方案

Java由Sun Microsystems开发的专门用于像Internet这样的分布式网络的一种流行的编程语言。普通的Java程序就可实现动画和交互式网页的Applet。Java是用于Internet的面向对象的编程语言。可以在Web上开发相关的Web应用；也可以开发出各种类型的Internet应用，如HotJava。前者称之为Java Applet；后者称之为Java Application。

3.网页制作工具选择

网页是企业开展电子商务的基础载体和信息平台，是Internet上宣传和反映企业形象和文化的重要窗口。网页制作是指使用标识语言，通过一系列设计、建模和执行的过程将电子格式的信息通过互联网传输、浏览。

（1）FrontFage的特点及技术方案

FrontFage是微软的一个用于制作网页的十分强大而且友好的可视化的编辑工具。用户仅通过拖拽就可以轻易地建立一个主页。它支持多种网络技术和静态、动态的网页设计。网页制作由FrontPage中的Editor完成，其工作窗口由3个标签页组成，分别是“所见即所得”的编辑页，HTML代码编辑页和预览页。FrontPage带有图形和GIF动画编辑器，支持CGI和CSS。向导和模板都能使初学者在编辑网页时感到更加方便。FrontPage最强大之处是其站点管理功能。在更新服务器上的站点时，不需要创建更改文件的目录，FrontPage会为你跟踪文件并拷贝那些新版本文件。FrontPage是现有网页制作软件中唯一既能在本地计算机上工作，又能通过Internet直接对远程服务器上的文件进行工作的软件。

（2）Dreamweaver的特点及技术方案

DreamWeaver是一个常见的网页设计软件，一般包括可视化编辑、HTML代码编辑的软件包，支持ActiveX、Javascript、Java、Flash、ShockWave等技术，而且它还能通过拖拽从头到尾制作动态的HTML动画，支持动态HTML（Dynamic HTML）的设计。同时它还提供了自动更新页面信息的功能。Dream-Weaver是一种可视化的页面设计，具有开放式的插件功能，一般与制图软件组合使用，方便网站管理。DreamWeaver最大特征是它的开放式设计，这项设计使任何人都可以轻易扩展它的功能。

（3）Flash的特点及技术方案

Flash是一种交互式矢量多媒体技术，有灵巧的绘图工具，具有动画效果的按钮和菜单、图像的支持、声音的插入等功能。Flash的优点是体积小，可边下载边播放，这样就避免了用户长时间的等待。Flash6可以用其生成动画，还可在网页中加入声音。这样你就能在网页中生成多媒体的图形和界面，并使文件的体积较小。Flash虽然不可以像一门语言一样进行编程，但用其内置的语句并结合JavaScripe，用户也可做出互动性很强的主页来。

（4）Photoshop的特点及技术方案

Photoshop是Adobe公司旗下最为出名的图像处理软件，是一个集图像扫描、编辑修改、图像制作、广告创意，图像输入与输出于一体的图形图像处理软件，较受平面设计人员的喜爱。Photoshop的应用领域很广泛，在图像、图形、文字、视频、出版各方面都有涉及，Photoshop具有强大的图像修饰功能。利用这些功能，可以快速修复一张破损的老照片，也可以修复人脸上的斑点等缺陷。

4.网站规划要点

网站规划没有统一的界定和基本规则，有的只是基于成功网站的模板借鉴和套路参考。总体而言，企业网站规划最重要的是基于企业文化和商务定位的理解的网站要素、功能、技术、呈现形式的创新。

网站建设是一个复杂的系统工程，涉及多种技术及特定的商务定位。如何设计出合理的网页和网站结构，协助用户快速地发现其感兴趣的内容，并提供交互功能操作，完成相应的行为记录，成为网站规划的关键。一般而言，网站规划包括网站机构规划、网站功能规划、网站流程规划、网站主题风格规划和网站呈现方式规划等内容。基于传统制造企业的特点，本书重点探讨网站主题风格规划、网站机构规划、网站功能规划三种。

（1）网站主题风格规划要点

企业网站主题就是指网站围绕什么类型的企业、什么特征的产品、什么规格的服务来开展工作，是网站规划者对企业网站的理解、阐释、转换、表达、呈现的统一。网站代表企业的形象，具有特色的设计能给访问者留下深刻印象，增强企业在信息时代的竞争力。无论什么类型的网站，必然有它的主题，网站的风格应与主题相一致，同时还应考虑到客户群的行为特征。一个电子商务网站若选择了与其主题不相符的风格，不论它的技术多先进、形式多复杂，也会使人产生不协调的感觉。

通常，企业电子商务网站比较适合简明大方的风格。例如Dell公司的网站，其主页以简洁的图形突出网站的主题，以蓝色为该网站的基本色，无论是主页还是其后的链接页面都以蓝色为基调，给人以朴素明快的感觉。一个网站一般只能有一种主色调，其他颜色不宜超过三种。颜色太多，会给人产生杂乱花哨、不专业的感觉。除了颜色的心理效应外，挑选的颜色最好在通用的颜色调色板中存在，以确保浏览者在阅读时不会感到吃力。

（2）网站结构规划要点

网站结构规划是指网站规划者利用电子商务技术对网站要素、功能的合理配置和设计。网站结构是指布局在网站上的网页、文本、图片、照片、表格、动画、声音、影像及其存放目录等对象之间的物理的和逻辑的关系，涉及数量、类型、用户对象、现存架构、拥有者、结构、名称、网站导航、网站索引、网站地图、网页地址等内容。网站结构影响了客户完成任务的效率及其体验，好的网站结构可以留住客户，反之会失去客户。

在规划阶段，根据网站的目的已确定出网站的导航结构，设计阶段可根据企业实际情况对导航结构作进一步地细化和增减。在内容较多、流程较复杂的情况下可对某个栏目添加若干个频道的子栏目。一般企业型网站的导航栏目包括：公司简介、企业动态、产品介绍、客户服务、联系方式、在线留言，必要时可增加常见问题、营销网络、招贤纳士、在线论坛、英文版等栏目，并确定出这些栏目在网页中的具体位置。

（3）网站功能规划要点

网站内容就是指网站能做什么，具体包括什么功能，如何实现这些功能等。网站功能规划一般包括网站的功能模块规划、网络功能的整合设计、网络功能的实现方式设计与网站功能的技术实现方案选择。

网站的功能模块的规划。一般包括企业基础资源管理、用户注册管理、商品管理、订单管理、物流配送管理、支付管理、客户服务管理、权限管理等内容。不同类型的网站的功能结构会有所差异，例如企业宣传型网站、综合应用型网站、行业型网站、商务型网站的功能就有所不同，必要时需要画出模块实现的程序流程图。

网站功能的整合设计。对一些综合性的网站，必要时需要进行功能的整合，如对引导页、会员系统、网上购物系统、在线支付、问卷调查系统、信息搜索查询系统、流量统计系统进行整合。

网站功能的实现方式设计。网站是通过一个个页面来实现的，实现时是通过动态网页还是静态网页？营销内容采用列表方式还是地图展示方式？等等。这些问题需在网站功能实现方式设计中给出答案。

网站功能的技术实现方案选择。对于企业的网站功能实现，可能存在多个不同的技术解决方案。在技术实现方案选择时，需要回答如下问题：是自建服务器还是租用虚拟主机？采用模板自助建站、建站套餐还是个性化开发？选择什么样的动态脚本及相应的数据库，是ASP、JSP，还是PHP脚本？是SQL、ACCESS数据库，还是ORACLE数据库？采用何种类型的操作系统，是Windows系列还是Unix系列？流媒体软件采用Microsoft公司的Media Play Server、Real One公司的Real Media Server（包括Real Audio和Real Movie），还是Sun公司的Flash Media Server？在新技术的采用上既要考虑技术成本，又要考虑主要目标访问群体的分布地域、年龄阶层、网络速度、阅读习惯等，明确这些不同技术的投入成本、功能、开发、稳定性和安全性等。

5.网站上传发布的要领

网页制作完毕，最后要发布到Web服务器上，才能够让企业用户看到，现在上传的工具有很多，有些网页制作工具本身就带有FTP功能，利用这些FTP工具，你可以很方便地把网站发布到自己申请的主页存放服务器上。网站上传以后，你要在浏览器中打开自己的网站，逐页逐个链接地进行测试，发现问题，及时修改，然后再上传测试。全部测试完毕，就可以把你的网址告诉给周围的人，让他们来浏览。

因此，网站上传发布最重要的是要做好以下工作：

第一，选择好网站发布和运行的方式。即根据企业技术规划，根据对应服务器模式采取合适的方式将网站上传到服务器空间，并采取合适的运行措施。

第二，网站测试。网站在项目开发团队的试运行正常并不一定代表上传到网络服务器的正常。因此，需要对网站的每一功能、要素变动做一个详细的检查、试运行。

第三，网站的发布。不同的服务器模式有不同的发布要求，企业应根据自身服务器模式选择对应的发布方法。同时，还要选择好发布工具、发布流程。