前言:想要寫出一篇引人入勝的文章?我們特意為您整理了玉林農產品宣傳與推廣網站設計開發(fā)范文,希望能給你帶來靈感和參考,敬請閱讀。
摘要:當前,電子商務已成為農產品宣傳和推廣的主流方式。通過網站宣傳和推廣,人們拓展了銷售渠道,解決了農產品滯銷的問題。本研究運用HTML5等相關技術,開發(fā)和設計玉林農產品銷售推廣網站,測試結果表明,其具有較高的應用價值。
利用HTML5技術開發(fā)的網站是時代的選擇,HTML5標準是當前Web設計與開發(fā)領域的熱門技術和未來發(fā)展趨勢,HTML5為中國互聯(lián)網企業(yè)發(fā)展提供了一個全新的網絡營銷平臺,利用HTML5進行網站設計變得日益重要。
1開發(fā)工具及技術
1.1HTML5
HTML5(Web前端)技術是由HTML(結構)、CSS(樣式)和JavaScript(行為)組成的??梢哉fHTML5是Web前端的未來,HTML5不僅在PC端有應用,而且在移動終端上具有廣泛的應用范圍[1]。在標準化的網頁設計方法中,HTML是基礎設施網絡標準化的Web設計方法,CSS是網頁的表現(xiàn)風格,JavaScript是行為的網頁代碼中的動態(tài)交互。
1.2CSS
CSS是疊樣式表,它是一種能用來表示HTML或XML等文件系統(tǒng)樣式的計算機網絡語言。CSS不僅能靜態(tài)修改頁面,還能與多種腳本語言進行結合,對頁面上的每一個元素進行動態(tài)格式化[2]。CSS在像素級別下能夠精確控制網頁中的元素布局,而且?guī)缀踔С炙凶煮w的大小及樣式,能夠編輯網頁的對象及模型樣式。
1.3JavaScript
JavaScript是解釋型編程語言之一,它在原型、函數(shù)的先行語言基礎上進行研究,并支持面向服務的對象編程、命令式的編程技術及相關函數(shù)式的編程[3]。基于HTML,JavaScript能夠在兩個網頁間進行流轉交換和實現(xiàn)交互式的網頁開發(fā)。JavaScript的出現(xiàn)使得企業(yè)網頁和用戶信息之間能夠實現(xiàn)實時性的、交互性以及動態(tài)的聯(lián)系,它讓網頁設計包含更精彩的內容和更活躍的元素。
2系統(tǒng)需求
2.1頁面設計
在主網頁上,首先運用一個導航欄和一個能實現(xiàn)搜索的引擎。它們的下面布局一個輪播圖,運用動畫設計,下放依次布局特色農產品、地域特色和產品展示,右端分為上、下兩個區(qū)域,分別放置了相關類的文字鏈接和圖片鏈接。
2.1.1頁面顏色的使用。本次的選題為農產品推廣,所以選用較為醒目的綠色圖片作為頁面背景,主要內容區(qū)域選用白色作為背景,綠色與白色相呼應,減少用戶的視覺疲勞。頁面導航欄采用鮮艷的文字顏色進行進一步美觀。
2.1.2頁面文字的使用。頁面的類別名稱使用綠色的字體顏色,農產品信息的介紹文字使用黑色,比較符合大眾審美。
2.1.3頁面的制作。采用框架式結構,每個部分的內容采用不同顏色的直線進行區(qū)分,減少用戶的學習時間和學習成本。頁面內容充實而不顯得繁雜,既能突出網站主題,又基本能夠滿足用戶需求。在本設計的網站中,產品介紹頁面需要獨立設計,這是網頁的一個部分,用戶點擊主頁下的產品介紹,可以跳轉到這個子頁面。首先,這個頁面設計比較簡潔,通俗易懂,和主頁一樣,以綠色為背景,給用戶良好的視覺沖擊,使讀者能夠有更好的視覺去閱讀。頁面設計了標題、圖文,并排介紹產品詳細情況,展示實物輪播圖供用戶參考,搜索框提供用戶查詢想要的產品。子網頁需要獨立設計,這是網頁的一部分。用戶可點擊主頁下的產品介紹,即可跳轉到這個子頁面。這個頁面的設計比較簡潔,通俗易懂,和主頁一樣,用了導航欄頁面,用戶在一個網頁能實現(xiàn)網站內的跳轉,操作方便快捷,使其有耐心去閱讀。頁面設計標題、圖文,并排介紹了網頁詳細情況、知識問答、用戶互動性設計面板。
2.2功能需求設計
本次選題為農產品推廣,所以選用醒目的綠色作為頁面背景,主要內容區(qū)域選用白色作為背景,綠色與白色相呼應,減少用戶的視覺疲勞;頁面導航欄采用鮮艷的文字顏色進行進一步美觀。在主網頁中,首先運用一個導航欄,主要包括產品介紹、地域特色、相關產品和關于我們四個欄目,能讓客戶清楚地看見,根據自己的需求進行選擇??蛻裟苤苯铀阉刈约合胍私獾霓r產品,方便快捷,節(jié)省時間。導航欄下面布局了輪播圖,能讓客戶查看感興趣的產品,點擊就能進入相關介紹頁面。接下來運用動畫設計,下方依次布局特色農產品、地域特色和產品展示,只要客戶把網頁往下拉,就能清楚看到需要了解的產品項目。右端分為上、下兩個區(qū)域,分別放置相關類的文字鏈接和圖片鏈接。上方的相關文字鏈接主要放最新的相關鏈接,點擊后即可進入相關頁面,下方亦是如此。產品介紹是第一個子網頁,用戶點擊主頁下的產品介紹,可以跳轉到這個子頁面。這個頁面的設計比較簡潔,和主頁一樣,以綠色為背景,使用戶能夠有更好的視覺去閱讀。頁面設計了標題、圖文,并排介紹產品詳細情況。通過點擊圖片,用戶就可以打開產品購物網頁,直接了解產品詳情。當用戶看到產品價格和喜歡的產品時,可以點擊鏈接后立即購買。輸入用戶所需要的產品,點擊搜一搜,下方會彈出用戶想要的產品圖片,單擊圖片即可了解產品詳情。在產品輪播圖中,輪播圖會自動輪播產品實物圖片,用戶可以點擊圖片,查看產品詳情。關于我們也是該網站的子網頁之一。用戶點擊主頁下的產品介紹,即可跳轉到這個子頁面。這個頁面設計簡潔,運用導航欄,用戶在一個網頁能實現(xiàn)網站內的跳轉,操作快捷。在用戶互動模塊,用戶可以提問和回答。在農業(yè)服務特色模塊,用戶可以點擊自己需要了解的內容,方便快捷。用戶可以根據需要填寫模板,寫寫老家的特色美食或地域特色,宣傳老家。在聯(lián)系模塊,用戶遇到問題時可隨時打電話咨詢。
2.3技術說明及網站性能管理需求
2.3.1非本網站內部用戶前臺頁面信息展示。非本網站的內部用戶只能看到統(tǒng)一的網頁功能頁面,只能瀏覽特定的前臺功能模塊和前臺信息內容。
2.3.2本網站內部用戶前臺頁面信息展示。本網站的內部用戶根據其在本網站的權限,在進入網站后可看到相應功能的模塊及內容,并且擁有相應功能操作權限。
2.3.3網站用戶權限和管理。本網站能夠支持多個管理員進行管理,不同管理員有不同的操作權限,對應著不同的功能模塊和頁面操作權限。同時,本網站能夠支持文本、網頁、圖形、視頻及附件等多種樣式的及管理,支持流媒體轉換。
2.3.4網站功能后臺維護和內部信息的整合。網站的后臺能支持多個功能模塊進行編輯操作,其功能包含增加、修改、刪除、顯示及隱藏,同時支持頁面布局、排版修改、編輯。本網站數(shù)據能夠用圖形來顯示,網站的信息支持且直接存檔到文檔管理系統(tǒng),同時支持郵箱賬戶管理。
3系統(tǒng)設計和分析
3.1體系結構
玉林農產品宣傳與推廣網站共分為前端和后臺兩部分。前端部分由HTML頁面和JSP頁面組成,利用HT⁃ML5、CSS3、JavaScript技術設計并開發(fā)。網頁使用div+css樣式進行頁面布局,網頁顯示信息,供用戶閱覽。后臺由JAVEWEB和數(shù)據庫兩部分組成,用于用戶注冊和數(shù)據處理,實現(xiàn)用戶與客服的交互、用戶與用戶的交互、用戶與網站的交互,系統(tǒng)結構如圖1所示。
3.2前端設計
按照網站功能的不同,分類設計頁面。每個功能為一個頁面,網站的頁面暫時可分為首頁、子頁面1(產品介紹)、子頁面2(關于我們)。
3.3前端功能
一是搜索功能。用戶想要查找某一產品并且查看信息,可以在網站的搜索框輸入名稱,實現(xiàn)對商品的查找,閱覽詳細信息。二是用戶注冊。用戶可以在頁面中的Web表單中填寫個人信息,提交表單并完成注冊后,才可以登錄網站,實現(xiàn)用戶與網站的交互。三是查看信息功能。用戶可以在頁面中查看自己商鋪的情況,也可以查詢留言情況和參與交互的信息記錄。
3.4系統(tǒng)設計
本網站采用MVC(ModelViewControlle)模式來搭建系統(tǒng)結構。MVC是一種程序架構理念[4],本網站使用MVC模式來進行開發(fā),把網站分為模型、視圖及控制器三部分。模型是指用來完成任務的代碼,可以多次使用,相對穩(wěn)定。視圖為應用程序與用戶交互時的頁面,能夠靈活地改變。MVC模式使得網站維護變得簡單輕松,可以保證網站應用程序開發(fā)進度[5]。
4系統(tǒng)測試
4.1測試環(huán)境
測試環(huán)境要重點關注Windows10操作系統(tǒng)、Hbuild⁃er、MySQL數(shù)據庫。
4.2測試記錄
基于Web開發(fā)的農產品網站測試記錄如表1所示,測試結果和預期結果基本一致。因此,基于Web技術開發(fā)的網站基本實現(xiàn)了農產品宣傳和推廣應用的目的。
5結語
本文提出利用HTML5技術設計營銷型網站,這種模式在多個網站設計中得到驗證。采用這個模式設計HT⁃ML5營銷型網站,極大地保證了網站的實用性、擴展性和維護性等。HTML5技術可以減少應用程序的響應時間,給用戶提供便捷的體驗,網站安全性好。HTML5技術從根本上改變了Web應用開發(fā)方式,無論是桌面應用還是移動應用,HTML5標準將繼續(xù)影響各種網絡平臺。
參考文獻:
[1]賈曉芳,沈澤剛.JavaWeb應用開發(fā)中的常見亂碼形式及解決方法[J].軟件導刊,2017(4):214-216.
[2]李思璇.國內農產品網絡營銷現(xiàn)狀研究[J].科技創(chuàng)業(yè)月刊,2017(7):35-37.
[3]張福軍.淺談“互聯(lián)網+”時代的農產品營銷與農業(yè)經濟發(fā)展[J].農民致富之友,2017(7):227-228.
[4]張曉.基于“互聯(lián)網+”的特色農業(yè)產業(yè)市場營銷創(chuàng)新模式研究[J].中國市場,2017(10):107-108.
[5]丁麗娜.互聯(lián)網模式下農產品推廣渠道研究[J].農村經濟與科技,2017(6):277.
作者:唐貴大 韋寬蔣 劉華英 吳書葉 馬春艷 魏小凡 禤世麗 單位:玉林師范學院數(shù)學與統(tǒng)計學院