国产乱码一区二区三区四区_国产精品免费不卡_国产精品一区精品国产自在_亚洲国产精品97久久无色_一本之道无人区_俄罗斯胖老太牲交

新聞動態
簽約信息
公司信息
行業資訊

斑驢互聯小編為你搜羅移動端返回頂部各種操作

 發布時間:2018-11-03     瀏覽次數:2.5k     作者:斑驢互聯

        網站萬千各有不同,但當我們瀏覽到網站的底部的時候會注意到返回頂部的懸浮按鈕。網站建設除了對網頁設計有所要求,也需要充分考慮到用戶的瀏覽體驗,很多網頁設計師在網站建設規劃的時候會出于用戶體驗的考慮,設置返回頂部功能按鈕,解決縱向頁面太長返回頂部瀏覽上方的內容或者使用頁面頂部搜索框或語言切換按鈕時用戶體驗不佳的痛點。手機網站的普及,微信營銷方興未艾,那么移動端在返回頂部的設計現狀又是如何的,下面小編給大家說說。


http://www.52moerben.cn/storage/uploads/20181103/1b1de446d872b14c6dbe41b0f2850f25.png



一、 返回頂部懸浮按鈕的移動現狀

       隨著智能手機的普及,許多網站也紛紛開發出移動端的app,作為功能之一,返回頂部懸浮按鈕也跟著遷移到了移動端。但不同于pc,手機屏幕寸土寸金,因此在懸浮按鈕單一功能上做出了改進,加入了動畫交互(如下圖左下角手淘按鈕),隨著頁面的不斷滑動懸浮按鈕會產生動畫形變,增加了和用戶的互動,也提醒用戶這個功能按鈕的存在。這就是目前返回頂部懸浮按鈕在移動端的現狀。


http://www.52moerben.cn/storage/uploads/20181103/32a46db09e9882f50531da5c7fca1104.png


二、 哪些類型的應用需要返回頂部

       返回頂部的出現是為了頁面太長的問題,那些會出現長頁面的應用會加入這個功能,我們可以總結出以下這幾個類型:

1、購物類:如淘寶、京東等,商品圖片展示和文字描述會占據較大空間,因此需要增加頁面的長度。

2、美食佳飲類:同購物類應用類似。

3、新聞類:新聞常常以圖文并茂的形式出現,因此也需要用戶不斷滑動才能看完全文。

       相信大家都能看出這幾類應用類型的相同點,都是圖文并茂,并且需要足夠的展示空間。也就是常說的“瀑布流”展示形式。說到“瀑布流”,就不得不提我們的微信朋友圈了。

 

三、 微信朋友圈的返回頂部

      隨著社交圈的拓寬,每個用戶添加的微信好友越來越多,每天要“批閱”的朋友圈也越來越多,瀑布流要展示的內容大有“飛流直下三千尺”的氣勢,自然也會出現頁面過長,回滾過慢的情況。微信的產品經理們也注意到這一點,很快,微信版的返回頂部功能也面世,但不是采用傳統的懸浮按鈕的形式,而是推出了雙擊頂部返回功能。


http://www.52moerben.cn/storage/uploads/20181103/877dc39a68fdd4934620e14b44312a46.png


        相比懸浮按鈕,雙擊頂部的設計顯得更加聰明:不需要在頁面中“塞入”一個懸浮按鈕,頁面能夠保持簡潔;將頂部標題本身變成“按鈕“,使得頁面更具整體化。不過這個聰明的交互方法可不是微信原創,最先使用的應該是蘋果的ios系統。

 

四、 蘋果ios系統的返回頂部

        從iphone4 開始,蘋果手機開始風靡,ios操作系統也開始影響人們的生活。隨著系統的不斷更新,蘋果的產品經理們也注意到了用戶返回頂部這一痛點,于是點擊狀態欄返回頂部的功能應運而生。


http://www.52moerben.cn/storage/uploads/20181103/d6b29d514110146a9567481bdefe4721.png


         這一人性化功能的推出,讓返回頂部不再是局限于一個app內,而是擴展到整個系統,這一功能也使得眾多手機廠商效仿,經筆者測試,目前魅族、華為都適用,小米不是點擊狀態欄,而是第三方插件實現此功能受微信和操作系統的影響,如今大部分的應用軟件都采用新的返回頂部方式,以下是幾款軟件的對比。

 

五、 部分軟件返回頂部的對比


http://www.52moerben.cn/storage/uploads/20181103/aca0e19e7b3b2453e27f4be0cfae7da7.png




       小編分別從購物類、美食類、新聞類中選擇幾個應用作為代表,從上面的對比圖我們可以看出,其他的應用都使用了點擊頂部返回的交互方式,只有淘寶、京東等購物類軟件仍然保留返回頂部的懸浮按鈕。那么,為什么淘寶京東仍保留懸浮按鈕這種形式呢?懸浮按鈕還有存在的價值嗎?我們不妨來探究一下。(京東淘寶互為競品,相似性較大,因此這里只選擇下載人數多的淘寶為例)

 

六、 手淘中返回頂部懸浮按鈕的分析

       首先我們來看一下返回頂部懸浮按鈕在手淘app中出現的頁面,分別出現在首頁和商品詳情頁,但奇怪的是,同為長頁面的動態頁卻沒有這一功能。


