亚洲av日韩av天堂一区二区三区,无码国产精品一区二区免费式影视,亚洲av熟女少妇在线观看,色欲av无码一区二区三区,四虎影视久久久免费

滾動(dòng)型長(zhǎng)頁面網(wǎng)頁怎么設(shè)計(jì)才更好用-用戶引導(dǎo)設(shè)計(jì)

發(fā)布時(shí)間:2018-06-07 19:09:21訪問人數(shù):作者:素馬

單屏的網(wǎng)站頁面已經(jīng)不流行了,長(zhǎng)條滾動(dòng)和無限滾動(dòng)的網(wǎng)站最近變得越來越流行,這種技術(shù)在移動(dòng)設(shè)備上更是能很很好地呈現(xiàn)。移動(dòng)屏幕的使用越來越多,在廣泛接受長(zhǎng)卷技術(shù)的過程中無疑起到了關(guān)鍵作用:屏幕越小,滾動(dòng)的時(shí)間越長(zhǎng)。


長(zhǎng)長(zhǎng)的滾動(dòng)條為設(shè)計(jì)師打開了許多新的大門。然而,這種模式也有其缺點(diǎn)。它要求設(shè)計(jì)師對(duì)內(nèi)容、導(dǎo)航和動(dòng)畫給予高度關(guān)注。


這里有5個(gè)提示,以確保你的長(zhǎng)滾動(dòng)頁面能符合用戶的期望。



1、從一開始就提供有趣的內(nèi)容


盡管人們通常會(huì)在頁面加載時(shí)就開始滾動(dòng),但屏幕頂部的內(nèi)容是非常重要的。在頁面頂部出現(xiàn)的內(nèi)容會(huì)給用戶帶來最初的印象,并為用戶設(shè)置質(zhì)量期望。用戶可以滾動(dòng),但只有當(dāng)他們進(jìn)入頁面時(shí)看到的內(nèi)容是有希望的。


為了確保人們會(huì)滾動(dòng),你需要提供讓訪問者感興趣的內(nèi)容。因此,把你最引人注目的內(nèi)容放在頁面的頂部區(qū)域,使用有趣的故事或好看的圖像吸引用戶。



2、給用戶一個(gè)視覺提示


有時(shí)候,讓用戶滾動(dòng)的最好方法就是直接讓他們?nèi)プ?。?jiǎn)單地告訴用戶,大部分內(nèi)容都可以在下面找到。一個(gè)微妙的視覺提示,如指向屏幕外的箭頭或文本“向下滾動(dòng)”,可以告知用戶大部分內(nèi)容都在下面。



指向屏幕外的箭頭提示用戶,大部分內(nèi)容將在下面列出。



3、保持導(dǎo)航選項(xiàng)始終可見


導(dǎo)航是網(wǎng)站用戶體驗(yàn)的一個(gè)組成部分。在你的設(shè)計(jì)中使用長(zhǎng)時(shí)間滾動(dòng)的最大風(fēng)險(xiǎn)之一是用戶迷失方向。如果導(dǎo)航條在用戶向下滾動(dòng)時(shí)失去了可見性,那么當(dāng)它們?cè)陧撁嫔钐帟r(shí),它們將不得不滾動(dòng)回去。通常,這種行為會(huì)讓用戶感到困惑和沮喪。


這個(gè)問題的最明顯的解決方案是使用一個(gè)具有粘性的導(dǎo)航菜單,它顯示當(dāng)前位置,并且始終保持在同一位置的屏幕上。



一個(gè)持續(xù)可見的粘性導(dǎo)航的例子


移動(dòng)設(shè)備:由于移動(dòng)屏幕比桌面屏幕小得多,可見的導(dǎo)航條可以占據(jù)屏幕相對(duì)重要的部分。解決小屏幕問題的一種方法是在用戶滾動(dòng)新內(nèi)容時(shí)隱藏導(dǎo)航條,并在用戶向下拉時(shí)讓它可見,以便返回到頂部。



