在當(dāng)今這個(gè)移動互聯(lián)網(wǎng)的時(shí)代用戶每天都要花費(fèi)大量時(shí)間與移動設(shè)備上的網(wǎng)站進(jìn)行交互,而不是桌面。這個(gè)數(shù)字似乎每天都在增長。根據(jù)調(diào)查稱成年人手機(jī)平均花費(fèi)3小時(shí)35分鐘,預(yù)計(jì)這些設(shè)備的使用時(shí)間明年將更高這必然會對所有網(wǎng)頁設(shè)計(jì)師和開發(fā)者產(chǎn)生重大影響。今天,我們
成都網(wǎng)站建設(shè)創(chuàng)新互聯(lián)正在探索八項(xiàng)規(guī)則,以確保您在設(shè)計(jì)響應(yīng)式體驗(yàn)(無論是網(wǎng)站還是應(yīng)用程序)時(shí)都能遵循這些規(guī)則。
1.整理設(shè)計(jì)
為了充分利用
響應(yīng)式網(wǎng)站或應(yīng)用程序設(shè)計(jì),您可以做的最好的事情就是整理它。不要將設(shè)計(jì)包含太多選項(xiàng)或按鈕。所有這些只會壓倒用戶。有幾種方法可以有效地做到這一點(diǎn):
簡化內(nèi)容:密切關(guān)注用戶需要知道與網(wǎng)站或應(yīng)用程序進(jìn)行交互的內(nèi)容。使用一系列屏幕或步驟以邏輯方式呈現(xiàn)此信息。屏幕上的所有內(nèi)容都會在小屏幕上癱瘓。
僅使用對設(shè)計(jì)功能至關(guān)重要的界面元素。為什么包含用戶未與之交互的選項(xiàng)按鈕?(如果您不確定,請查看分析數(shù)據(jù)。您應(yīng)該能夠看到某些操作的交互模式和用戶流。
2.使任務(wù)可消化
當(dāng)表單看起來容易時(shí),人們更愿意提供信息
用戶最常見的任務(wù)之一是填寫表單。因此,我們將以此為例來考慮如何使操作易于理解。想象一下,在網(wǎng)上放入一些東西后,我們會設(shè)置一個(gè)結(jié)賬屏幕。那么會發(fā)生什么?
是否有一個(gè)長屏幕,有大量的字段要填寫(其中一些非常?。炕蛘?,交互是從簡單的問題開始,您可以在一個(gè)屏幕上完成?
我的猜測是你更有可能填寫后一種形式。大多數(shù)用戶也是如此。當(dāng)表單看起來很容易時(shí),人們更愿意提供信息并點(diǎn)擊結(jié)賬(或其他所需的操作)。
關(guān)于數(shù)據(jù)和表單的另一個(gè)提示 - 盡可能使用智能功能。諸如自動完成之類的功能將使用戶更有可能實(shí)際上將該表單一直轉(zhuǎn)換為完成,因?yàn)樗苋菀?。用戶?shí)際鍵入(或點(diǎn)擊鍵入)的內(nèi)容越少,他們就越有可能繼續(xù)前進(jìn)。
另一個(gè)例子在上面的Evernote的例子中是清楚的。其中一項(xiàng)主要任務(wù)是添加新筆記。綠色+按鈕在屏幕底部中央高度可見,使此操作易于查找和完成。
3.創(chuàng)建明顯且容易的按鈕
堅(jiān)持常見的使用模式和功能。
有時(shí),設(shè)計(jì)師有這種傾向,想要創(chuàng)造新的和令人興奮的東西并過度暗示明顯的:按鈕應(yīng)該看起來像按鈕。
不要試圖在這里重新發(fā)明輪子。不要花哨并設(shè)計(jì)一種完成動作的新方法。設(shè)計(jì)按鈕看起來像按鈕一樣。堅(jiān)持常見的使用模式和功能。
如果用戶必須考慮如何與
響應(yīng)式網(wǎng)站或應(yīng)用程序設(shè)計(jì)進(jìn)行過多努力 - 或者根本不考慮 - 可能的情況是他們根本不參與并繼續(xù)使用其他選項(xiàng)。
4.將鍵盤與數(shù)據(jù)匹配
對于
響應(yīng)式網(wǎng)站或應(yīng)用程序,有很多小型活動會產(chǎn)生重大影響。正確使用鍵盤可能是您大的資產(chǎn)之一。
確保將鍵盤類型(字母或數(shù)字)始終與查詢類型相匹配。如果您要求提供某些信息,例如電子郵件地址,請包含@鍵。這些小細(xì)節(jié)讓用戶高興,讓您的網(wǎng)站或應(yīng)用程序易于使用。而且您只需要花費(fèi)一點(diǎn)額外的努力。
5.使用簡單語言
提供簡單,清晰和直接的說明。
您使用的單詞也會極大地影響
響應(yīng)式網(wǎng)站或應(yīng)用程序的可用性。有效的設(shè)計(jì)包括易于閱讀和理解的語言,包括視覺和認(rèn)知。
不要試圖用語言或用戶需要理解的元素太可愛。提供簡單,清晰和直接的說明。避免使用行話或不清楚的語言。然后再往前走一步。使用干凈,清晰的排版來幫助進(jìn)一步強(qiáng)調(diào)和理解文本元素。
理解和可讀性有兩個(gè)部分 - 認(rèn)知理解(用戶確切地知道單詞的含義或暗示的行為)和視覺(每個(gè)單詞在屏幕上清晰易讀)。
這意味著你需要以一種可以理解的方式編寫,選擇一種可讀的字體,并在背景和文本之間提供大量的視覺對比,這樣所有這些都以一種易于用戶理解的方式匯集在一起。
6.注意錯誤
“任何可能出錯的事情都會出錯。” - 墨菲定律
事情會出錯。如果你已做好準(zhǔn)備,這沒什么大不了的。
用戶將點(diǎn)擊奇怪的元素組合,或復(fù)制一個(gè)奇怪的URL,或丟失他們的互聯(lián)網(wǎng)連接,或做你不想要的其他事情。當(dāng)出現(xiàn)問題時(shí)盡可能多地提供信息,以便用戶可以輕松地回到正軌。
在設(shè)計(jì)錯誤消息時(shí),嘗試解釋出現(xiàn)了什么問題以及為什么 - 例如“沒有互聯(lián)網(wǎng)連接” - 以及如何解決問題。兩條信息都可以在一個(gè)屏幕上傳送,并帶有指向修復(fù)的鏈接(適當(dāng)時(shí))。
7.警惕視頻 - 現(xiàn)在
雖然我們喜歡在響應(yīng)式網(wǎng)站上使用視頻,但它仍然不是移動設(shè)備的好選擇。(在以這種方式播放視頻時(shí),許多設(shè)備仍然不穩(wěn)定。即使設(shè)備可以處理它,互聯(lián)網(wǎng)連接也可能沒有為負(fù)載做好準(zhǔn)備。)
這并不是說您必須完全避免使用視頻,而是要確??紤]此內(nèi)容類型并為移動用戶提供替代方案。它將帶來更好的整體體驗(yàn)。簡單的解決方案是始終有一個(gè)靜止圖像代替移動視頻,只有在用戶特別要求時(shí)才播放視頻。
8.使用一致的設(shè)計(jì)
最后,在創(chuàng)建有效的
響應(yīng)式網(wǎng)站或應(yīng)用程序時(shí),您可以做的最好的事情是開發(fā)一致的設(shè)計(jì),在設(shè)備上以相同的方式查看和工作。設(shè)計(jì)中唯一真正的區(qū)別應(yīng)該是設(shè)備特定的功能或用戶模式。
在視覺上,這意味著您應(yīng)該使用相同的字體和調(diào)色板,圖像和號召性用語。大多數(shù)情況可能看似常識,但事實(shí)上必須說明這意味著有太多的網(wǎng)站和應(yīng)用程序不遵守這一設(shè)計(jì)原則。
目標(biāo)是任何用戶都可以在一臺設(shè)備上使用您的網(wǎng)站或應(yīng)用程序,并移動到另一臺設(shè)備而不會發(fā)現(xiàn)事情有所不同。如果您同時(shí)擁有響應(yīng)式網(wǎng)站和應(yīng)用程序,情況也是如此。請注意以上ESPN主頁(左)和app home(右)的相似之處。
底線?您設(shè)計(jì)的大部分內(nèi)容很可能是針對移動設(shè)備制作的。這個(gè)今后會成為趨勢的。
分享標(biāo)題:成都網(wǎng)站建設(shè)響應(yīng)式網(wǎng)站8個(gè)規(guī)則
瀏覽地址:http://jinyejixie.com/news/48350.html
網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營銷seo公司;服務(wù)項(xiàng)目有網(wǎng)站建設(shè)、響應(yīng)式網(wǎng)站等
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源:
創(chuàng)新互聯(lián)