基于HTML5技術校園微網手機APP的設計與實現

趙冠業 鐘建敏

摘 要：隨著智能終端技術、無線網絡技術和移動互聯網的快速發展和普及，人們更習慣于手機等移動終端跨越時間和空間的維度方便地從網絡上獲取各種信息資訊和在線服務。本文基于作者在學校網絡中心從事校園信息化建設工作學校門戶網站運維多年的經驗，借助主持廣西教育科學“十三五”規劃課題《基于“互聯網+”智慧校園APP云平臺建設與應用研究》機會，總結學校門戶門站存在的問題，并結合當前流行的HTML5技術提出新型微官網的開發目標、主要功能和所需的技術，為提升學校形象，促進學校人才培養的社會宣傳起到了重要推動作用。

關鍵詞：微網;手機APP;HTML5

一、傳統網站存在的主要問題

在互聯網時代，學校網站越來越流行，現在大部分學校都有屬于自己的門戶網站，不可否認，校園網站建設在實現教育現代化中發揮的作用越來越大，但是目前學校門戶網站建設依然存在一些問題。除了網絡硬件資源不夠完善、學校領導不夠重視、人員技術層面的缺乏等問題，在網站設計和實現技術上也存在較多的問題，如網站欄目設置冗余導致發布內容相似、欄目順序的排列較為混亂和主次不分明的不良局面;在技術上，一些網站還停留在傳統技術，注重的是“做”而不是“用”的網站，導致用戶體驗非常差，比如我校網站采用老掉牙、運行效率低，漏洞百出的ASP程序開發，導致網站隨時有可能被入侵、被人放黑鏈等的安全風險。

二、新型官網開發目標

新型官網開發目標是開發出一個網絡環境安全、擁有自主管理、功能齊全并視覺效果煥然一新的新型官網，新型官網主要可實現跨平臺、多終端瀏覽器適配顯示，無論是使用筆記本電腦、臺式電腦、平板電腦還是智能手機訪問響應式綜合門戶信息系統，從頁面布局到字號間距，都可以彈性適配，用戶閱讀體驗得到大幅提升，從而大幅提高學校利用網絡媒體的宣傳水平。因此新型官網開發需滿足兩種情況：一是當用戶用PC端瀏覽網頁，呈現的內容完整、界面大氣的視覺體驗;二是當用戶使用手機等移動終端瀏覽網站，以微網方式內容精煉、界面精悍呈現，微網既微網站，可以方便的與微博、微信等應用融合鏈接，主要特點是適應移動客戶端瀏覽網頁，對瀏覽體驗與交互性能要求較高的新一代網站。

三、新型官網開發主要功能點

當前，大部分學校隨著移動互聯網的發展已通過自主開發或者購買各種手機APP應用系統，App是Application的簡稱，手機app是指安裝在智能手機上的應用程序，為用戶提供更豐富的使用體驗為主要手段。因此新型官網開發所實現的功能除了具備學校普遍的業務功能外，還應有手機App的功能特性：

1.基本要求：支持手機和PC客戶端并支持微信傳播。

2.在線報名系統：在線提交個人報名資料 后臺跟蹤跟進。

3.新聞發布系統：基本功能應有鏈接管理、欄目管理、添加文章、文章審核（發布）、 評論文章、選擇模板等;特色功能有允許評論、關閉評論、兩級審核、不同欄目不同模板、點贊功能、分享功能等。

4.問答系統（招生問答）：基本功能實現統一的用戶名密碼、用戶注冊、用戶提問、指定回答人員、回答過的問題才在前臺顯示;特色功能應具有支持微信登錄、QQ登錄。

5.教師微博：指定人員開通、添加文章、文章列表、開通或關閉評論。

6.社團小組空間： 指定人員開通、投稿、發布 。

7.官網首頁友情鏈接管理：實現后臺添加，包含其logo圖片鏈接。

8.重要通知與OA系統平臺同步：比如校辦在OA系統發布有關畢業生返校領取畢業證這一相關信息，能具有選擇性的推送到官網首頁的通知欄目。

9.微信公眾平臺二次開發，主要實現以下功能：招生報名與官網招生報名系統同步;具有微調查、微互動（投票、刮刮卡等游戲互動功能）、校園微出行（校園周邊交通信息、天氣、地圖導航）。

10.服務器空間自主管理：提高安全性和自主管理的靈活性。

四、新型官網開發技術特點

HTML5技術：HTML5簡稱“H5”，是萬維網的核心語言，H5意思是超文本標記語言（HTML）的第五次重大修改，即html版本5，H5具有智能表單、繪圖畫布、多媒體、地理定位、數據存儲、多線程的新特性。采用HTML5技術將網站帶入一個成熟的應用平臺，對視頻、音頻、圖像、動畫以及與設備的交互都進行了規范，從而實現讓同一張網頁自動適應不同大小的屏幕，再根據屏幕寬度，自動調整進行頁面布局，實現自適應微網站的開發。

多屏支持：支持一般電腦及手機操作

分享支持：簡單操作就可以將內容分享到微信，微博等其它平臺

鼓勵創作技術：為網站得到更多更好的信息，提供更好的機制使老師及學生在官網上提供更多更好的信息

綜上所述，通過以上功能和技術特點開發的新型微網具有以下特點：

1、解決手機端、PC端、微信公眾號端不同步問題，本系統主要解決同一個后臺維護、多個終端同步顯示相同的內容，但顯示效果自適應，解決現在官網存在PC端官網和手機端官網不同系統帶來的重復工作問題。

2、解決官網登錄用戶與現有相關辦公OA用戶同步問題，本系統開發著力解決新老系統、不同系統的便捷單點登錄，即官網系統與學校原有相關系統用戶的自動同步，推動新官網的快速應用推廣。

3、便捷錄入編輯文章、高效查閱審核發布新文章，自動形成文章錄入與發布情況的統計報表，有利于激發相關部門人員提供熱點信息和維護官網，使官網時時刻刻處在不斷更新中，提高學校宣傳影響力。

4、首頁欄目依據需求快速調整、更新，解決官網存在上線后首頁框架就基本上一成不變的傳統問題。

5、實現掃碼訪問、查閱點贊、點擊轉發等功能，提升官網內容的推廣效率。

參考文獻：

[1]邱林潤，李蓉蓉.基于移動互聯網的一體化校園APP應用研究.電子世界.2014年第17期

[2]李麗.基于HTML5的微官網設計與.實現通訊世界.2017年第23期

[3]何英高，鄭學洪，呂敬.智慧校園時代移動應用建設研究與實踐.中國教育信息化.201906

[4]賈瀛.微信與微官網在高職工作中的應用.信息與電腦.2016年4期

[5]王洪偉，劉勰，廖雅國.基于Web挖掘和站點拓撲的自適應網站研究.數學的實踐與認識.2010年17期

本文系：“基金項目：廣西教育科學“十三五”規劃課題《基于“互聯網+”智慧校園APP云平臺建設與應用研究》（立項編號：2017A026）”的研究成果。

作者簡介：

趙冠業（1977-），男，廣西南寧人，學士，高級講師，主要研究方向和關注領域：計算機網絡、計算機軟件、物聯網技術應用;

鐘建敏（1980-），廣西梧州人，學士，高級講師， 主要研究方向和關注領域：計算機網絡、計算機軟件。