瀑布流式布局應(yīng)用在展示類網(wǎng)站的獨(dú)特性

2022-04-27    分類： 網(wǎng)站建設(shè)

瀑布流式布局是當(dāng)前圖片展示或素材資源類網(wǎng)站中較常使用的一種頁面布局形式, 開此先河的是圖片社交網(wǎng)站“Pinterest.com”。瀑布流式布局在視覺上主要表現(xiàn)為層次不齊的多列布局。將寬度固定、高度靈活變化以保證原始寬高比的圖片排列在固定寬度的多列欄目中, 由此帶來水平方向規(guī)整分割, 而垂直方向沒有均衡對齊的布局方式, 使網(wǎng)頁的視覺區(qū)域呈現(xiàn)出流水般的落差感。利用這種視覺上的落差感來引導(dǎo)瀏覽者視線的流動, 從而營造出輕松愉悅的瀏覽體驗(yàn), 也形成了一種區(qū)別于傳統(tǒng)網(wǎng)格布局的設(shè)計(jì)風(fēng)格。另外這類網(wǎng)頁可以在單張頁面中顯示大量信息, 通過頁面的向下滾動, 不斷加載數(shù)據(jù)塊并添加至當(dāng)前頁面尾部, 而非網(wǎng)格布局, 查看更多的內(nèi)容要點(diǎn)擊下一頁。這種新穎的框架結(jié)構(gòu), 使用戶瀏覽網(wǎng)頁時使用較少的操作就可以獲得更多地信息。

瀏覽者的視線在瀏覽網(wǎng)頁時是處于流動的運(yùn)動狀態(tài), 整個視線的軌跡就是貫穿多個視覺焦點(diǎn)和視覺區(qū)域形成的迂回曲線。網(wǎng)頁中的視覺流程有其天然的縱向性, 這是由組成網(wǎng)頁本身的技術(shù)所決定的。這和平面設(shè)計(jì)中的視覺流程不完全相同的, 平面是靜止的, 而網(wǎng)頁卻是縱向動態(tài)滾動的, 所以在給網(wǎng)頁界面設(shè)計(jì)視覺流程時如果能順應(yīng)其這種天性, 可以為瀏覽者營造出流利暢快的體驗(yàn)感受。

瀑布流式布局的頁面是固定寬度有序排列多列圖像, 在垂直方向沒有均衡對齊, 所以瀏覽者的視線軌跡隨著視覺焦點(diǎn)的轉(zhuǎn)換呈現(xiàn)出一條不規(guī)則的水平波紋曲線, 整個視覺流程是由上而下的有序引導(dǎo), 非常流暢。流暢的視覺流程使得頁面瀏覽變成一個輕松的發(fā)現(xiàn)過程, 而非強(qiáng)制性的搜索過程。頁面中不再是刻意劃分的的界面框架, 反而更加突出圖片信息這一頁面主體內(nèi)容, 讓瀏覽者在不間斷的圖片中的愉悅地尋找自己感興趣的信息, 視覺感受也變得更加順暢而自然。

新聞標(biāo)題：瀑布流式布局應(yīng)用在展示類網(wǎng)站的獨(dú)特性
當(dāng)前路徑：http://bm7419.com/news/146720.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站維護(hù)、外貿(mào)網(wǎng)站建設(shè)、動態(tài)網(wǎng)站、網(wǎng)站內(nèi)鏈、商城網(wǎng)站、App設(shè)計(jì)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)

手機(jī)網(wǎng)站建設(shè)