互聯網Web前端應用中的問題分析

王悅 崔云 石妍

摘 ? 要：隨著Web的發展，在該領域存在的問題也逐漸顯露出現，為了從根本上解決Web前端應用過程中存在的問題，需要對Web前端設計進行系統化分析。近年來，Web前端在實際應用過程中因結構設計不完善出現了很多問題，嚴重影響Web工作的正常運轉，針對Web前端問題而提出的研究與防范措施迫在眉睫。目前，基于Web前端結構設計工作的特殊性，可以看出Web前端設計項目至關重要。文章主要介紹了Web前端的具體結構設計以及Web前端在實際應用過程中存在的問題，并提出了相應的解決對策。

關鍵詞：Web前端;結構設計;防護措施

當今是大數據化時代，各種高科技的出現將在很大程度上推動整個社會的發展。伴隨著我國計算機網絡技術的不斷成熟化發展，Web前端技術逐漸出現在人們的眼中，眼下Web技術在國內外網站中應用廣泛，在很大程度上豐富了傳統網站的界面，給網民更好的上網體驗[1]。

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

技術人員需要做好對Web前端的網絡安全防護工作，在設計環節中盡可能考慮到前端存在的安全隱患問題，利用Web前端設計簡化Web工作，避免網絡事故的發生，保證Web應用的正常運行，給用戶提供更好的網絡體驗。

1 ? ?Web前端概述

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

2 ? ?Web前端應用中所存在的問題

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

2.1 ?界面設計問題

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

2.2 ?界面控件選擇問題

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

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

2.3 ?表單問題

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

然而，在表單的應用過程中時常會出現多次提交問題。例如，在對文本以及密碼等信息進行提交時，若是多次點擊提交按鈕，那么系統將會多次向后臺數據庫傳輸信息，從而造成數據庫負載過大的現象，影響網站的正常使用。

2.4 ?模擬窗口的陰影

在正常的網絡窗口或菜單彈出時會出現陰影，強調菜單或窗口從背景中脫穎而出。然而，一些網站的窗口及菜單在進行彈出時，并沒有陰影，不但會對網站的美觀程度造成一定的影響，還會影響用戶對新彈出窗口的識別。

3 ? ?Web前端應用中問題的解決措施

目前，Web前端應用設計還存在一定的問題，倘若不及時解決，這些問題將會導致Web在實際應用過程中出現故障，進而降低Web的實際使用性能，給以較差的用戶體驗，甚至將會影響到網絡用戶的隱私。為此，要想做好Web網絡安全的防范工作，就必須從根本上做到強化Web前端設計的功能，對Web前端應用做出了如下要求：

首先，針對用戶的需求，在設計Web前端應用界面時需要充分考慮Web界面元素的根本需求，在Web前端設計開發中要本著用戶簡單易懂的原則，盡可能地將Web界面的各項功能設計得更加容易操作，方便用戶使用。簡化界面是一種有效方式，這用界面隱藏或高級掩蓋功能。在設計Web主界面時，可以主要顯示一些用戶經常操作的功能，其余操作次數較少的功能可以在高級搜索框中尋找。

其次，Web前端應用的設計要根據實際情況選擇合適的界面控件，使得不同情況下用戶可以采用不同的方式處理問題。Web前端應用中存在模擬窗口的陰影，源于設計者想要以此來提醒用戶將注意力放在出現的窗口上，使得系統在發出警告或者提醒時用戶能夠第一時間看到。在實際Web設計工作中，不僅要考慮網頁設計的合理性、美觀性，更要考慮Web整體的運行環境，給用戶提供一個安全、穩定的網絡環境。為此，Web設計人員也應做好Web技術的安全維護工作，為Web網頁提供一個安全、穩定的使用環境。

4 ? ?結語

綜上所述，Web前端是對數據和功能進行應用展現的一種技術，該環節對于Web應用起到重要作用。技術人員在開發Web時，首先，需要做好Web前端的設計工作，避免在后續應用過程中Web前端程序設計薄弱導致網頁使用出現問題，進而出現應用癱瘓現象。其次，近年來，我國在Web開發技術上存在的又一難題在于創新，一些相似的Web應用設計界面在影響Web開發者的切身利益的同時，也影響了用戶的上網體驗。為此，豐富Web前端的設計，給用戶提供絢麗多彩的用戶界面將會成為Web應用的熱點。

在如今智慧城市的構建中，Web前端開發將會對城市管理綜合數據造成很大的影響，是實現數字城市向智慧城市轉變的關鍵技術。Web前端設計要想更好地得到應用，就必須尋找適合自身發展的技術，在減輕工作量的同時，能夠給用戶更好的上網體驗，安全防護工作當然也必須到位。

[參考文獻]

[1]葉文全.CSS自定義屬性在Web前端中的應用研究[J].集寧師范學院學報，2019（6）：45-49.

[2]李曉薇.Web前端開發技術以及優化方向[J].電子技術與軟件工程，2019（19）：48-49.

[3]高慧.Web前端開發技術和其對網站性能的影響[J].河南科技，2019（28）：47-49.

Abstract：With the development of Web， the problems in this field appear gradually. In order to solve the problems in the process of Web front-end application， it is necessary to systematically analyze the Web front-end design. Recently， the Web front-end has many problems due to the imperfect structure design in the process of practical application， which seriously affects the normal operation of Web work， and it is urgent to put forward the research and preventive measures against the Web front-end problems. On the basis of the particularity of Web front-end structure design， it can be seen that Web front-end design project is very important. This paper mainly introduces the concrete structure design of the Web front-end and problems existing in the practical application of the Web front-end， and put forward corresponding solutions.

Key words：Web front-end; structure design; protective measures