【 Framer教學 】如何使用免費模版快速搭建網站
Framer 近年來在UI/UX設計領域迅速崛起，成為越來越受歡迎的工具。光是在 2020 年至 2023 年之間，其用戶數量就增長了 300%，其中主要有以下原因：
- 直觀好用：提供了直觀的拖放界面和可視化編輯功能，即使是不會寫程式的人也可以輕鬆使用。
- Prototype：能完成前端設計到終端的Prototype與網站動畫一條龍。
- 活躍的社群支持： 擁有龐大的用戶數與活躍的社群，使用者可以獲得大量資源和技術支持。
以下要分享，在時間及預算都有限的情況下，如何使用現有的 Framer 模板來架設網站。
步驟一：挑選 Framer 模板
在 Framer Template 中，你可以找到1000＋個高品質模板，這些模板都是來自世界各地的設計師所設計的，種類非常多包括：作品集、SaaS、工作室網站、部落格、一頁式產品網站、電子商務…等，當然還有很多免費模板。
你可以挑選喜歡的模板並點擊 “Preview” 進行預覽。大多數模板價格約 $20 ～ $60 美元不等（約台幣 700～2000元），相比聘請設計和工程人才的高昂費用，這對於預算有限的人來說是一個完美的解決方案。
步驟二：建立免費帳戶
這是我認為 Framer 最棒的一點，建立 Framer 帳戶不需任何費用。Framer 的免費方案，允許用戶發布最多 3 個網站。若要使用更高級的功能如：使用自定義的網域名、CMS、移除Framer Banner…等，就會需要升級到付費方案。
訂閱 Pro 年度計劃並輸入折扣碼：partner25proyearly，即可免費享受 3 個月。
步驟三：修改模板
購買模板後，你會通收到一封有購買收據和「Remix Link」的電子郵件。
點擊「Remix Link」後 Framer 會自動將模板複製到你帳戶裡的 Dashboard。
1. 編輯文字
非常簡單，只要雙擊要變更的文字區，就可以直接輸入你想要的文案，其中包含字體、顏色、大小都可以在工具面板中調整。
2. 變更圖片
和編輯文字一樣， “雙擊” 你想變更圖片，右下角會跳出圖片編輯視窗，在這裡你可以調整圖片位置、裁切比例、大小…等設定，也可以在這裡加入圖片的替代文字（Alt Text），方便搜索引擎理解圖像的內容，對於網頁的可訪問性和搜索引擎優化非常重要。
3. 更換你的品牌顏色、字體
使用模板的另一個好處是，你可在左側欄 “Assets” 中找到設計者已經規範好的網站顏色、字體、Components。比如你想要替換網站中使用的顏色，你只需要到 Assets 中”雙擊“你想替換的顏色，更換為你自己的品牌色，就可以把網站中用到該色彩的元素更新為你設定的新顏色。
3. 客製化顏色
使用模板的另一個好處是，你可在左側欄 “Assets” 中找到設計者已經規範好的網站顏色、字體、Components。比如你想要替換網站中使用的顏色，你只需要到 Assets 中”雙擊“你想替換的顏色，更換為你自己的品牌色，就可以把網站中用到該色彩的元素更新為你設定的新顏色。
4. 刪除不需要的頁面
在模板中你可以在 “Pages” 中輕鬆刪除不需要的頁面。
步驟四：發佈你的網站
當一切準備就緒後，你就可以發布你的網站了。點擊右上角“Publish”，會跳出兩個選項，若你有自己的網域想要使用，就可以點擊“Add Custom Domain”，如果還沒有自己的網域就可以直接點擊 “Update” 使用 Framer 的網域名。
總結
Framer 是一個強大的工具，有許多優秀的模板可供使用，這些模板不僅具有出色的設計，還能幫助你節省時間，快速構建出精美的界面和動畫效果。若你對 Framer 模板有興趣，可以參考下一篇文章，我將整理出『征服面試：5個質感上乘的免費 Framer 作品集模板』，敬請期待！
