《卷軸》的重生

如果在網(wǎng)站設(shè)計(jì)中有一件事是肯定的，那就是什么都不做太長(zhǎng)時(shí)間。曾經(jīng)流行的，或者是禁忌的，一年，甚至六個(gè)月前，可能已經(jīng)完全過(guò)時(shí)了。例證:《卷軸》的復(fù)活。

就在幾年前，網(wǎng)站的設(shè)計(jì)師們還在不斷地感受到設(shè)計(jì)“超越折疊”的壓力，或者是在屏幕的可見(jiàn)區(qū)域，可以在不向下滾動(dòng)的情況下觀看。但是今天，“卷軸”已經(jīng)重生了!為什么,你問(wèn)。答案很簡(jiǎn)單:移動(dòng)。

現(xiàn)在移動(dòng)設(shè)備上的網(wǎng)頁(yè)瀏覽已經(jīng)超過(guò)了桌面瀏覽，因此，網(wǎng)站和用戶界面設(shè)計(jì)者不得不改變他們的調(diào)子，以適應(yīng)移動(dòng)和桌面瀏覽之間日益擴(kuò)大的差距。由于有如此多的用戶使用平板電腦和智能手機(jī)，滾動(dòng)是不可避免的，而且迅速成為必需品。屏幕越小，滾動(dòng)的時(shí)間越長(zhǎng)。此外，隨著高速互聯(lián)網(wǎng)和wi - fi的接入變得越來(lái)越容易和普及，滾動(dòng)已經(jīng)成為獲取信息的一種更快的方式，而不是在頁(yè)面之間點(diǎn)擊。

緊隨其后的是社交媒體。最受歡迎的社交媒體網(wǎng)站，如Facebook和Twitter，在桌面和手機(jī)上都使用了滾動(dòng)的feed布局。全球有23億活躍的社交媒體用戶，因此UI受這些網(wǎng)站的受歡迎程度也就不足為奇了，因?yàn)橛脩粢呀?jīng)習(xí)慣了滾動(dòng)以生成內(nèi)容。

我們不能遺漏我們的朋友CSS和Javascript。他們并不是真正的新孩子，但隨著UI設(shè)計(jì)師們發(fā)現(xiàn)了新的、獨(dú)特的方式來(lái)利用他們的力量，他們開(kāi)發(fā)出了更有趣的、引人注目的視覺(jué)敘事技巧。所以滾動(dòng)不再意味著要切掉一長(zhǎng)頁(yè)的文本，在這里和那里分成幾張圖片。但是現(xiàn)在，實(shí)現(xiàn)動(dòng)畫(huà)、圖形、圖標(biāo)和視頻創(chuàng)建了一個(gè)更加引人注目的UI布局，接近無(wú)限滾動(dòng)，以呈現(xiàn)一個(gè)開(kāi)始、中間和結(jié)束的web頁(yè)面。

那么“卷軸”設(shè)計(jì)是否適合你呢?首先，讓我們概括一下優(yōu)點(diǎn)和缺點(diǎn)，因?yàn)楹推渌麞|西一樣，使用這種設(shè)計(jì)技術(shù)也有優(yōu)點(diǎn)和缺點(diǎn)。

優(yōu)點(diǎn):

鼓勵(lì)交互——當(dāng)你沒(méi)有選擇的時(shí)候，只有滾動(dòng)來(lái)生成內(nèi)容，用戶交互就會(huì)增加十倍

更快的時(shí)間是金錢(qián)，滾動(dòng)比點(diǎn)擊錯(cuò)綜復(fù)雜的導(dǎo)航路徑要快

簡(jiǎn)單的交互性和增加瀏覽者在網(wǎng)站上花費(fèi)的時(shí)間僅僅是實(shí)現(xiàn)用戶友好型卷軸的幾個(gè)好處

自適應(yīng)設(shè)計(jì)——當(dāng)觀眾從這么多不同的平臺(tái)訪問(wèn)你的頁(yè)面時(shí)，有這么多不同的屏幕尺寸，設(shè)計(jì)一個(gè)長(zhǎng)滾動(dòng)將有助于保持設(shè)備之間的體驗(yàn)不可知

自然界面——研究發(fā)現(xiàn)，滾動(dòng)似乎與觸摸有有機(jī)聯(lián)系，而且在屏幕的不同區(qū)域，滑動(dòng)比反復(fù)點(diǎn)擊或點(diǎn)擊要容易得多。隨著移動(dòng)應(yīng)用(在觸摸屏設(shè)備上)的增加，用戶自然會(huì)接受滾動(dòng)作為獲取更多信息的一種方式

缺點(diǎn)

