網頁設計筆記

網頁設計進階筆記

簡介

迎來到網頁設計的世界,網頁設計是現代設計人須具備的基本技能,他比一般的平面設計更為複雜一點,需要大家投入更多的時間練習,請大家跟著我們的步伐,你也可以成為很棒的網頁設計師,讓自己擁有更具優勢的能力,面對未來的職場。

本課程介紹網頁設計的概念與從事網頁設計師所需具備的能力,以 Dreamweaver為學習操作軟體,或以sublime text、notepad++等等撰寫語法編輯軟體使用,利用Filezilla檔案傳輸軟體傳輸網頁,建立個人網站,主要側重於對網頁編輯語言HTML及CSS的基礎學習,了解網頁架構建立原理,充實基本網頁應用技術的能力, 製作出屬於自己個性化的網站或專題網站,以作為進階網頁設計製作的基礎。

HTML筆記

CSS筆記

CSS的中文稱為「串接樣式表」,CSS的特色:

(1)它能讓我們更精確的控制網頁版面的文字、背景、字型等網頁外觀及美化。
(2)它能只修正一個 CSS 文件,便可同時更新眾多的網頁版面外觀及格式。
(3)它可以使 html 的文件內碼更精簡,縮小檔案下載的速度。
(4)適用於各種作業平台。

常見CSS選取器(Selector)種類簡介

Class selectors
(Class選擇器,Dreamweaver稱為類別選擇器)
「.」開頭,名稱可自訂,一頁網頁可有多個class屬性值,且同一class屬性值可同時套用多處。
ID selectors(ID選擇器) 「#」開頭,名稱可自訂,一頁網頁同一個ID屬性值只能套用一個地方,屬於獨一無二的屬性值。
Type selectors(型態選擇器,Dreamweaver稱為標籤選擇器,因為套用於HTML標籤 設定於HTML的標籤上,網頁上所有的標籤都會套用。

RWD介紹

響應式網頁設計(Responsive Web Design)簡稱RWD,這是一項開始於2011年由Ethan Marcotte 發明的術語 Responsive Web Design (RWD)。2012年後被公認為是日後網頁設計開發技術的趨勢,網站使用CSS3,以百分比的方式以及彈性的畫面設計,在不同解析度下改變網頁頁面的佈局排版,讓不同的設備都可以正常瀏覽同一網站