2021-04-08 分類(lèi): 網(wǎng)站建設(shè)
互聯(lián)網(wǎng)信息時(shí)代的發(fā)展為網(wǎng)站設(shè)計(jì)及網(wǎng)站中的人機(jī)界面交互設(shè)計(jì)提供了前所未有的發(fā)展空間,越來(lái)越多的軟件和互聯(lián)網(wǎng)公司開(kāi)始重視網(wǎng)站中的人機(jī)交互和用戶(hù)體驗(yàn)在產(chǎn)品中的重要作用。而網(wǎng)站中的用戶(hù)界面是用戶(hù)和網(wǎng)絡(luò)產(chǎn)生接觸的第一個(gè)窗口,對(duì)于互聯(lián)網(wǎng)產(chǎn)品的用戶(hù)體驗(yàn)以及訪問(wèn)量、注冊(cè)量、銷(xiāo)售額甚至成本等都有至關(guān)重要的影響。
在一個(gè)網(wǎng)站中,網(wǎng)頁(yè)上的可交互元素,包括頁(yè)面上的按鈕、鏈接、文本框等,更應(yīng)合理設(shè)計(jì)才能帶來(lái)好的頁(yè)面交互性。那么如何提高網(wǎng)頁(yè)的交互性呢,主要是要注意以下幾點(diǎn)。
1 注意網(wǎng)站的鏈接、按鈕和logo
一個(gè)網(wǎng)站的鏈接和按鈕都應(yīng)該符合用戶(hù)的使用習(xí)慣。目前鏈接文字通用的表現(xiàn)方式是字色藍(lán)色并帶下劃線的文字。而按鈕應(yīng)當(dāng)是有一定的立體感,看上去就是一個(gè)突出的按鈕,一看就知道是可以點(diǎn)擊的。而logo是與其它網(wǎng)站鏈接以及讓其它網(wǎng)站鏈接的標(biāo)志和門(mén)戶(hù)。在通常情況下,通過(guò)點(diǎn)擊logo可以返回到網(wǎng)站的首頁(yè)。所以,logo即是一個(gè)網(wǎng)站的名片,logo更是網(wǎng)站的靈魂所在,除此之外它還具有一個(gè)重要的導(dǎo)航功能。網(wǎng)站的logo作為一個(gè)重要的網(wǎng)頁(yè)元素,當(dāng)鼠標(biāo)移上去或者劃過(guò)等事件,應(yīng)該有相關(guān)的信息響應(yīng)。
2 網(wǎng)站頁(yè)面加載進(jìn)度
網(wǎng)站的每個(gè)鏈接,包括網(wǎng)站的首頁(yè)打開(kāi)都需要時(shí)間加載的,只是某些網(wǎng)站功能較為簡(jiǎn)單,加載起來(lái)很快是而無(wú)需擔(dān)心頁(yè)面延遲。但某些網(wǎng)站的加載往往不能一次性完成,例如淘寶這種大型購(gòu)物平臺(tái),頁(yè)面有很多的商品圖片,加載需要一定時(shí)間,這個(gè)時(shí)候是需要一定的響應(yīng)式的,所以頁(yè)面更應(yīng)該給出提示,否則讓用戶(hù)等待太久是很不友好的做法。
事實(shí)上,有很多的因素會(huì)影響到網(wǎng)頁(yè)初次加載的響應(yīng)時(shí)間:html文件的文檔的大?。豁?yè)面中的各種元素例如代碼、圖片、flash、音頻、視頻等元素文檔的大??;html頁(yè)面的復(fù)雜程度(瀏覽器可以很快的展現(xiàn)簡(jiǎn)單的頁(yè)面);用戶(hù)反應(yīng)的快慢也會(huì)影響瀏覽速度;被網(wǎng)頁(yè)頁(yè)面調(diào)用的其他內(nèi)容所在的服務(wù)器的訪問(wèn)速度;網(wǎng)站的域名和外部域名的dns的解析速度也會(huì)影響網(wǎng)頁(yè)的加載速度;用戶(hù)所使用的計(jì)算機(jī)的各種性能(如果計(jì)算機(jī)的資源消耗過(guò)多,或者配置過(guò)低,瀏覽器也會(huì)變得響應(yīng)緩慢);服務(wù)器的配置的高低。
除了上述因素會(huì)導(dǎo)致網(wǎng)站響應(yīng)的快慢以外,一些人為的因素及一些硬件也會(huì)影響網(wǎng)頁(yè)加載的速度。例如:服務(wù)器端、客戶(hù)端和網(wǎng)速。服務(wù)器端主要包括:服務(wù)器的地域,是否雙線,處理能力等。
那么如何提高頁(yè)面的瀏覽速度呢?采取以下幾種基本的方法可以有效的提高網(wǎng)頁(yè)的瀏覽速度。
(1)在不影響頁(yè)面質(zhì)量的前提下,盡可能的優(yōu)先制作html代碼。(在頁(yè)面上傳服務(wù)器之前,先去掉html文檔中的沒(méi)必要的換行標(biāo)記以及注釋。但為了保證頁(yè)面的可讀性和可維護(hù)性,注釋的代碼還應(yīng)當(dāng)保留在源代碼中)。
(2)為了減少文檔之間的依賴(lài),在制作網(wǎng)頁(yè)時(shí)頁(yè)面中應(yīng)盡可能少的包含其他外部引用。(可以將多個(gè)腳本放入一個(gè)腳本文件,圖片處理的技術(shù)將多個(gè)小圖片合并成為一個(gè)大圖,這樣就只需要加載一次)。
(3)把開(kāi)發(fā)的網(wǎng)頁(yè)里面的字節(jié)減少一些,把沒(méi)用的字節(jié)都刪了。盡量多使用div來(lái)布局網(wǎng)頁(yè),少使用表格布局。
(4)盡可能的定制圖片及包含圖片的元素的尺寸。讓圖片本身就符合網(wǎng)頁(yè)的要求,這樣可以盡量避免頁(yè)面展現(xiàn)時(shí)由于圖片不能一次性加載而造成頁(yè)面元素跳動(dòng)的現(xiàn)象。
(5)小腳本放在頭元素中,而比較大的腳本則放在頁(yè)面的尾端加載,這樣頁(yè)面可以在大的腳本加載完成前展示出來(lái)。如果把大的腳本放在頁(yè)面的頭元素進(jìn)行加載,則瀏覽器會(huì)等到腳本完全加載完成后才顯示頁(yè)面內(nèi)容。
3 網(wǎng)頁(yè)中應(yīng)隱藏不常用的操作
網(wǎng)站中不經(jīng)常使用的操作可以不用突顯出來(lái),將其弱化或隱藏。例如,網(wǎng)站中有某個(gè)彈出層是幾乎不用到的,為了不對(duì)用戶(hù)造成干擾,我可以在當(dāng)鼠標(biāo)經(jīng)過(guò)的時(shí)候才出現(xiàn)這個(gè)彈出層。這個(gè)是基于上文提到的不干擾用戶(hù)注意力角度出發(fā)的。比如,在新浪微博中,微博的屏幕功能只有在鼠標(biāo)移到對(duì)應(yīng)某條微博的右上角并單擊鼠標(biāo)的時(shí)候才會(huì)彈出操作提示框,否則是看不到屏蔽操作的,這個(gè)就是一個(gè)隱藏操作的具體體現(xiàn)。
4 盡量減少?gòu)棾鲂畔?/p>
為什么要盡量減少?gòu)棾鲂畔⒛?,這里舉一個(gè)例子來(lái)說(shuō)明一下?當(dāng)你正在看一部精彩的電影或看一本精彩的書(shū),這時(shí)接到一個(gè)無(wú)實(shí)質(zhì)內(nèi)容的電話,你肯定會(huì)非常惱火。網(wǎng)頁(yè)設(shè)計(jì)也是一樣,如果能在當(dāng)前頁(yè)面顯示完成就盡量在當(dāng)前頁(yè)面加載完成。對(duì)于那些彈出信息,例如彈出層、跳轉(zhuǎn)頁(yè)面、模態(tài)窗口等都影響用戶(hù)體驗(yàn)。
5 網(wǎng)站對(duì)用戶(hù)需要引導(dǎo)-網(wǎng)站導(dǎo)航
一個(gè)好的網(wǎng)站是能夠讓用戶(hù)全面瀏覽,所以網(wǎng)站導(dǎo)航十分重要。每個(gè)用戶(hù)在瀏覽頁(yè)面時(shí)往往都是不確定性的、無(wú)規(guī)律的,同時(shí)用戶(hù)更不喜歡選擇。所以,網(wǎng)站需要時(shí)刻讓用戶(hù)看清當(dāng)前的位置。如果瀏覽者不能快速、便捷地找到它,他們就很有可能去別的網(wǎng)站。例如,很多博客網(wǎng)站除了首頁(yè)導(dǎo)航之外,還將分類(lèi)作為第二導(dǎo)航放在頁(yè)面的邊欄。此外,網(wǎng)站的頁(yè)腳也很重要,因?yàn)橛胁糠钟脩?hù)瀏覽時(shí)接觸到的是網(wǎng)站的底部,這個(gè)時(shí)候網(wǎng)站的頁(yè)腳可以方便的讓用戶(hù)找到當(dāng)前的站點(diǎn)位置。
一直以來(lái),網(wǎng)頁(yè)界面設(shè)計(jì)的研究主要針對(duì)于視覺(jué)方面,而設(shè)計(jì)的內(nèi)容、流程和原則虛擬了實(shí)物產(chǎn)品的設(shè)計(jì),基本上沒(méi)有太大的改變。隨著信息科技的發(fā)展和人機(jī)交互技術(shù)的成熟,交互界面的設(shè)計(jì)已經(jīng)成長(zhǎng)為一個(gè)獨(dú)立的行業(yè)。本文闡述了基于增強(qiáng)現(xiàn)實(shí)的交互界面概念,分析了其突出特點(diǎn),總結(jié)歸納交互界面設(shè)計(jì)的流程與原則。交互界面設(shè)計(jì)是一個(gè)全新而又復(fù)雜的研究領(lǐng)域,本文的研究?jī)H僅是交互界面設(shè)計(jì)的冰山一角,如何將交互界面設(shè)計(jì)的理論特性分析清楚、理解透徹,還得依靠同行們的不懈努力和大量實(shí)踐,使用戶(hù)和網(wǎng)絡(luò)的信息交流更加簡(jiǎn)便、高效和人性化。
新聞名稱(chēng):網(wǎng)站如何提高界面的交互性
網(wǎng)頁(yè)路徑:http://jinyejixie.com/news/106691.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站設(shè)計(jì)、ChatGPT、外貿(mào)網(wǎng)站建設(shè)、動(dòng)態(tài)網(wǎng)站、搜索引擎優(yōu)化、網(wǎng)站設(shè)計(jì)公司
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容