中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

文章針對(duì)APP加載狀態(tài)展開了較為系統(tǒng)的分析總結(jié)，希望能夠?qū)δ阌兴苡谩?/p>

當(dāng)我們進(jìn)入一個(gè)應(yīng)用或在應(yīng)用中切換跳轉(zhuǎn)時(shí)，經(jīng)常會(huì)遇到網(wǎng)絡(luò)延遲或頁(yè)面內(nèi)存過(guò)大導(dǎo)致加載過(guò)慢需要用戶等待幾秒的場(chǎng)景，而這些場(chǎng)景是提升產(chǎn)品體驗(yàn)的重要環(huán)節(jié)，也是移動(dòng)應(yīng)用設(shè)計(jì)過(guò)程中需要考慮的重要因素。

我們需要針對(duì)不同的加載內(nèi)容設(shè)計(jì)合適的加載策略，而加載策略會(huì)受到加載內(nèi)容的大小、內(nèi)容的數(shù)量、網(wǎng)速等因素的影響。針對(duì)這些影響因素，我們需要設(shè)計(jì)對(duì)應(yīng)的加載形式。常見的形式有全頁(yè)面加載、占位符加載、分步加載、懶加載、進(jìn)度條加載，以及預(yù)加載等幾種形式。

全頁(yè)面加載

全頁(yè)面加載，顧名思義是將整個(gè)頁(yè)面一起加載，這是頁(yè)面加載最原始的狀態(tài)，當(dāng)頁(yè)面元素較多時(shí)，這種載入方式需要將所有內(nèi)容都下載后才顯示內(nèi)容，內(nèi)容呈現(xiàn)的等待時(shí)間會(huì)變得很長(zhǎng)。在加載時(shí)頁(yè)面會(huì)處于全空白或展示一個(gè)gif，比較常見的就是頁(yè)面中央的菊花gif圖。

由于這種加載gif帶有時(shí)間不確定性，如果等待時(shí)間過(guò)長(zhǎng)，用戶很容易失去耐心而離開。目前很多app將這種加載動(dòng)畫設(shè)計(jì)成許多有創(chuàng)意的形式來(lái)留住用戶的注意力。例如猩便利使用自帶品牌形象設(shè)計(jì)的一個(gè)十分滑稽可愛的猩猩gif圖，遇到網(wǎng)絡(luò)加載過(guò)慢時(shí)可以很好的緩解用戶焦慮。58同城也使用了帶有自身品牌特色的加載gif，形式十分有趣。

占位色塊加載

占位色塊加載就是在頁(yè)面即將出現(xiàn)的位置加載占位色塊，等到數(shù)據(jù)加載完成后將數(shù)據(jù)陸續(xù)填進(jìn)色塊，給用戶加載很快的感覺，體驗(yàn)會(huì)比全頁(yè)面加載流暢。這種方式適合內(nèi)容排版布局固定的頁(yè)面，先加載大致輪廓，再加載細(xì)節(jié)。但是需要注意的是，如果使用占位色塊的頁(yè)面改版了，占位圖也需要進(jìn)行對(duì)應(yīng)的更新，不然加載前后有閃屏的感覺。

分步加載

分步加載是占位色塊加載的優(yōu)化形式，為了讓用戶能盡快地看到部分內(nèi)容，了解頁(yè)面的基本信息。在多元素的頁(yè)面中，頁(yè)面先載入基本框架和內(nèi)存較小的文字內(nèi)容，再加載較大的圖片、視頻等內(nèi)容，讓用戶先看到部分內(nèi)容，其他內(nèi)容再逐步加載，用戶在網(wǎng)速不夠快時(shí)也能提前預(yù)覽即將出現(xiàn)的內(nèi)容，這就是分步加載。

在分步加載的頁(yè)面中，當(dāng)只加載了部分內(nèi)容時(shí)，未加載的內(nèi)容會(huì)對(duì)頁(yè)面的美觀程度產(chǎn)生影響，同時(shí)也會(huì)影響用戶對(duì)頁(yè)面內(nèi)容的理解。目前有許多app會(huì)在默認(rèn)圖上設(shè)計(jì)一些有品牌識(shí)別的圖片來(lái)代替未加載的圖片，使界面在未加載圖片內(nèi)容時(shí)，也能有較好的展示效果，讓用戶更好地理解界面含義，同時(shí)也能更好的傳達(dá)品牌。

懶加載

懶加載，顧名思義就是一種偷懶的加載方式，用戶打開app時(shí)僅加載用戶可以看到的區(qū)域，看不到區(qū)域則需要通過(guò)用戶的瀏覽行為來(lái)喚起內(nèi)容的加載。例如當(dāng)頁(yè)面滾動(dòng)到底部盡頭或下拉頁(yè)面時(shí)，才會(huì)自動(dòng)加載內(nèi)容。