http://www.52moerben.cn/storage/uploads/20181103/046fc618b226895b475282770b67fb2c.png


      在此小編猜測,首頁和商品詳情頁是手淘app一開始的版本就有的功能,也就是跟著pc端遷移過來的,因此保留了懸浮按鈕,而動態頁則是后來隨著版本迭代而逐步添加的功能,因此兩版功能出現了這一差異。

      那么在這兩個頁面中,這兩個按鈕的使用情況如何呢?我們一共收集了 131 份有效調查問卷,調查問卷顯示:在是否使用過首頁中的返回頂部懸浮按鈕問題中,僅有17.5%的受訪者使用過此按鈕,而八成的人則表示從未使用甚至不知道這個按鈕的存在。


http://www.52moerben.cn/storage/uploads/20181103/5a7913c43d17ab7120d4614a790980b2.png

       而在是否使用過商品詳情頁里的懸浮按鈕問題中, 6 成的受訪者表示使用過這個懸浮按鈕。


http://www.52moerben.cn/storage/uploads/20181103/d08f8eefc1cdfbc9a5af36642062093f.png

         兩個相同功能的按鈕為什么會有不同的使用率呢?我們結合具體的頁面來看一看:


http://www.52moerben.cn/storage/uploads/20181103/949ac7753e2315fc172ec3377d1708b5.png


        在文章開頭我們提過,返回頂部滿足了用戶的兩個痛點,而這兩個頁面正好是這兩個痛點的代表。第一個頁面中,按鈕的功能是讓用戶返回頂部搜索框進行搜索,但隨著版本迭代,搜索框已經被更新為固定在頂部,也就是說用戶可以隨時進行搜索,根本不需要在滑動返回頂部,自然,這個懸浮按鈕也就成了擺設。


http://www.52moerben.cn/storage/uploads/20181103/7bc955ae9e4e428524fdd16199ef7314.png


        在第二個頁面中,用戶返回頂部則是滿足第一個痛點,回看頂部商品信息,因為在購買商品的過程中,用戶會反復確認商品的信息是否是自己需要的,所以返回頂部是用戶的需求之一。但這個按鈕的情況其實也不容樂觀,手機淘寶在新的版本迭代中也加入了商品詳情頁面的頂部固定,用戶同樣可以點擊頂部標題直接回到頂部。或許被新功能代替也是遲早的事。

 

七、 總結

綜合上述幾點內容的分析,我們不難發現,返回頂部懸浮按鈕處于一個尷尬的境地。

1、在大的范圍中,有手機系統自帶的返回功能可以取代。

2、在小的范圍中,同一個app中也有相同的功能按鈕。

3、新的類型功能按鈕的面世,如微信的頂部標題欄,手淘的固定標題欄,更加適應潮流。

4、按鈕本身的使用需求并沒有pc端那么強烈,使用率不高。/5、本身的功能游離于應用軟件的體系之外,即該功能的刪除對軟件本身的業務流程沒有影響。

5、在以上種種因素的前后夾擊下,或許返回頂部的懸浮按鈕真的應該退出移動端了。當然,這并不是說現有的功能應該砍掉,而是給設計新產品功能的產品經理一點參考,看看是否有必要加入此功能。





標簽: 南昌網站建設公司/南昌做網站的公司/南昌微信小程序/南昌APP開發/—斑驢互聯

分享本文
每個作品都是一次思維與靈魂的碰撞
斑驢互聯在南昌一直向著“做業內一流互聯網設計團隊”這一愿景努力,不斷提升對網站高端設計,微信公眾號/小程序開發等產品的用戶體驗
400 0791 158
主站蜘蛛池模板: 亚洲久久中文字幕 | 欧美久久免费观看 | 亚洲超碰97人人做人人爱 | 国产丝袜无码一区二区视频 | 久久久高清一区二区三区 | 欧美成人免费在线观看 | 奇米五月| 操操网站 | 欧美在线视频不卡 | 久久精品AV无码夜色 | 日韩免费影视 | 免费国产片在线观看 | 和岳每晚弄的高潮嗷嗷叫视频 | 鲁鲁鲁A片1级毛片免费看 | 加勒比东京热无码国产AV | 波多野结衣爽到高潮在线观看 | 无码人妻精品一区二区三区夜夜嗨 | 新版中文在线官网 | 国产精品福利视频萌白酱 | 一级黄色在线 | 欧美成人官网二区 | 亚洲AV午夜成人片精品 | 国产一区二区视频在线免费观看 | 黄色毛片基地 | 色偷偷狠狠色综合网 | 香蕉大美女天天爱天天做 | 无码高潮爽到爆的喷水视频 | 日本高清视频网址 | 成人av网站免费观看 | 国产精品亚洲第一区焦香味 | 91麻豆久久久 | 亚洲综合激情五月丁香六月 | 精品日韩欧美一区二区在线播放 | av无码免费岛国动作片片段 | www.99日本精品片com | 91av视频免费在线?看 | 亚洲性激情| 91xx在线观看 | 欧美日韩一区二区三区在线视频 | 成人免费无码一区二区三区动漫 | 亚洲乱码一二三四 |