随着互联网技术日益发展, 网站建设一直是学校信息化建设的重要组成部分。为了及时公布学校的发展动态, 大力宣传各专业的教学特色, 建立学校及各级学院的网站是最主要的互联网宣传手段之一。对此本文旨在研究和设计基于HTML5标准的网站, 使用当前移动互联网主流技术, 为师生提供便捷的交流平台, 同时为社会了解学校及各级学院提供了更好的窗口。

HTML5是W3C (World Wide Web Consortium, 万维网联盟) 制定的最新应用HTML标准, 具有跨平台、强交互、社交分享性强等传播优势, 使网页布局能够根据不同种设备的屏幕分辨率自我调整, 从而达到较合适的布局效果, 使移动终端用户体验较好, 是在移动设备上展示多媒体信息的理想形式, 对网站的设计与传播具有应用价值。

1 开发技术简介

学院官网主要存储新闻, 公告, 动态以及学生信息, 规模较小, 我们选用了PHP+MySQL+Apache框架来搭建网站, 这一组合有很高的工作效率和系统性能, 尤其适合中小型规模网站的开发。Apache是一款开源的Web服务器, 具有较好的应用性和安全性。MYSQL履行后台数据库之职。PHP是文本预处理器 (Hypertext Preprocessor) 的缩写, 是一种开源的动态网站开发语言, 系统资源占用少, 性能稳定快速, 代码执行速度快。不仅有极强的包容性, 还极易学习与掌握。PHP具有很好的跨平台性、开放性和可扩展性, 有很多成熟的框架, 有成熟的面向对象体系, 作为一个使用较多的网站建设语言, 对于网站的发展有着积极的促进作用。

2 网站系统分析与设计

2.1 设计原则和对象

网站的设计原则是应用HTML5的特点——响应式布局来方便学生与老师在各种设备上浏览网站、访问网站的速度快、具有较好的安全性和易于维护和升级。

网站的对象主要是教师和学生, 是加强学院与教师、学院与学生联系的纽带, 以能够即时发布新闻、开展学院活动和学生学习的相关资料为目标。

2.2 功能分析

1) 前台系统功能

在Web应用中用户直接看到的界面, 即Web页面的结构 (logo+导航栏、轮播图、新闻动态公告、教师寄语、友情链接) 。主要功能包括:学院概况, 教务工作, 学生工作, 招生就业, 党建工作, 合作交流, 公共服务, 图书资源。

2) 后台系统功能

考虑的是如何实现数据的存取以及增删改查的功能、平台的稳定性与性能等。主要功能包括:信息管理。其中, 信息管理又包括学院动态管理、新闻管理、图库管理、视频管理和用户管理。

2.3 模块设计

基于模块化设计的网站适用于响应式框架, 具有更好的可扩展性能。采用模块化设计, 可以将复杂的网站拆分为各个具有独立功能的小网页, 逐一设计实现, 从而降低整体的设计难度, 整合后也能很好地推广到整个行业, 也有利于网站的后期扩展和升级。模块化设计可以使网站的数据层、界面层更加清晰, 某一模块的变动不会影响其他模块, 可以大大降低网站的维护成本。

2.3.1 页面布局模块化

一个完整的网页, 需要划分为多个模块, 例如头部、底部、列表、侧边栏等等, 每个独立为一个模块, 每个模块均有自己独立的功能与文件, 在开发的每一个子页面中只需调用这些模块。部分代码如下:

2.3.2 后台管理模块化

PHP具有后台管理模块设置功能, 分为简介模块, 文章模块, 下载模块, 图片模块, 留言系统等。后台管理主要用于网站管理员进行模块的修改, 管理员具有实现添加, 删除, 修改内容的权限。修改的模块内容不会对整体页面布局产生影响。模块化设计有效缩短了网站开发周期, 同时可视化后台为后续网站更新和管理提供便利。示例如图1所示:

图1 后台可视化界面的文章模块   下载原图

2.4 数据库设计

数据库用于对存储的数据进行分类, 并建立数据检索, 通过检索可以实现高速有效地查询数据。合理设计数据库能有效节省数据存储空间。数据库设计分为概念结构设计, 逻辑结构设计和物理结构设计。我们根据功能设计画出E-R图, 建立用户表、新闻表等。用户表管理用户、密码、设定角色、设置访问系统的权限, 新闻表用于添加、删除、修改文章。下面列出部分数据表。

表1 新闻表     下载原表

3 网站实现

图2 手机屏幕效果图   下载原图

图3 电脑屏幕效果图   下载原图

PC端中的导航栏呈现在顶部, 而在移动设备上, 则将它隐藏在llooggoo右右侧侧, , 这这便便是是响响应应式式网网站站针针对对不不同同设设备备的的折折叠叠效效果果。。充充分分运运用用这这个个技技术术能能够够很很好好地地将将导导航航栏栏隐隐藏藏, , 使使整整体体页页面面清清爽爽整洁, 有效节省屏幕空间, 用户使用起来也极为便利。

4 结束语

在移动互联网时代, 学院的宣传形式、内容及平台应积极利用新媒体技术。利用PHP网站可以快速简单地开发网站, 基于HTML5的网页新标准具备响应式布局的特点, 尤其适合移动端用户。本文研究了php的特点和使用方法, 探讨了建设网站的过程, 具有可行性, 通过以上研究, 可以为高校宣传各级学院工作提供思路和参考。