张志一 耿秀春
Analysis of the General Process of Website Construction
ZHANG Zhi-yi GENG Xiu-chun
摘要:本文根据多年从事网络程序设计工作和讲授计算机专业相关课程的的教学实践经验,从需求分析、整体规划、搜集素材、网页设计、申请空间、测试发布、维护推广等七个方面进行详细的网站建设总流程的阐述。
Abstract: This article expounds the general process of website construction from seven aspects, requirements analysis, overall planning, collecting materials, web design, application space, test release, maintenance promotion based on seven years of experience in network programming and teaching computer science related courses.
关键词:网站;需求分析;规划;素材;框架;超链接
Key words: website;demand analysis;planning;material;framework;hyperlink
中图分类号:TP393 文献标识码:A 文章编号:1006-4311(2019)32-0249-03
0 引言
Web的发展日新月异,拥有自己的网站已经成为了一种潮流。随着大数据、人工智能、虚拟现实等诸多高科技的出现,当今社会对复合型人才的需求会日益增多。伴随着微信、支付宝、云闪付等便捷支付app的出现,对淘宝、京东等线上维护人才的要求越来越高,熟知网站建设的总流程十分重要。
1 需求分析
建立网站时,根据企业客户的需求,了解网站建设的目的、功能模块、市场调研情况等信息。其中,网站建设的目的尤为重要。有些企业想树立企业的形象,打响知名度,互联网的时代推广宣传还是很有效果的。有些企业是为了提供更好的产品与服务,客户可以不受时间地域的限制,方便快捷的获取自己需要的信息,吸引更多的客户群体。还有些企业是为了开拓更大的市场,方便发展电子商务,以获利更多。
2 整体规划
2.1 风格
风格是抽象的,在这里是网站的整体形象给浏览者的综合感受。包括标志、版面设计、浏览方式、交互性、内容价值、存在意义等诸多因素。例如:瑞丽网站是时尚前卫的,KFC订餐网站是生动形象的,联想集团的网站是专业严肃的。个人认为,logo一定要放在最显眼的位置,网页的色彩要用同一色系的,利用好网页配色,以突出主题,更能吸引浏览者的眼球。
2.2 布局
网站的布局,根据企业用户需要,构思好网页的数量,每个网页显示的内容,以何种形式展示。
2.3 语言脚本
网页中的编程语言很多,有PHP、ASP、JavaScript、VBScript等。ASP是微软公司推出的取代CGI的新技术,基于开放设计环境的Active X技术,使用所有的开发工具来创建和运行交互式的动态网页,例如物流库存管理、图书借阅系统、足球论坛、用户登录界面等。它简单易学,还可以自己定义和制作组件,让动态网页无限扩充。还可以利用ADO访问数据库,对数据进行处理。鉴于以上优点,个人建议优先考虑ASP脚本语言。
2.4 数据库平台
数据库的种类很多,如SQL Server、Access数据库、FoxPro数据库等。SQL功能强大、简单易学。SQL数据库的数据体系结构基本上是三级结构,还有数据加密的功能。SQL用户可以作为独立的用户接口,做终端用户。对于SQL数据中的操作,分为数据定义、数据查询、数据更新和数据控制四个方面,其中数据安全性的方法是通过对数据库存取权力的控制来防止非法使用数据中的数据,安全性比较高。个人建议采用SQL数据库。
3 搜集素材
3.1 文字资料
和客户沟通好建设网站的目的后,自己撰写相关的文字描述,也可网络中搜索符合网站主题的文本资料,统一汇总到doc或wps文件中。网站中所有网页需要的文字资料,统一格式,做好标记,以便快速检索相关信息。
3.2 图片
3.2.1 BMP格式
BMP采用位映射存储模式,在Windows环境中运行的处理图像的软件均支持这种格式。它不支持文件壓缩,不适用于 Web 页。
3.2.2 GIF格式
GIF文件是一种无损压缩格式,其压缩率大约50%,相关软件都支持它。GIF最多支持256种色彩的图像。
3.2.3 JPG格式
JPG是最常用的图像文件格式,是一种有损压缩格式,JPEG压缩技术十分先进,它可以用最少的磁盘空间得到较好的图像品质。JPG是灵活的格式,支持多种压缩级别,压缩比率通常在10:1到40:1之间。它压缩高频信息,保留色彩较完整,较适用于网页设计中,可把文件压缩到最小,所有的浏览器都可以以最快速度打开它,但它不适合颜色少、大区域颜色接近简单的图片,适合色彩多的图片。
3.2.4 AI格式
AI格式可以在CorelDRAW中打开并修改,是一种矢量图形文件。它和PhotoShop中存储的psd文件一样,都是分层文件,每层都作为一个对象,具有各自的属性。如文字作为对象,其属性在外观选项卡,可以设置字符的描边、填色、不透明度等属性值。该格式文件方便修改,可以自动匹配最高分辨率输出,兼容性较好。
3.2.5 PNG格式
PNG格式可以在PhotoShop中打开,并进行编辑处理。可以比GIF格式的文件再缩小30%左右,也是一种新兴的无损压缩图像格式,还可以兼容所有的浏览器,使用广泛。
根据以上介绍,设计者可以自由选择图片格式,在PhotoShop、CorelDRAW软件中进行图片的修改,也可直接网络中搜索合适的图片,下载直接用。个人建议下载后的图片,最好还是使用图像处理软件进行后期处理,修改为符合网站主题的图片素材。
3.3 动画
3.3.1 GIF格式
GIF格式是基于LZW算法的一种无损压缩模式,相关软件都支持它。最大的特点,可以在一个GIF文件中存储多个彩色图像,当用浏览器打开时,它会像是Flash中的逐帧动画一样显示在页面中。很多初学者,可以利用GIF小软件,制作出小型的简单的动画。
3.3.2 SWF格式
SWF格式是Flash动画软件可以打开的,它是一种多媒体文件,可以是声音、视频、动画等的综合体。浏览器想要运行打开,必须安装Adobe Flash Player IE插件,大部分电脑系统内默认已经安装,定期进行更新即可。这种格式的文件,在游戏网页中经常用到。
关于动画,个人建议采用swf格式,有能力者,可使用Flash軟件,进行符合网站主题的动画创作。
3.4 视频
3.4.1 MOV格式
MOV格式是在QuickTime Player软件中编辑,结合音频和视频,用于存储数字的流式视频。它是多轨道存储信息,还不限制数目。它还可以边下载边观看,不必等全部下载完毕才可以观看。
3.4.2 RM格式
RM格式是RealNetworks公司开发的视频文件,可以根据网络数据传输速率不同而修改不同的压缩率比,来实现即时播放。目前,很多网站用来进行重要事件的实况转播。
3.4.3 FLV格式
FLV是一种流媒体格式,具有文件容量小、下载速度快等优点,适于网络发展用。如美国的YouTube网站、国内的土豆网、新浪视频播客等都是使用FLV格式的视频。
根据实际情况,选择合适的视频格式。
3.5 音乐
3.5.1 MP3格式
MP3是利用音频压缩技术,将声音用1:10甚至1:12的压缩率压缩成容量较小的文件,可以保持较好的音质。
3.5.2 MIDI格式
mid格式是由MIDI继承而来。它记录声音的信息,然后告诉声卡如何再现音乐的一组指令。mid文件重放的效果完全依赖声卡的档次。
4 网页设计
4.1 构建网页的框架
4.1.1 国字型
最上部分放置网站的标志和导航栏或Banner广告,页面中间防止网站的主要部分,下部分放置网站的版权信息和联系方式等。
4.1.2 T型
顶部放置网站的标志或Banner广告,页面下方左侧是导航栏菜单,页面下方右侧放置网页正文等主要内容。
4.1.3 内页型
一般是用来显示文章页面、新闻页面和注册页面等。
4.1.4 左右框架型
左侧一般是导航栏链接,右侧放置网站的主要内容。
4.1.5 上下框架型
上侧一般是导航栏链接,下侧放置网站的主要内容。
4.1.6 综合框架型
结合上下框架型和左右框架型。
除了以上六种类型,还有封面型、FLASH型等。不就是最适合用户浏览的方式将文字等资源排列在网页中不同的位置,为客户提供舒适、友好、简单的访问体验,因此良好的页面布局的效果,应具备条理清晰、主次分明、色彩对比度适当、布局疏密适当等特点。
一般用表格(table)来布局,来制作网页的框架,也可运用css+div来实现。
4.2 设置导航栏
每个页面展示的内容不同,导航栏内容也不相同,位置和信息都是根据企业客户需求制定即可。导航栏的命名最好是见名之意,可以体现企业的特色,让用户迅速搜索到想要了解的信息,让用户有很好的体验。
4.3 页面内容
根据3收集素材的资料,分网页编辑,设置对应的格式,添加到合适的位置。
4.4 超链接的设置
超链接是Web页面区别于其他媒体的重要特征之一。它的载体可以是文本,也可以是图片,也可以是图片的一个或多个区域形成的热点。它是网站中最重要的组成部分,可以从一个网页跳转到另一个网页,多个网页因为有了超链接才会形成一个网站。
根据企业客户需求,利用 链接文字进行超链接的设置。
5 申请空间
网站制作完成后,注册一个自己的域名,租用服务器的空间来存储网站的所有内容。
6 测试发布
网站发布之前,必须进行缜密的测试,以保证浏览正常,达到预期效果。测试的内容大约是租用服务器的性能是否可靠、浏览器的兼容性、数据库的检索是否正常、超链接是否正确、文字资料是否有错别字、网上下载的素材是否涉及到侵权问题等。
7 维护推广
当今社会发展迅速,企业为了适应时代的步伐,也会有所改变。定期对站点内的信息进行更新与维护,做到线上线下信息统一。最重要的是对软硬件以及数据库的维护,以免导致信息外泄,造成不必要的损失。
8 结束语
对于企业来说,网站建设的必要性大体分为三类:发展业务、争取新客户和服务老客户。网站可以全年无休运转,相当于企业聘请了一个不讲报酬、从来不迟到早退、永不知疲倦的销售员,还永远开放的商场,让顾客何时何地都可以了解企业信息。网上还可以留言答疑解惑,也可以在线实时交流,方便售后的服务。对于学校来说,网站的建设更为重要。提高知名度,方便报考的学生更好地了解学校的各方面的信息。对于个体户来说,可以建立自己的网站,销售农产品、水果、当地土特产等。了解网站建设的总流程,百益无一害。
参考文献:
[1]商玮.电子商务网页设计与制作[M].北京:中国人民大学出版社,2016.
[2]聂斌,张明遥.HTML+CSS+DIV网页设计与布局[M].北京:人民邮电出版社,2018.
[3]李晓斌.PHP+MySQL+Dreamweaver网站建设全程揭秘[M].北京:清华大学出版社,2018.
作者简介:张志一(1980-),男,山东济南人,中级讲师,工学学士,研究方向为计算机科学与技术;耿秀春(1981-),女,山东济南人,中级讲师,理学学士,研究方向为计算机科学与技术。