4、使用功能動(dòng)畫來吸引訪客


像視差滾動(dòng)和滾動(dòng)激活動(dòng)畫等創(chuàng)造性的效果可以吸引用戶更多的滾動(dòng)。他們把滾動(dòng)變成更有趣的事情,讓用戶想知道“接下來會(huì)發(fā)生什么?”


考慮將你的頁面拆分為可滾動(dòng)的“塊”。在每一組中,你可以通過創(chuàng)造性的動(dòng)畫來介紹內(nèi)容。當(dāng)用戶滾動(dòng)時(shí),動(dòng)畫將它們轉(zhuǎn)換到下一個(gè)屏幕,同時(shí)創(chuàng)建一個(gè)內(nèi)容路徑。




視差是另一種受歡迎的動(dòng)畫效果,可以改善滾動(dòng)體驗(yàn)。視差效應(yīng)使背景圖像的移動(dòng)速度低于前景中的內(nèi)容,從而產(chǎn)生深度和沉浸感。當(dāng)你的網(wǎng)站想要以流暢、線性的方式講述一個(gè)故事時(shí),長(zhǎng)滾動(dòng)與視差效應(yīng)的結(jié)合可以創(chuàng)造一個(gè)完全沉浸式的瀏覽體驗(yàn)。



5、避免滾動(dòng)劫持


實(shí)現(xiàn)卷軸劫持的網(wǎng)站控制了卷軸并覆蓋了web瀏覽器的基本功能。滾動(dòng)劫持是不好的,因?yàn)橛脩舨辉偻耆刂祈撁鏉L動(dòng),無法預(yù)測(cè)其行為。用戶對(duì)網(wǎng)站滾動(dòng)互動(dòng)的期望不應(yīng)該因?yàn)閿⑹龅捏w驗(yàn)而被破壞。



蘋果在他們的Mac Pro頁面上使用了滾動(dòng)劫持。


結(jié)論


長(zhǎng)時(shí)間滾動(dòng)可以創(chuàng)建完全沉浸式瀏覽體驗(yàn),完全有可能讓旅行像目的地一樣愉快。當(dāng)用戶喜歡你的網(wǎng)站上的內(nèi)容,發(fā)現(xiàn)用戶界面是直觀的,他們就不會(huì)真正在意頁面的長(zhǎng)度。


  • 項(xiàng)目經(jīng)理.png

    掃描添加

    項(xiàng)目經(jīng)理微信

    享受專業(yè)顧問服務(wù)

  • 十二君QQ群.png

    掃描二維碼加QQ群

    與十二君一起征戰(zhàn)天下

  • 贊+1
    分享:

    版權(quán):【注明為本站原創(chuàng)的文章,轉(zhuǎn)載請(qǐng)注明出處與原文地址!本站部分轉(zhuǎn)載文章能找到原作者的我們都會(huì)注明,若文章涉及版權(quán)請(qǐng)發(fā)至郵箱:office@cnjunnet.cn,我們以便及時(shí)處理,可支付稿費(fèi)。向本站投稿或需要本站向貴司網(wǎng)站定期免費(fèi)投稿請(qǐng)加QQ:957505575】 更多信息請(qǐng)關(guān)注微信公眾號(hào):cnjunnet   十二君微信:webjunnet

    上一篇
    下一篇
    大神 大神

    原本新聞詳情廣告.jpg

    欄目熱文
    相關(guān)文章

    助君網(wǎng)絡(luò) Copyright ? 2012-2020. 未經(jīng)許可,不可拷貝或鏡像 滬ICP備17004436號(hào)  法律顧問:張素素

  • QQ
  • 電話
  • 首頁
  • 留言
  • 返回頂部
  • 恭喜您~
    留言提交成功o(∩_∩)o
    我們將快馬加鞭與您取得聯(lián)系。