現(xiàn)代網(wǎng)站設(shè)計(jì)的特點(diǎn)是什么？這是一個(gè)很常見的問(wèn)題。

從客戶在網(wǎng)站建設(shè)項(xiàng)目開始時(shí)的疑問(wèn)，到設(shè)計(jì)師試圖弄清楚如何結(jié)合最新和流行的元素，弄清楚現(xiàn)代網(wǎng)頁(yè)設(shè)計(jì)應(yīng)該是什么樣子是我們最大的挑戰(zhàn)之一。

事實(shí)上，我們應(yīng)該很容易就可以說(shuō)出現(xiàn)代網(wǎng)頁(yè)設(shè)計(jì)不應(yīng)該是什么樣子，當(dāng)你實(shí)際看到一個(gè)過(guò)時(shí)的設(shè)計(jì)時(shí)，你就知道它過(guò)時(shí)了。在這里，我們收集了23個(gè)現(xiàn)代網(wǎng)頁(yè)設(shè)計(jì)的例子，以幫助你更好地了解2023年的網(wǎng)頁(yè)設(shè)計(jì)應(yīng)該是什么樣子。

9. 多個(gè)入口（Multiple Entry Points）

雖然讓用戶在內(nèi)容中選擇這個(gè)或那個(gè)通常是一種最佳的實(shí)踐方式，但對(duì)于某些內(nèi)容類型，多個(gè)入口點(diǎn)可能更有效。我們已經(jīng)在分屏設(shè)計(jì)中看到了很多這種情況。

注意以上案例（Tempo）主頁(yè)上的按鈕數(shù)量。用戶可以從一開始就選擇他們的感興趣的入口，每個(gè)入口都是為不同的人設(shè)計(jì)的。這是在一個(gè)頁(yè)面上處理多個(gè)目標(biāo)的好方法。

10. 用戶參與（User Engagement）

The Bear and His Scarf 是一本在線故事書?！绊?yè)面”的設(shè)計(jì)就像傳統(tǒng)的書籍頁(yè)面一樣，由大量的插圖和一些短語(yǔ)組合而成，但也包含動(dòng)畫和互動(dòng)元素，以保持趣味性。

但它不止于此。這本故事書是比利時(shí)一家足球俱樂(lè)部的粉絲頁(yè)面。

11. 有目的的留白（Purposeful White Space）

在設(shè)計(jì)中，留白應(yīng)該是有目的的。Lars Franzen 有意地使用空白來(lái)讓用戶在他的作品集中的圖像中移動(dòng)。

留白有助于將圖像框起來(lái)，并將視線從屏幕上吸引到其他圖像上。留白在這里還有另一個(gè)目的——它是一個(gè)導(dǎo)航工具，鼓勵(lì)左右滾動(dòng)。

12. 可操作的微文本（Actionable Microcopy）

微文本應(yīng)該告訴用戶接下來(lái)會(huì)發(fā)生什么。好消息是，這并不復(fù)雜。

使用可操作的短語(yǔ)，提供清晰的解釋，如 Gracie Mansion 在其網(wǎng)站設(shè)計(jì)中使用的按鈕（上圖）：預(yù)訂旅程。它應(yīng)該是最直接的，并提供了清晰的指導(dǎo)。

13. 巨大的英雄圖像（Huge Heroes）

在現(xiàn)代網(wǎng)站設(shè)計(jì)方案中，越大越好。具有傳奇色彩的英雄形象區(qū)域與用戶建立最直接的聯(lián)系，并將他們吸引到內(nèi)容中。

在這里，Owl Design使用了一些令人驚嘆的圖像和一些意想不到的動(dòng)畫來(lái)吸引你（這可能是你可以盯著看幾個(gè)小時(shí)的圖像處理方式了）。

14. 視頻，也可以是豎版的（Video(It Might Be Vertical)）

視頻在網(wǎng)站建設(shè)中的方向正在發(fā)生90°的轉(zhuǎn)變（這要感謝智能手機(jī)的普遍使用）。

從垂直空間的社交媒體“故事”，到大多數(shù)用戶已經(jīng)習(xí)慣通過(guò)手機(jī)搜索和查看內(nèi)容，向垂直視頻的轉(zhuǎn)變變成一個(gè)必然。這也適用于網(wǎng)站設(shè)計(jì)（盡管仍然有很多水平視頻）。

垂直視頻在分屏格式下是非常不錯(cuò)的，比如上面的 This is Beyond（上圖），因?yàn)樗谧烂娑撕鸵苿?dòng)設(shè)備上看起來(lái)都很棒，因?yàn)檫@些分屏“屏幕”是堆疊的。

15. 壓縮加載速度（Zippy Load Speeds）

關(guān)于你的網(wǎng)站，人們注意到的第一件事是它是否加載得快。緩慢的加載時(shí)間是一種拖累，會(huì)讓用戶比其他任何東西都更快地離開。

一個(gè)現(xiàn)代的網(wǎng)頁(yè)設(shè)計(jì)必須看起來(lái)很棒，加載速度也必須更快。

16. 搜索優(yōu)化（Optimized for Search）

現(xiàn)代網(wǎng)站設(shè)計(jì)中最重要的元素之一是你可能看不到的——搜索優(yōu)化。

用戶怎么能更快的找到組件以及他們需要的內(nèi)容?

總結(jié)

當(dāng)你瀏覽那些2008年左右制作和使用的網(wǎng)站時(shí)，你會(huì)明顯的知道這個(gè)網(wǎng)站已經(jīng)“過(guò)時(shí)”了，這就是現(xiàn)代網(wǎng)頁(yè)設(shè)計(jì)的反面教材。上面的例子都有一個(gè)共同的主題，你可能會(huì)看到許多現(xiàn)代網(wǎng)頁(yè)設(shè)計(jì)的元素在其中組合使用。

這個(gè)共同的主線就是提高可用性的簡(jiǎn)單性。網(wǎng)站訪問(wèn)者可能不會(huì)花很多時(shí)間在你的網(wǎng)站上，所以你需要讓它在視覺(jué)上吸引人，易于一眼理解。這就是今天現(xiàn)代設(shè)計(jì)的本質(zhì)。

----圖文來(lái)自：design shack 

----由深圳網(wǎng)站建設(shè)公司-Clh翻譯編輯整理，為您提供更多有關(guān)深圳網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、網(wǎng)頁(yè)設(shè)計(jì)及其他互聯(lián)網(wǎng)應(yīng)用服務(wù)