設計趨勢徹底重塑網頁概念:垂直滾動、扁平化、復古/極簡配色、幻燈動畫、響應式設計成主流。透明幻燈、長投影等新手法顛覆擬物風,移動端普及更倒逼創意注入新趨勢。以下精選 24 組 CSS Design Awards 等國際大獎作品,解析趨勢落地的高光時刻。
CSS Design Awards 2013/01/05。網格著陸頁,點擊跳轉內容塊,頁面極致乾淨,無縫融合多重趨勢。

2013/01/01 獲獎。雙行動態標題(翻轉字體組合多重訊息),黑膠唱片動畫背景,黑白紅經典配色,深思熟慮的首頁敘事。

2013/12/31。單頁垂直滾動,著陸頁設計師眨眼互動,向下滾動見黑白網格內容,底部站立雙腳,傳達「舉起單頁網站」的強烈隱喻。

CSS Design Awards 2013/12/26。優美垂直滾動 + 三角形網格布局,簡約大氣美觀。

CSS Design Awards 2013/12/12。辦公室動畫著陸頁,垂直滾動 + 愉悅扁平設計,非響應式但有專屬移動版。

CSS Design Awards 2013/12/09。所有元素以線稿形式呈現,秩序井然且極具美感。

2013/12/08。無限滾動、響應式、扁平化、網格布局,一字評價:酷!

2013/11/27。幾何形狀飛舞著陸頁,向下滾動元素小巧精致,扁平化 + 4 組可展開全屏的幻燈片,極富創造力。

2013/11/20。滾動式、響應式、扁平化,滾動雖不絲滑但精彩不斷。

2013/11/16。匯聚垂直滾動、扁平化、復古配色、極簡、網格布局等全趨勢,非響應式但有移動版。

2013/10/13。滾動式、扁平化、復古配色、幻燈展示,同樣非響應式但有移動版。

2013/10/12。極具創意:滑鼠位置控制女孩吹泡泡動畫,移開滑鼠泡泡消失露出文字連結,點擊進入新世界,毫無懸念奪獎。

2013/09/21。工作狂視頻著陸頁,視差滾動中頭部視頻固定不動,全響應式,耳目一新。

2013/09/12。垂直滾動、網格、扁平化等趨勢集大成,遺憾僅支援 PC/平板,無手機版。

2013/09/07。極具冒險精神:首頁為可拖拽擴展的扁平半透明地圖(或許是城市、或許是地球),響應式,滑鼠變手型拖動探索。

2013/09/07。大量網格布局 + 黑白配色,極具吸引力的秩序美。

2013/08/31。為展示趨勢而生:扁平化、垂直滾動、充分響應、網格布局、大量純色,教科書級標桿。

2013/08/19。魔術般的連結過渡動畫,響應式,互動體驗極致流暢。

2013/07/29。獨特導航:拖拽頁面水平/垂直切換,右上角微型導航指示位置,高端且完美。

2013/07/28。設計師個人視差滾動站,圓圈展示專案,扁平化 + 充分響應。

這 24 組作品不僅是趨勢的集大成者,更展示了設計師如何在技術約束中突破邊界,將創意轉化為可體驗的數位藝術。