1. 程式人生 > >2008年國外50個最佳CSS設計欣賞

2008年國外50個最佳CSS設計欣賞

插件 用戶體驗 bsp 感覺 blank 源代碼 sign eof sites

這50個CSS網站是由WebDesignerWall評選出來的,很具參考價值。我們在欣賞的同時,也能從中吸取很多靈感,也能從它們的源代碼中學習更高級的CSS技術。今年,越來越多的設計師開始使用超大的背景圖片技術和一些JavaScript框架(如jQuery及MooTools)來提高用戶體驗。還有一些設計師將Flash和CSS混合使用。

您還可以參考以下CSS相關資源:

《精選15個國外CSS框架》
《推薦20個讓你學習並精通CSS的網站》
《20+漂亮的網站分類存檔設計賞析(下)》
《20+漂亮的網站分類存檔設計賞析(上)》
《推薦80個使用超大背景圖片的網站設計》

Let It Bleed

巨大而醒目的圖片使得這個網站鶴立雞群。

技術分享圖片

Vermont Coffee Works

很好的混合使用了Flash和CSS。

技術分享圖片

Digital Mash

技術分享圖片

Good

很好的視覺和內容聚焦設計。

技術分享圖片

Wilson Miner

技術分享圖片

DrupalCon, DC

技術分享圖片

Future of Web Apps – Miami 2009

完美的將超大字體與破舊風格效果混合在了一起。

技術分享圖片

Housing Works

在首頁使用了很漂亮的超大背景圖。超大背景的網頁設計最近比較熱門。

技術分享圖片

Future of Web Design – NYC 2008

另一個超大背景圖設計的實例。

技術分享圖片

Tennessee – Fall

我不得不承認,Tennessee的網站的確是一個相當棒的系列設計——秋天、春天、夏天和冬天。

技術分享圖片

Tennessee – Spring

技術分享圖片

Tennessee – Summer

技術分享圖片

Tennessee – Winter

技術分享圖片

Five Runs

技術分享圖片

Branded07

技術分享圖片

Cappuccino

具有非常好的可用性的且很有組織性的網站。

技術分享圖片

LightCMS

LightCMS公司的一些鉛筆/速寫效果,網站上仍然能體現他們公司的感覺。

技術分享圖片

The First Twenty

非常漂亮的單頁設計。

技術分享圖片

YouLove.Us

非常完美的使用CSS和JavaScript(jQuery)

技術分享圖片

Luke Larsen

Luke Larsen的水族館主題很好的證明如何使用好jQuery的Scrollto 插件.

技術分享圖片

Design Disease

波浪和各種圓形讓這個網站變得很生動有趣。

技術分享圖片

Adaptd

雖然設計風格讓我想起了ISO50 (Scott Hansen),但它仍然值得推薦。

技術分享圖片

Jason Santa Maria

技術分享圖片

Electricurrent

這個網站證明了如何使用超大背景圖片來展現攝影作品。

技術分享圖片

Training by Collective Idea

技術分享圖片

MacAllan Ridge

很好的視覺設計,簡單的導航!棒極了!

技術分享圖片

Pikaboo

組合了CSS、JavaScript和Flash的非常酷的設計。

技術分享圖片

Mochi Ads

技術分享圖片

Volll

技術分享圖片

Fling Media

技術分享圖片

eWedding

技術分享圖片

Viget

Viget很好的在他們的系列博客中保持了他們的品牌形象——Inspire, Advance, Engage, and Extend.

技術分享圖片

Viget – Inspire

技術分享圖片

Viget – Advance

技術分享圖片

Viget – Engage

技術分享圖片

Viget – Extend

技術分享圖片

August

使用了Flash可擴展背景圖片的驚人設計(調整瀏覽器的尺寸可看到擴展後的背景圖)

技術分享圖片

Car Freaks

這個博客會經常更換他們的首頁背景圖片來保持新鮮感。

技術分享圖片

Go To China

這個一個使用高清晰度照片作為網站背景圖的完美實例。在調整瀏覽器大小後網站的背景圖也會隨之擴展。(使用JavaScript CSS實現)

技術分享圖片

Jesus Christ

技術分享圖片

Billy Hughes

技術分享圖片

Free People

FreePeople 是我一直很喜歡的設計(喜歡它的拼貼風格)

技術分享圖片

Mouse to Minx

復古…性感…

技術分享圖片

Dara’s Garden

技術分享圖片

Design Sponge

剪貼薄設計風格與網站的內容很好的結合。

技術分享圖片

Ma.tt

技術分享圖片

The Lippincott

技術分享圖片

Hot Meteor

喜歡它的復古字體。

技術分享圖片

Fortyseven Media

技術分享圖片

The Old State

很少能找到這樣漂亮的黑白主題。

技術分享圖片

2008年國外50個最佳CSS設計欣賞