目前網(wǎng)站中信息整合最常見(jiàn)的卡片方式就是卡片式設計和列表式設計。列表式在UI設計中算是式設設計一枚"元老級"的大將了，而卡片式設計則是計V究竟一匹"黑馬"，近年來(lái)異軍突起，表(biao)式越來(lái)越受到大眾的更勝喜愛(ài)。兩種設計在實(shí)現良好的卡片用戶(hù)體驗上各有千秋(′?｀)，??卡片式設計實(shí)(shi)現了圖文的式設設計完美結合，能給用戶(hù)呈現良好的計V究竟視覺(jué)效果，同時(shí)具有直觀(guān)的表式可操作性(卡片??的移動(dòng)、翻轉等)，更勝而列表式設計結構清晰，卡片在有限的式設??設計空間中展示更緊湊的內容，有助于用戶(hù)快速瀏覽內容，計V究竟在信息查找獲取方面更具優(yōu)勢。表式不過(guò)這兩種設計方式給網(wǎng)站帶來(lái)的更勝正面影響都是基于某種的適用情境的，離開(kāi)(╯‵□′)╯了特定的適用情境，它們反而可能會(huì )帶來(lái)"災難"。因此，為了給用戶(hù)提供更好的用戶(hù)體驗，和小飛一起探究探究這兩種網(wǎng)站內容組織方式最佳的適用情境吧??!

卡片式設計和列表式設計

為了更好理解卡片式設計和列表式設計的適用情境，我們首先需要了解一下這兩種設計方式。

在簡(jiǎn)要了解卡片式和列表式設計后，相信大家在理解這兩種方式的適用情境上也會(huì )更容易。下面小飛將分別介紹這兩種設計??的適用情境??。

卡片式設計的適用情境：

適合信息瀏覽(而不??(′ω｀*)是信息查找)

卡片式設計使用抓人眼球的圖片，整齊一致的柵欄格，各種形式的元素，致力于給(gei)用??戶(hù)提供良好的視覺(jué)效果，從而吸引他們?yōu)g覽全文。這種卡片式的滾動(dòng)很有(you)趣味性，能在一定程度上吸引用戶(hù)，很適合用戶(hù)瀏覽信息，但不適合信息查找。這是因為，一方面，(╯°□°）╯︵ ┻━┻卡片式設計更加注重不同卡片之間的排版契合，很少考慮它們之間的先后次(ci)序或重要程度。另一方面，卡??片式設計也很難滿(mǎn)足用戶(hù)"F"??型的瀏覽習慣(眼球追蹤研究表明┐(′?｀)┌用戶(hù)會(huì )更容易注意到網(wǎng)頁(yè)上方和左側的內容)，在重點(diǎn)突出某項內容或方便用戶(hù)查找方面比較遜色。相對而言，列表式可以更好的迎合用(′?_?`)戶(hù)這???一瀏覽特點(diǎn)，可對內容作重點(diǎn)突出。不過(guò)卡片式設計提供的視覺(jué)盛宴是列表式無(wú)法匹敵的，不少社交媒體也(ye)正是看中了它的這一優(yōu)點(diǎn)，紛紛在(zai)自己網(wǎng)頁(yè)中適用卡片式設計。

適合多種元素的分類(lèi)

在《解密網(wǎng)站設計潮流：為什么卡片式設計這么火?》中，我們也講到卡片式設計可以??輕松容納多種形式的元素，不管是圖片、文本、視頻、鏈接或是按鈕等。這是因為卡片的輪廓便于視覺(jué)分界線(xiàn)的建立，可以讓各種形式的元素保持(chi)整齊有序，不顯得雜亂無(wú)章。如果你的網(wǎng)站上涉及元素的種類(lèi)比較多，展(zhan)示的內(nei)容很是豐富，卡片式設計是很好的一個(gè)選擇。

列表式設計的適用情境：

適合信息快速查找

適合移動(dòng)小屏幕

卡片式設計在吸引用??戶(hù)注意力，展示眾多不同形式的內容上很有效果，但在提供文字信息上不太理想，而ヾ(′?｀)?列表(biao)式設計通過(guò)??搜索結果ヽ(′ー｀)ノ頁(yè)面讓用戶(hù)可以快速找到自己想要的信息，同時(shí)更能適應小屏幕上，但卻容易讓用戶(hù)覺(jué)得乏味無(wú)趣。兩種方式都有自(zi)己的優(yōu)點(diǎn)和不足，在您自助建站的過(guò)程中，結合自身的實(shí)際情況，合理分析兩種方式的??利弊，選擇最適合自己的。

起飛頁(yè)自助建站平臺提供了眾多模板，不管是卡片式設計的，??還是列表式設計的，小飛相信在這你肯定能挑選到自己滿(mǎn)意的，快來(lái)起飛頁(yè)自助建(T_T)站平臺做一個(gè)網(wǎng)站吧!