Foundation 的根源來自 ZURB 風格指南,這是一系列 HTML、CSS 和 Javascript,幫助我們快速設計出令人驚豔的網站。現在,它已被數百萬設計師和開發人員使用,並為網路上一些最大、最受歡迎的網站提供支援。以下是 Foundation 如何成為世界上最先進的回應式前端框架的故事。
Foundation 是回應式前端框架。
易於使用的 HTML、CSS 和 Javascript,協助創造各種令人驚豔的作品。
前端 框架 是一系列包含設計模式的 HTML、CSS 和 JavaScript,您可以根據這些模式進行建置。它們可讓您免於浪費時間一再重寫無聊的樣板程式碼。除了節省時間之外,它們還能實際幫助您撰寫更好的程式碼。建置在 Foundation 上的網站可在多種裝置上順利運作,包括桌上型電腦、筆記型電腦、平板電腦和手機,因為它是一個 回應式 框架,使用 CSS 媒體查詢和 行動裝置優先 的方法。設計師可以為各種螢幕尺寸建立獨特的設計,確保不論使用哪種裝置,都能獲得順暢的體驗。

Foundation 數字
前 30 名
開源專案
27K
每日 Google 搜尋次數
850+
貢獻者
23,900
GitHub 星號
5200
GitHub 分支
12,100
迄今已提交
Foundation 包含工具和資源,例如具備大量便利選項的強大且彈性回應式格線、模態、字體排印、導覽元件和表單元素,設計師可以快速將這些元件插入產品中。Foundation 也是模組化的,表示你可以根據需要使用全部或部分元件。
由於世界各地的開發人員(包括我們 ZURB)每天都在使用 Foundation,因此代碼有許多反覆運算,而且錯誤會持續修正。可以將它視為共用智慧的集合,整個全球社群找出最佳實務。Foundation 易於使用、快速學習且充滿強大工具,是目前最先進的前端架構。
四個角落的建構
當我們在 2011 年發布 Foundation 時,我們希望為人們建立一個可以輕鬆建構回應式網站的方法,而且這仍然是我們的驅動力。在 ZURB,我們幾乎只為自己和客戶建立回應式網站,而 Foundation 在其中扮演了重要的角色。我們每天都使用它,而且我們知道它有用。
建立在 Sass 上
我們決定在一年多前將 Foundation 建立在 Sass(技術上是 Scss)上,而且我們從未回頭。Sass 不僅持續開發,而且透過 Sass,你可以獲得語意程式碼、更快速的樣式設計和大量令人驚豔的程式化功能。
Foundation 6 的主要指令
我們的目標:提供一個架構,讓其他人(和我們自己)可以建構設計更佳、符合未來需求的網站。成為回應式原型設計和建構任何裝置的最快方法還不夠。Foundation 也必須讓我們成為更好的設計師,在不斷演進的行動裝置世界中茁壯成長。這就是我們努力讓 Foundation 的每個新版本更先進的原因,這樣你就可以更聰明、更快速地編寫程式碼。 探索 Foundation 的功能 →
使用者速度更快
Foundation 有更快的核心,讓你可以在任何想要的螢幕上建立最佳化的美麗頁面。更新的核心也消除了使用者的不必要等待時間,特別是動畫和轉場。新的更新視覺樣式更簡單、更乾淨、更性感,而且重新設定樣式也更快速。
編寫程式碼速度更快
使用中型格線和自訂語意斷點,可以比以往更快地為任何裝置建立網站和應用程式。有一個新的命令列工具,讓你可以在超高速率下啟動 Foundation 專案。我們的 Foundation Business 服務讓你可以在所有公司專案中獲得專業支援、諮詢、工具和訓練。
學習更快
為了幫助您提升未來友善網站建置技能,我們改進了文件,並建立了社群論壇,讓您可以更快速地學習。我們也撰寫了一份新的「入門」指南,讓您比執行 Kessel Run 還快地開始使用 Foundation。我們還有 Foundation 論壇,讓您可以向整個 Foundation 社群尋求協助。
您事業的基礎
Foundation 如何成為公司的專業選擇
Foundation 不僅適合個別設計師,也適合整個團隊。而且它的優點在 ZURB 每天都得到驗證。我們每天在每個客戶或內部專案上對架構進行戰鬥測試,從行銷網站到網路/行動應用程式。如果它能幫助我們完成工作,那麼它肯定也能幫助其他公司、設計師和開發人員。這讓 Foundation 成為任何企業產品的完美基礎。我們可以提供協助。深入了解 Foundation Business →
Foundation 支援
我們知道取得解決方案對您有多重要。我們有一個團隊準備回答您的問題。
工程工作室
我們從 1998 年開始建置產品,我們可以協助您在下一個專案中使用 Foundation。
Foundation 訓練
我們有越來越多線上課程,讓您的團隊開始使用 Foundation。我們也可以親自到府提供客製化訓練。
上傳您的程式碼
Notable 提供一套應用程式,協助您設計產品,並讓您也能夠主機和分享您的 Foundation 程式碼。
Foundation 的歷史
Foundation 如何以及為何建立並成長的小小背景故事。
Foundation 在 2008 年的 ZURB 風格指南中秘密起源,我們在每個客戶專案中都使用它。最後,我們決定我們需要一個架構,讓我們能夠快速建立原型。我們採用了我們的全球 CSS、jQuery 外掛程式、常見元素和最佳實務,並將它們融合成後來的 Foundation,我們在 2011 年首次向大眾發布。我們決定開放 Foundation 的原始碼,因為我們知道這將有助於推動響應式設計的進展,但主要是為了幫助人們設計得更好、更快。


