iT邦幫忙

鐵人檔案

第 11 屆 iThome 鐵人賽
回列表
自我挑戰組

一步一腳印,探索網頁前端設計之美 系列

從零開始敘述網頁前端相關知識,讓第一次接觸網頁前端的閱讀者,能輕鬆上手並了解網頁設計是怎麼去設計以及呈現出來。希望在這一段時間,可以讓大家跟著我來一步一步的製作,最後完成一個簡單的網頁。

鐵人鍊成 | 共 33 篇文章 | 34 人訂閱 訂閱系列文 RSS系列文
DAY 1

第一步 - 追逐夢想的開始(前言與目錄)

前言 大家好,我是喵橘,第一次參加iT邦鐵人賽,所以,希望每天督促自己能定時發表一篇文章。而我分享的部分是自己在公司裡自我摸索與學習網頁設計的概念以及操作方法,...

2019-09-02 ‧ 由 喵橘 分享
DAY 2

第二步 - 探索前需準備相關知識(網頁基本知識)

今天喵橘就先講解理論的部分,請大家多多指教喔! 何謂網頁? 在日常生活當中,現在人最習慣早上第一件事情就是打開手機去看是否朋友有留給您,朋友傳遞一個搞笑的新聞內...

2019-09-03 ‧ 由 喵橘 分享
DAY 3

第三步 - 打開地圖,探訪第一站( HTML入門介紹)

大家好,我是喵橘,今天要為大家詳細介紹 HTML 的基礎部分。 HTML 的歷史 前一章節,有簡單提到過網頁是由 HTML 所組成,它中文的名稱叫做超文本標記語...

2019-09-04 ‧ 由 喵橘 分享
DAY 4

第四步 - 繪製具有色彩的路徑 (CSS入門介紹)

大家好,我是喵橘,今天詳細介紹 CSS 的基礎知識。 何謂 CSS ? CSS (英語:Cascading Style Sheets)是用來美化網頁、進行版面設...

2019-09-05 ‧ 由 喵橘 分享
DAY 5

第五步 - 靜靜思考,預想可能遭遇事件(Javascript 入門介紹)

各位大家早安,我是喵橘,今天要帶給各位 JavaScript 的基本概念 JavaScript 的歷史 Javascript 是由 NetScape 公司在 1...

2019-09-06 ‧ 由 喵橘 分享
DAY 6

第六步 - 第一站,顏色萬花筒,七彩村(顏色配置相關基礎)

各位大家好,我是喵橘,今天說明的是跟顏色配置相關的知識,要讓一個網頁展現出真正的質感,就要搭配正確的色彩。 色彩相關術語 飽和度(英文:Saturation)...

2019-09-07 ‧ 由 喵橘 分享
DAY 7

第七步 - 找尋到關鍵的密鑰(網頁設計前的方便軟體推薦)

大家早安,我是喵橘,今天是炎熱的星期日,來寫點文章消消暑,微笑。 撰寫程式推薦的編輯器 在撰寫網頁相關的程式碼,需要有一個編輯器來協助你,HTML是一個純文字格...

2019-09-08 ‧ 由 喵橘 分享
DAY 8

第八步 - 了解密鑰使用方法(設計框架所會遇到的常見問題)

悄悄的經過一個星期,又到了憂鬱的星期一,我是喵橘,今天我要講解設計框架所會遇到的常見問題。 網頁製作前預先準備的態度 網頁並不是直接程式就開始撰寫架構,需要依據...

2019-09-09 ‧ 由 喵橘 分享
DAY 9

第九步 - 啟動密鑰,開起第一層挑戰(HTML 文件結構)

大家早安,我是喵橘,終於開始解說程式碼的部分,先從最基礎的部分開始說明。 使用 HTML 元素、標籤與屬性的建議 在前面章節有簡單說明 HTML 的架構,但在使...

2019-09-10 ‧ 由 喵橘 分享
DAY 10

第十步 - 遇到迷宮,小心迷路(文章會使用的標籤語法)

大家好,終於走到第十天,我是喵橘,讓我喝點茶,再繼續出發吧! 首先,是一些撰寫文章內容的語法,一個一個說給大家聽。 文章會使用的標籤語法 <p> 標籤 <p>...

2019-09-11 ‧ 由 喵橘 分享