懶加載一般用在無(wú)盡的信息流頁(yè)面中。這種方式能有效的提升頁(yè)面的打開速度，讓用戶可以順暢地瀏覽而不用一直等待加載。在進(jìn)行懶加載時(shí)，一次要加載的內(nèi)容數(shù)量和加載時(shí)間段一般會(huì)根據(jù)頁(yè)面展示內(nèi)容的大小、高度和用戶的瀏覽速度來(lái)決定。

預(yù)加載

預(yù)加載是和懶加載恰恰相反的加載方式，它不僅不會(huì)偷懶，而且會(huì)提前準(zhǔn)備好你即將瀏覽的內(nèi)容。當(dāng)a頁(yè)面加載完成時(shí)它并沒有停下來(lái)，而是悄悄的加載你即將打開的b頁(yè)面，在你打開b頁(yè)面時(shí)可能c頁(yè)面也一起準(zhǔn)備好了。

預(yù)加載一直走在用戶前面，給用戶一種無(wú)縫連接的感覺，享受到極快的加載速度。

而使用這種方式服務(wù)器的壓力會(huì)增加，用戶也會(huì)耗費(fèi)更多流量。目前測(cè)試了許多app只看到今日頭條使用了這種加載方式，在網(wǎng)絡(luò)正常下打開app，斷網(wǎng)后依然可以正常瀏覽內(nèi)頁(yè)文字內(nèi)容，文章底部會(huì)提示當(dāng)前無(wú)網(wǎng)絡(luò)狀態(tài)。

進(jìn)度條加載

進(jìn)度條相信大家都不陌生，最常見的就是在下載頁(yè)面，我們可以清楚的看到當(dāng)前進(jìn)度，反饋十分明確。目前許多app將進(jìn)度條運(yùn)用在app的加載頁(yè)，讓用戶可以清楚的查看當(dāng)前頁(yè)面的加載進(jìn)度，來(lái)了解需要等待的時(shí)長(zhǎng)。最常見的就是google瀏覽器，不管是web還是手機(jī)端許多場(chǎng)景都使用了這種加載方式，體驗(yàn)十分友好。

混合加載模式

為了能讓產(chǎn)品有一個(gè)流暢的體驗(yàn)，很多app會(huì)根據(jù)產(chǎn)品的各種不同場(chǎng)景來(lái)組合使用不同加載方式。上文中舉例的產(chǎn)品都使用了不止一種加載手段。例如，enjoy打開時(shí)首先進(jìn)行全頁(yè)面加載，然后進(jìn)行分步加載，打開內(nèi)容時(shí)則會(huì)出現(xiàn)進(jìn)度條加載。所以我們?cè)谠O(shè)計(jì)加載方案時(shí)需要結(jié)合產(chǎn)品的場(chǎng)景來(lái)決定對(duì)應(yīng)的加載方式。

總結(jié)

全頁(yè)面加載

• 優(yōu)點(diǎn)：適用于各個(gè)場(chǎng)景
• 缺點(diǎn)：由于時(shí)間的不確定性，加載過(guò)慢時(shí)容易流失用戶

占位色塊加載

• 優(yōu)點(diǎn)：適合有固定布局的頁(yè)面，體驗(yàn)比全頁(yè)面加載流暢
• 缺點(diǎn)：不適合布局多變的頁(yè)面

分步加載

• 優(yōu)點(diǎn)：先加載頁(yè)面框架和文字信息，在網(wǎng)速較慢時(shí)能提前預(yù)覽即將出現(xiàn)的內(nèi)容
• 缺點(diǎn)：只加載了部分內(nèi)容的頁(yè)面會(huì)對(duì)整體美觀度產(chǎn)生影響，也會(huì)影響用戶對(duì)頁(yè)面內(nèi)容的理解

懶加載

• 優(yōu)點(diǎn)：只加載用戶看得到的內(nèi)容，頁(yè)面加載速度快，服務(wù)器壓力較小，節(jié)省用戶流量，體驗(yàn)較好
• 缺點(diǎn)：當(dāng)網(wǎng)絡(luò)狀況不佳時(shí)可能會(huì)出現(xiàn)體驗(yàn)不流暢，加載延遲等狀況

預(yù)加載

• 優(yōu)點(diǎn)：預(yù)先加載即將出現(xiàn)的內(nèi)容，用戶可以順暢的在應(yīng)用中交互，享受到極快的加載速度
• 缺點(diǎn)：服務(wù)器壓力增加，用戶會(huì)耗費(fèi)更多流量

進(jìn)度條加載

• 優(yōu)點(diǎn)：反饋明確，清晰易懂
• 缺點(diǎn)：頁(yè)面無(wú)內(nèi)容，美觀度較低

混合加載

• 優(yōu)點(diǎn)：根據(jù)不同場(chǎng)景來(lái)設(shè)計(jì)，體驗(yàn)升級(jí)
• 缺點(diǎn)：需要對(duì)各場(chǎng)景制定對(duì)應(yīng)的加載規(guī)范，保證交互一致性

本文由 @?李惠丸 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來(lái)自PEXELS，基于CC0協(xié)議