基于HTML5的企业微网站建设

2018-06-02尤鸿霞

电脑知识与技术 2018年10期

尤鸿霞

摘要：随着移动互联网的蓬勃发展，手机成为最重要的多媒体终端之一，适应移动终端的微网站也越来越受到关注。阐述了微网站的特点，内容精简响应速度快，能自动适应手机屏幕大小。介绍了适合微网站开发的HTML5相关技术及其新特性，以案例为依托描述了企业微网站的建站技术原则及实现。

关键词：微网站；微信公众号；HTML5

中图分类号：TP393 文献标识码：A 文章編号：1009-3044（2018）10-0268-02

Abstract： With the rapid development of mobile Internet， mobile phone has become one of the most important multimedia terminals， Micro-websites that adapt to mobile terminals are getting more and more attention.This paper expounds the features of micro-website， the content is concise and the response speed is fast， it can automatically adapt to the screen size of mobile phone.The technology and new features of HTML5 was introduced that suitable for micro-website development， the technical principle and realization of the construction site of enterprise micro-website were described based on the case.

Key words：micro-website； WeChat； Public accounts； HTML5

1引言

移动互联网的蓬勃发展改变了人们的上网方式，人们生活节奏越来越快，传统PC网站在移动端浏览时的不便利性越来越明显[1]，利用闲散时间在手机端完成网页浏览，趋势明显，因此适应移动终端的微网站越来越受到人们的关注。

2 微网站简介

微网站是一种基于智能手机等移动端的网站信息系统，是一种为适应智能手机用户激增的市场环境而诞生的一种新型网站。其特点是兼容iOS、Android等智能手机操作系统，能适应移动互联网，缓冲时间短，在当前网络推广营销中具有极为重要的地位。微网站比传统网站更适应移动互联网的发展形势，可以绑定微信公众号，非常便利地进行网站推广，具有更好的商业营销效果。在移动互联网迅速发展的形势下，以微网站来展示企业产品的这种方式更加的灵活化也更易接受。

3 HTML5 相关技术介绍

HTML5是 HTML的第5个版本，也是最新的版本，一经发布就受到开发者的广泛关注，是最近几年逐渐发展成熟的web前端开发技术，主要原因是其新特性能够有效解决当前移动Web应用所遇到的众多问题，使移动Web网络更便利。在客户端浏览方面，它与传统的HTML代码最大的区别就是：HTML5可以根据用户所使用的终端的屏幕大小来自动调整页面大小，以达到最好的浏览效果，在手机端，它可以适应苹果、安卓等不同的系统。

针对传统Web应用遇到的问题，HTML5技术提供了一些新特性[2]。1）本地存储。基于HTML5开发的网页APP拥有更短的启动时间，更快的联网速度，这些全得益于HTML5 APP Cache，以及本地存储功能。2）设备访问特性。HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以直接与浏览器内部的数据直接相连，HTML5的 Media API提供了对移动终端摄像头的可编程访问。3）图像处理技术。HTML5中定义了一个新的标签来进行图像处理，在绘图方面提供了一系列绘图方法，可以实现铅笔画、直线、填充等操作，在图形处理方面也给出了非常多的方法，通过WebGL提供的技术方案直接在网页上展示3D物体形象，其绘图性能可以直接使用终端设备的图形处理器能力。4）多媒体特性。在HTML5中，增加了

4 企业微网站设计与实现

基于HTML5技术为某服装企业建设微网站为例，该企业属于中小型企业，建站过程主要考虑如下要点。

4.1 企业微网站建设的目标及定位

对于中小型企业，建设一个网站，通常都是以展示企业形象，便于客户了解企业并推广企业产品为目的。根据企业的规模及经营需求，中小型企业大多将公司网站定位为信息发布型。即不需要太复杂的技术，以页面精简流畅为基本原则，主要用于介绍企业基本资料，发布企业产品信息，便于用户联系企业，这种类型的企业较少选择电子商务型网站。

4.2网站要求

网站的设计应从多方面来考虑其结构合理性、技术专业性、用户可接受性、易操作性等。

结合微网站特点，建站基本遵循以下原则。

1）完全适合手机、平板，能够自动识别客户屏幕大小[3]；

2）网站内容精简；手机网站比PC端网站的页面下载速度要慢得多，因此尽量把页面数和页面大小控制到最低。

3）页面资源小，加载速度快；避免使用弹窗、flash、java等行为。flash和弹窗等行为将会占用很大一部分流量，对于移动手机用户而言，无疑会浪费时间和流量，对于搜索引擎而言，基本理解不了。用户看网站不是看你网站代码多复杂，网站多美观，而是看你网站能不能在最短的时间找到他想要的答案。

4）快速的得到企业联系方式。一键拨通电话、一键分享、在线留言、地图导航等；

5）可以和微信公共平台完美结合；

4.3开发案例

依据某服装企业需求，网站的前端信息模块设计有首页，公司简介、产品展示、新闻中心、联系我们这些模块。在手机端登录时，页底处设计有网站首页、联系企业、进入留言板三个按钮。

5结语

在移动互联网普及的时代，微网站有助于企业在移动互联网上推广产品。HTML5是微网站开发的利器，其开发的产品满足移动端的浏览需求，具有实践意义。通过将企业网站绑定在企业微信公众号，可以利用微信数亿的用户群进行线上推广，可以降低营销费用，提高营销成效。