摘 要：隨著Web的發(fā)展，在該領(lǐng)域存在的問題也逐漸顯露出現(xiàn)，為了從根本上解決Web前端應(yīng)用過程中存在的問題，需要對Web前端設(shè)計(jì)進(jìn)行系統(tǒng)化分析。近年來，Web前端在實(shí)際應(yīng)用過程中因結(jié)構(gòu)設(shè)計(jì)不完善出現(xiàn)了很多問題，嚴(yán)重影響Web工作的正常運(yùn)轉(zhuǎn)，針對Web前端問題而提出的研究與防范措施迫在眉睫。目前，基于Web前端結(jié)構(gòu)設(shè)計(jì)工作的特殊性，可以看出Web前端設(shè)計(jì)項(xiàng)目至關(guān)重要。文章主要介紹了Web前端的具體結(jié)構(gòu)設(shè)計(jì)以及Web前端在實(shí)際應(yīng)用過程中存在的問題，并提出了相應(yīng)的解決對策。

　　關(guān)鍵詞：Web前端;結(jié)構(gòu)設(shè)計(jì);防護(hù)措施

　　當(dāng)今是大數(shù)據(jù)化時(shí)代，各種高科技的出現(xiàn)將在很大程度上推動整個(gè)社會的發(fā)展。伴隨著我國計(jì)算機(jī)網(wǎng)絡(luò)技術(shù)的不斷成熟化發(fā)展，Web前端技術(shù)逐漸出現(xiàn)在人們的眼中，眼下Web技術(shù)在國內(nèi)外網(wǎng)站中應(yīng)用廣泛，在很大程度上豐富了傳統(tǒng)網(wǎng)站的界面，給網(wǎng)民更好的上網(wǎng)體驗(yàn)[1]。

　　Web前端技術(shù)的發(fā)展離不開JS應(yīng)用的普及、HTML技術(shù)的拓展以及Vue和bootstrap等技術(shù)的發(fā)展。為了使Web應(yīng)用得以更好地運(yùn)行，在設(shè)計(jì)Web前端時(shí)技術(shù)人員需要考慮各種問題，其中Web前端的安全防護(hù)問題是Web技術(shù)人員需要重點(diǎn)關(guān)注的問題之一。Web前端作為Web應(yīng)用的入口，往往是Web應(yīng)用設(shè)計(jì)領(lǐng)域中最為薄弱的一個(gè)環(huán)節(jié)，技術(shù)人員必須及時(shí)對該部分進(jìn)行網(wǎng)絡(luò)安全防護(hù)工作，避免Web前端成為不法黑客分子的攻擊對象，因此，針對Web前端問題提出的研究與防范措施迫在眉睫。由此可以看出Web前端設(shè)計(jì)工作的開展于Web應(yīng)用有著至關(guān)重要的作用。

　　技術(shù)人員需要做好對Web前端的網(wǎng)絡(luò)安全防護(hù)工作，在設(shè)計(jì)環(huán)節(jié)中盡可能考慮到前端存在的安全隱患問題，利用Web前端設(shè)計(jì)簡化Web工作，避免網(wǎng)絡(luò)事故的發(fā)生，保證Web應(yīng)用的正常運(yùn)行，給用戶提供更好的網(wǎng)絡(luò)體驗(yàn)。

　　1 Web前端概述

　　Web前端是指網(wǎng)頁的前端部分，Web前端設(shè)計(jì)包括對網(wǎng)頁的架構(gòu)、色彩以及網(wǎng)站的頁面代碼進(jìn)行設(shè)計(jì)。在Web前端的開發(fā)過程中，工作人員需要熟悉JS的應(yīng)用，其中，Vue是一套相對先進(jìn)的用于構(gòu)建用戶界面的漸進(jìn)式JavaScript框架，通過Vue工作人員可以很方便地實(shí)現(xiàn)數(shù)據(jù)操作。此外，為了保障網(wǎng)頁的美觀，Web前端的開發(fā)人員還需要具備一定的審美觀念以及熟練地應(yīng)用CSS，其中，bootstrap的應(yīng)用可以使Web頁面布局設(shè)計(jì)美觀，并且增加界面的響應(yīng)式設(shè)計(jì)。同時(shí)，在Web前端開發(fā)過程中，Web前端工程師還需要使用HTML結(jié)構(gòu)，使網(wǎng)頁的布局更加清晰、明了。在Web前端的開發(fā)過程中，工程師需要保障網(wǎng)站各項(xiàng)功能的正常運(yùn)行，因此，在Web前端中會包含大量JavaScript腳本，可以實(shí)現(xiàn)播放動畫、播放聲音以及圖片等功能[2]。

　　2 Web前端應(yīng)用中所存在的問題

