鐵人檔案
一起動手！透過學習Bootstrap和jQuery，從UI/UX設計理論到實際程式撰寫，掌握整體開發流程，打造具備優良使用者體驗的互動性響應式網頁。如果你對HTML、CSS和JavaScript已經有一點的認識及實作經驗，也有興趣學習更方便的開發工具，歡迎閱讀這系列的文章。如果沒有也沒關係，只要你有興趣，都能輕鬆入門這一系列文章。快來跟我一起開啟你的網頁開發之旅吧！
前言 在文章開始前，讓我先來介紹一下自己吧！ 我是一個對網頁視覺充滿興趣的大學生，目前在一家公司擔任網頁前端工程師的實習生。很開心能夠在這裡和...
什麼是UI/UX設計? 相信大家多少都有聽過UI/UX，不過卻對於概念和流程理解的比較模糊，今天這一單元會講述UI/UX的一些重要的概念以及流程，並開...
什麼是Flow Chart?為什麼要使用Flow Chart? 創造一個網站時，當你釐清使用者的痛點與需求，也確定好網站需要呈現的資訊及功能，這時...
什麼是Wireframe?為什麼要畫Wireframe? 線框圖(Wireframe)顧名思義就是由框線構成的的架構圖，通常是由簡單的、黑白的圖...
什麼是Mockup?和Wireframe的差別? Mockup的中文名稱叫做視覺高保真設計，和Wireframe的差別在於，它不僅包含介面元素的位...
為什麼要學習製作動畫效果呢? 大家可能多少都會有點疑惑，為什麼要在設計中添加動畫效果呢？只是為了美觀嗎?實際上，當你在設計中嵌入動畫時，可以實現多...
什麼是Prototype? Prototype就是我們開發產品時，很常聽到的「原型」，它能展現整個網頁主要的功能和用戶介面的互動，通常伴隨著動態的...
前置作業 一、下載Visual Studuo Code 你可以使用任何你習慣使用的純文字編輯器，像是Atom、Sublime Text，或者去年的鐵人...
HTML的巢狀結構 昨天你使用VS Code輸入「!」快捷鍵所產生的網頁架構程式碼，你會發現它是由一層HTML元素包著另一層HTML元素所構成的，...
自關閉標籤(self-closing tag) 還記得前面章節提到的，有些HTML標籤是不需要結束標籤的，我們會稱它們為自關閉標籤(self-cl...
