中小型企业类门户网站分析与设计

刘松

摘要：随着信息时代的到来，企业类门户网站得到了极大地普及，越来越多的企业开始着手建设具有自身企业特色的门户网站，期待这些门户网站能够扩展企业的业务量，从而大幅增加企业的效益。本文提出了一种采用HTML、CSS及JavaScript技术实现小型企业类门户网站的具体分析和设计方法，希望能对中小型企业类门户网站的快速，有效建立起到一定的促进作用。

关键词：门户网站； HTML； CSS； JavaScript

中图分类号：TP302.1

Abstract：With the advent of the information age， enterprise portal website has been greatly popularized， more and more enterprises begin created their portal website and look forward to the expansion of business volume and increase the enterprise's benefit. This paper presents the specific analysis and design of a kind of method to achieve small enterprise portal website by using HTML， CSS and javaScript technology. It will create the small and medium scale enterprises portal website quickly and effectively.

Key words： portal WebSite； HTML； CSS； JavaScript

0 引言

随着网络信息时代的到来，种类繁多的企业类门户网站得到了高度关注与重视普及，越来越多的企业开始着手建设具有自身特色的企业门户网站，以期借助这些门户网站能够扩展企业的日常实际业务量，进而大幅增加企业的经济效益[1]。

本文采用HTML、CSS及JavaScript技术实现中小型企业类门户网站的快速建立，该设计方案能够利于日后的网站升级和维护操作，具有一定的现实意义和实用价值。

1 中小型企业类门户网站的整体布局

1.1 中小型企业门户类网站的设计分析

本文以一个中小型电脑有限公司的网站为例，介绍了中小型企业类门户网站的整体布局分析和设计方式。该网站主要包含的功能有网站首页、公司介绍、新闻资讯、产品报价、三大件报价、服务支持、人才招聘、员工风采和客户留言等分组页面构成。网站的功能设计框图如图1所示。

1.2中小型企业门户类网站的架构设计

中小型企业门户类网站的首页效果原型图如图2所示。页面头部模块包含中小型企业门户类网站的LOGO信息和搜索栏。导航条模块包含整个中小型企业门户类网站的子页面导航菜单。页面的主体由网站公司的Banner条和3类网站资讯组成，页脚模块则包含了公司的联系方式以及网站导航等信息[2]。

根据图2所示的页面原型结构图，研究设计出如图3所示的页面总体框架图。页面的总体框架布局选用了垂直的上、中、下结构。本文采用DIV+CSS的方法实现该页面总体框架结构。主要代码如下：

2 中小型企业类门户网站的内容设计

2.1 中小型企业类门户网站的页面头部模块设计

中小型企业类门户网站的页面头部模块主要包含网页头DIV区域和网页导航菜单DIV区域。其中，Header区域主要用于提供网站的Logo图片显示以及网站内容搜索功能的实现。中小型企业类门户网站的页面头部模块主要结构代码如下：

2.2 中小型企业类门户网站的Banner区设计

中小型企业类门户网站的Banner区域设计的目的是用来发布公司网站的最新活动以及新产品展示等内容，旨在吸引用户，提高网站用户访问量。该区域通过利用HTML代码显示图片的形式来展现公司的风采。并用CSS代码控制图片的宽度和高度，尽量使得展示图片在不同类型的浏览器中能够保持效果一致。主要的HTML实现代码如下：

2.3中小型企业类门户网站的资讯区设计

中小型企业类门户网站的首页咨询区域设计分为3个模块：活动新闻模块、创新展示模块和获奖产品展示模块。主要的实现代码如下：

3 结束语

本文给出了一套切实可行的中小型企业类门户网站分析与设计解决方案，该方案通过

HTML、CSS及JavaScript技术实现了中小型企业类门户网站分析和设计全过程及指定效果展示。实际应用效果表明，该方案能够扩展中小型企业的日常业务量，从而大幅增加企业的效益。进一步，也将对中小型企业类门户网站的快速和有效建立能起到有益、且良好的促进作用。

参考文献：

[1]刘玉红. HTML5+CSS3+JavaScript[M]. 北京：清华大学出版社，2015 .

[2]郑娅峰，张永强. 网页设计与开放 [ M] .北京：清华大学出版社，2016 .