　　就現(xiàn)在的技術(shù)而言，現(xiàn)代化的Web前端設(shè)計(jì)工具可以極大減少Web前端設(shè)計(jì)的工程量，但是卻無法解決在Web前端應(yīng)用中所存在的問題。在Web前端的應(yīng)用中，不但會遇到界面元素需求方面的問題，還會有無法選擇合適的界面控件問題。此外，還會遇到表單問題、模擬窗口的陰影以及按鈕的狀態(tài)等問題。文章將對上述問題進(jìn)行詳細(xì)論述。

　　2.1 界面設(shè)計(jì)問題

　　在Web前端應(yīng)用過程中會產(chǎn)生界面需求，需要在Web前端的開發(fā)與應(yīng)用過程中使用界面元素。界面元素的合理運(yùn)用不但有利于網(wǎng)站的美觀，而且與用戶的實(shí)用性息息相關(guān)。界面元素使用過多會導(dǎo)致用戶在使用網(wǎng)站的某一功能時(shí)，不得不耗費(fèi)大量時(shí)間去了解如何使用網(wǎng)站中的眾多界面元素。然而，界面元素過少使用，雖然使得功能模塊更加簡潔，為用戶的使用提供了便利，但是失去了限制應(yīng)用程序的功能。例如，用戶在網(wǎng)站的首頁中尋找某功能時(shí)，若是界面元素使用過多，就無法及時(shí)地搜索到該功能。此外，過多的界面元素會造成用戶在使用過程中因Web前端出現(xiàn)界面卡頓而數(shù)據(jù)丟失，將嚴(yán)重影響到用戶的上網(wǎng)體驗(yàn)。為此，設(shè)計(jì)人員在Web前端設(shè)計(jì)過程中不斷尋求相應(yīng)解決方案，適當(dāng)減少網(wǎng)頁界面的使用元素。若界面元素使用過少，也將會影響網(wǎng)站的正常運(yùn)行[3]。

　　2.2 界面控件選擇問題

　　界面元素的使用會影響用戶的上網(wǎng)體驗(yàn)，同時(shí)，缺乏合適的界面控件也會對用戶的使用造成一定程度的困擾。界面控件是指在窗體上所放置的一系列可視化圖形元件，包括按鈕、文本框以及滾動條等，用戶通過點(diǎn)擊或滑動等交互性動作，使得后臺進(jìn)行事件響應(yīng)從而實(shí)現(xiàn)相關(guān)功能。

　　在網(wǎng)頁的設(shè)計(jì)過程中，選用合適的界面控件十分重要。若是缺乏合適的界面控件，在用戶使用網(wǎng)站的過程中將會造成用戶信息泄露、使用時(shí)浪費(fèi)時(shí)間等較差的用戶體驗(yàn)。例如，許多網(wǎng)站在用戶注冊時(shí)均會讓用戶填寫正確的出生日期。一些網(wǎng)站中的出生日期填寫使用文本框形式，通過對文本框內(nèi)容的獲取來記錄用戶的出生日期。一些網(wǎng)站使用下拉列表進(jìn)行選取。此外，還有些網(wǎng)站在進(jìn)行用戶出生日期的登記時(shí)使用緊湊的日歷選擇器，使得用戶耗費(fèi)大量的時(shí)間去進(jìn)行年月日的選擇。不合適的控件將會給用戶帶來糟糕的線上使用體驗(yàn)，因此，在選擇界面控件時(shí)應(yīng)更人性化，提高用戶體驗(yàn)。

　　2.3 表單問題

　　在Web前端的應(yīng)用過程中還容易出現(xiàn)表單應(yīng)用問題。表單是網(wǎng)頁中常用的數(shù)據(jù)信息采集工具。表單大致分為3個(gè)部分：表單標(biāo)簽、表單域以及表單按鈕。表單標(biāo)簽主要包含數(shù)據(jù)提交的方法、表單的功能等;表單域包含文本框、密碼框以及單選框、復(fù)選框、下拉選擇框等，用于提交數(shù)據(jù)信息及文本文件等;表單按鈕一般有3種，分別是提交、注冊、取消，用于實(shí)現(xiàn)表單的提交、注冊及取消輸入功能等。

　　然而，在表單的應(yīng)用過程中時(shí)常會出現(xiàn)多次提交問題。例如，在對文本以及密碼等信息進(jìn)行提交時(shí)，若是多次點(diǎn)擊提交按鈕，那么系統(tǒng)將會多次向后臺數(shù)據(jù)庫傳輸信息，從而造成數(shù)據(jù)庫負(fù)載過大的現(xiàn)象，影響網(wǎng)站的正常使用。

　　推薦閱讀：互聯(lián)網(wǎng)學(xué)習(xí)有關(guān)課題研究方向