搜索引擎優(yōu)化的缺點(diǎn)——滾動(dòng)限制在你的網(wǎng)站上的獨(dú)特頁(yè)面的數(shù)量，并且減少的頁(yè)面可能會(huì)對(duì)你的網(wǎng)站的SEO產(chǎn)生負(fù)面影響，因?yàn)楣雀韬推渌阉饕嫘拚诉@個(gè)趨勢(shì)的網(wǎng)站評(píng)分

導(dǎo)航的尷尬——如果你使用滾動(dòng)的布局，加入直觀的導(dǎo)航是很重要的，因?yàn)樗鼤?huì)讓你很沮喪地滾動(dòng)到一個(gè)頁(yè)面來(lái)訪問(wèn)大菜單或后退按鈕

網(wǎng)站速度-滾動(dòng)UI設(shè)計(jì)經(jīng)常合并大量的內(nèi)容，例如視頻或圖像畫(huà)廊在一個(gè)頁(yè)面，這可能會(huì)減慢網(wǎng)站的速度

缺乏一個(gè)頁(yè)腳——除非你的設(shè)計(jì)還集成了一個(gè)粘頁(yè)腳,用戶可以滾動(dòng),滾動(dòng)和從來(lái)沒(méi)有看到你的頁(yè)腳,最終重要的信息,你想讓你的網(wǎng)站的觀眾能夠看到和容易訪問(wèn)進(jìn)一步導(dǎo)航、聯(lián)系信息和社交分享選項(xiàng)

在決定是否使用所謂的“無(wú)限滾動(dòng)”時(shí)，除了權(quán)衡利弊之外，還必須考慮站點(diǎn)的目標(biāo)和內(nèi)容。傳統(tǒng)的、較短的頁(yè)面通常更適合面向目標(biāo)的或電子商務(wù)網(wǎng)站，而社交媒體網(wǎng)站或網(wǎng)站則定期生成內(nèi)容豐富的新內(nèi)容，以長(zhǎng)卷的方式獲得最佳效果。

如果你已經(jīng)做到了這一點(diǎn)，并確定了無(wú)限或長(zhǎng)卷軸，可能適合你，我們總結(jié)了2015年和2016年的網(wǎng)頁(yè)設(shè)計(jì)趨勢(shì)，并包含了一些成功實(shí)現(xiàn)長(zhǎng)時(shí)間滾動(dòng)的提示。它在設(shè)計(jì)領(lǐng)域仍然相對(duì)較新的，有大約4年的實(shí)質(zhì)性數(shù)據(jù)，但一些基本的嘗試和錯(cuò)誤已經(jīng)為我們?cè)谶@里展示的最好的長(zhǎng)軸實(shí)踐創(chuàng)造了良好的基礎(chǔ)。

混合和匹配。在你的網(wǎng)站上使用長(zhǎng)時(shí)間和傳統(tǒng)的短卷軸是可以的，只要讓個(gè)人頁(yè)面內(nèi)容決定滾動(dòng)長(zhǎng)度，就不要反之。目前，它很流行有一個(gè)短滾動(dòng)的主頁(yè)和長(zhǎng)滾動(dòng)的補(bǔ)充和登錄頁(yè)面。

如果你對(duì)用戶如何在你的網(wǎng)站上導(dǎo)航感到緊張，使用粘性導(dǎo)航將會(huì)有所幫助。這允許用戶在滾動(dòng)條內(nèi)快速返回或從元素、頁(yè)面到頁(yè)面等元素中返回。

利用直觀的導(dǎo)航“建議”元素或工具，讓用戶能很快看到網(wǎng)站導(dǎo)航是如何工作的。諸如箭頭、動(dòng)畫(huà)按鈕或類(lèi)似的用戶界面工具之類(lèi)的視覺(jué)提示是一種交互式的方式，可以幫助查看者輕松地決定下一步該做什么或該去哪里。

在滾動(dòng)導(dǎo)航和其他調(diào)用操作之間明確區(qū)分

少即是多。長(zhǎng)卷并不意味著將500頁(yè)的連續(xù)內(nèi)容壓縮成一個(gè)長(zhǎng)時(shí)間的超級(jí)網(wǎng)站。無(wú)限卷軸并不一定是無(wú)限的:一旦你講完你的故事，覆蓋了你所有的基礎(chǔ)，就該停止了，即使卷軸相當(dāng)于幾頁(yè)長(zhǎng)。不要強(qiáng)迫它。

結(jié)合視覺(jué)線索，幫助引導(dǎo)觀眾，顯示他們?cè)诰磔S的位置。隨著觀眾越來(lái)越多，我們已經(jīng)習(xí)慣了長(zhǎng)時(shí)間的滾動(dòng)，我們?nèi)匀幌矚g知道隧道盡頭有一盞燈，或者我們可以在一頁(yè)紙上滾動(dòng)多長(zhǎng)時(shí)間。

本文由重慶網(wǎng)站建設(shè)公司派臣科技收集于網(wǎng)絡(luò)并整理發(fā)布。