簡要時間軸
快速了解 Foundation 多年來的成長歷程。
2008
- ZURB 風格指南的建立是為了幫助我們加快工作速度。它是我們在每個客戶專案中使用的 HTML、CSS 和 Javascript 的便捷集合。ZURB 風格指南的理念多年來不斷演進,並成為新架構 Foundation 的基礎。
2010
- ZURB 風格指南已鞏固並命名為 Foundation。它在所有客戶專案和 ZURB 網站及應用程式中內部使用。
2011
- Foundation 2.0 以開放原始碼專案的形式發布給大眾!Foundation 是第一個回應式前端架構,並協助領導整個網路的 RWD 浪潮。
2012
- Foundation 3.0 發布!此版本附帶 Sass,並且是第一個使用混合的架構。
2013
-
二月
今年 Foundation 不只發布一次,而是三次!第 4 版 採用行動裝置優先,新增許多元件,並附帶視覺更新。我們的回應式圖片外掛程式稱為Interchange,已新增至 Foundation,讓使用它建置的網站載入速度更快。 -
十一月
Foundation 5 的重點在於速度。它讓學習、使用和開發架構比以往更快!更多新元件,例如Equalizer、Off-canvas 和 Icon-bar,讓套件更完整。我們的回應式內容外掛程式Interchange 現在可以根據螢幕大小交換 HTML 內容和圖片。 -
十一月
Ink(即將成為 Foundation for Emails),我們的回應式電子郵件架構在年底推出,協助設計師輕鬆建立美觀的回應式電子郵件。
2014
- 我們推出了Foundation for Apps,這是第一個為開發完全回應式的網路應用程式而建立的前端架構。Foundation for Apps 現在是 ZURB Playground 的一部分。
2015
- Foundation for Sites 和 Emails 架構都統一在 Foundation 名稱之下,提供一個完整的解決方案,可快速建置回應式的網站、應用程式和電子郵件。
關於 ZURB
一個 T 型產品設計師團隊,改變了全球人們設計網站、產品和服務的方式。

ZURB 是一家產品設計公司,總部位於加州坎貝爾。自 1998 年以來,我們與三星、eBay、McAfee、Mozilla、Netflix、SAP 等公司以及超過 250 家新創公司合作,設計出更好的產品、網站和服務。我們將客戶和員工視為公司成功的不可或缺的一部分。無論他們的職稱或角色為何,我們都將他們視為設計師。他們幫助我們建立了一家令人驚嘆的公司,並始終專注於設計出色的產品和服務。
我們的 Foundation 開源前端架構被全球數百萬的設計師和開發人員用於建立令人驚嘆的響應式網站、應用程式和電子郵件。我們的 Notable Platform 是為漸進式設計而建,因為從願景到產品的過程是一項艱難的工作。它需要動力和驅動力才能從每次反覆運算中學習,並在過程中獲得認同。最重要的是,它需要一個團隊共同努力,互相推動走向勝利。
進一步了解 ZURB →使用 Foundation 的品牌


















我們撰寫有關 Foundation 的文章
我們已經撰寫有關 Foundation 和響應式設計的文章一段時間了。Foundation 部落格是與下一個版本、發布和其他響應式設計好康保持同步的地方。
閱讀我們之前的文章 →