RWD響應式網頁設計入門

課程資訊 課程大綱 開課單位 常見問答
Loading...
線上課程

RWD響應式網頁設計入門

18393次瀏覽
NT$360
優惠現領
85 折
【4/9-5/5限時85折】
課程資訊
本頁面課程內容及活動資訊概由廠商提供,部分內容非屬104服務範疇,會員應遵守之規範悉依 104課程中心會員規約 所載。
上課時間 無限期觀看課程查看更多
上課方式 於開課單位網站兌換後觀看課程
課程內容
課程大綱
展開全部
1 簡介說明
01
什麼是響應式網頁設計(Responsive Web Design)? [想了解這門課?快點試閱]
02
有什麼優點 ? [想了解這門課?快點試閱]
03
有什麼缺點與解法 ?
2 怎麼企劃
01
響應式網頁設計流程
02
響應式網頁設計規劃首則
03
響應式網頁範例與牛刀小試時間
04
視覺設計兩大要點
3 RWD怎麼寫
01
實作技術說明 [老師多厲害?歡迎試閱來看看!]
02
1.HTML: Meta Tag寫法
03
2.CSS: Media Queries寫法
04
3.響應式的Grid (排版格線)
05
4.響應式的 image (圖片)
06
5.響應式的 Video (影片)
07
6.隱藏或顯示內容
4 加速開發的RWD框架:Bootstrap
01
什麼是Bootstrap?
02
1.框架入門的7大撇步
03
2.框架外掛(Plug-in)大觀園
04
3.框架好用工具與資源
5 RWD好用輔助工具介紹
01
企劃與格線工具
02
輔助測試工具
03
總結論
你可以學到


1.如果你是網頁企劃或PM,你會通透了解RWD網頁設計原理與優缺點,可企劃接近成品的RWD網頁,並與設計師有效溝通合作。

2.如果你是網頁設計師,你能全面地掌握RWD基本撰寫原理,初步入門Boostrap框架來加速網頁開發,習得更多相關工具與資源來有效工作。
3.如果你是網頁設計新手或平面設計轉網頁設計者,你能快速掌握RWD技巧與相關輔助工具與資源,較其他自學者擁有完整的基礎知識,將來在延伸或深入時的自學方向會更明確。
4.如果你是老闆或主管,可在1小時多的課程內迅速理解RWD技術,較其他「聽說」或「自行Google」的人還具有完整的全方位知識。
適合對象
1.想一次通透理解RWD原理的網頁企劃或PM。2.想要建立完整的RWD基礎概念並提升開發效率的網頁設計師。3.想快速理解RWD基礎知識的老闆或主管。4.想快速入門RWD的網頁新手。
課程講師
張郁青
台灣大學外文系畢業,雖非本科系,但一路走來實際工作都與網路相關。橫跨視覺與前端設計,熟悉HTML/CSS,在網頁設計領域超過13年工作經驗,早期曾在網站製作公司四年,為各類企業客製官網,累積製作超過100個以上的網站。 後在網路行銷圈打滾,初在網路趨勢專家且專營臉書行銷的Mr.6公司旗下擔任視覺總監,為大企業客製行銷網頁。接著轉向電子商務與網路行銷發展,曾任掌方網路行銷部副理,負責電商網站營運,網路銷售英文書籍與代理外國品牌保養品。亦曾在台灣大哥大短暫擔任PM協助內容網站營運事務。以實戰的網頁技術作為基本背景,轉擔任過網頁企劃/網站管理/專案管理等角色,熟悉組織運作與各種角色立場。2013年轉為自由工作者,專職接網頁製作案,近年曾為華碩、聯合報、電影公司、國際賽事、知名部落客等客戶執行視覺設計、活動網站建置、Wordpress架站、網路廣告製作等。 從2009年起因網頁技術專業,曾至中小企業或校園單位演講或授課,除了RWD課程外,亦曾教授以下課程:1. 網頁技術標準之CSS / HTML 2. Photoshop在網頁設計之實務應用3. 非營利組織之免費網頁設計軟體教學4. 如何打造教學用途的部落格5. 部落格架設+寫作+網路行銷實戰工作坊講師網站: http://marygeek.com/FB粉絲頁:鍵盤張馬力 https://www.facebook.com/marygeek.is.here/
展開全部
開課單位
緯育TibaMe
緯育TibaMe由全球最大資通訊集團之一的緯創資通集團於2015年正式成立,我們專注於人才培訓與平台服務,發展多元的授課模式,並結合緯育開發的雲端智能化學習系統,有效培育新世代數位化人才。在行動與雲端時代,用科技加值人才培育,持續發展創新與有效的數位教育學習服務。
最新動態 看所有動態

從想轉職到成功轉職-學長姊現身說最真實

🎤 #學長姊分享 想跨域轉職一路上的 ✅ 心態調適 ✅ 準備過程 ✅ 成功經驗 ✅ 職場真實樣貌,聽我們說不如聽過來人──轉職成功的學長姊現身說最真實~ 這裡報名線上與學長聊聊>> https://bit.ly/4ijQMKh ▍誰適合參加 🔹即將從就業培訓班結訓的你 🔹剛結訓想繼續物色優質職缺的你 🔹想跨域域轉職猶豫中的你 ▍從財金系畢業轉職為後端工程師的學長要跟你分享 🔥 如何結合非本科系的背景創造自己的優勢 🔥 專題作品準備心法 🔥 履歷撰寫技巧與面試準備方向 🔥 進入職場的實際狀況與持續進修該學什麼 🔥 後端工程師未來職涯發展的可能性 ▍直播資訊 時間:4/23 (三) 晚上 8 點至 9 點 型式:線上直播 (直播連結將於報名後2~3個工作天email提供) 報名連結: https://bit.ly/4ijQMKh

AI × Python × 商務應用開發,跨域實戰訓練開放報名!

📢 AI × Python × 商務應用開發,跨域實戰訓練開放報名! 還在等自學開竅?與其被AI浪潮甩在後頭,不如現在就開始打好根基,從AI開發到商務應用一次搞定! 🔥 【商務AI應用人才養成班】第01期 即日起開放報名 系統化訓練從 Python、ChatGPT、LINE Bot、LLM 到雲端部署與專案實戰, 讓你不只能寫程式,還能部署應用、主導AI專案! 📍 上課地點:台北市中山區/部分遠距授課 📆 上課時間:2025/5/27~2025/8/28(共322小時) 🧠 甄試日期:2025/5/15(含 Python 筆試與口試) 💰 訓練費用:勞動部補助 💡 你將學到: Python 程式設計 × 雲端資料處理 × ChatGPT × Gradio × LINE Bot × Azure AI × Docker × LLM 整合應用 AI 協助簡報設計、圖像生成、影片剪輯等商務應用 NLP開發、AI前端、專題實作、專案管理與求職技巧 🎯 就業發展方向: AI應用工程師、提示詞工程師、產品專案經理、Pre-Sales 工程師、商務開發等 課程說明會: https://www.surveycake.com/s/46o6g 課程頁面>> https://www.tibame.com/goodjob/AItalent
常見問答
如何購買課程並開始上課
於欲購買 1. 線上課程之頁面,點擊「立即購買」,成功使用信用卡完成付款並確立訂單成立後,本平台將透過購買填寫之信箱,以郵件方式通知「訂單成立」,後續兌換學習有兩種形式:(A) 若購買學習廠商提供課程,購買後「提供課程兌換序號、兌換連結、兌換碼使用說明」,引導您至購買課程之出版廠商兌換並上課、(B)若購買是104學習系統,購買完可以從郵件、訂單明細、課程詳細頁直接進到站內線上學習。 2. 實體課程之頁面,點擊「立即購買」,成功完成付款並確立訂單成立後,本平台將透過購買填寫之信箱,以郵件方式通知「訂單成立」即可完成報名,後續開課單位會有專員與您聯繫後續事宜。
購買與報名課程付款方式?
僅提供信用卡付款。
有支援信用卡分期嗎?
平台有提供分期服務:結帳金額滿$4,000可享三期零利率,滿$12,000可享六期零利率;分期服務支援銀行公司為:中國信託、台新銀行、玉山銀行,實際分期金額依各發卡行規定
已完成付款,但用錯折扣碼怎麼辦?
請申請退款並重新下單,已使用之折扣碼,本平台將不進行退回,敬請見諒。
線上刷卡後訂單狀態顯示「待付款」
代表您的結帳流程尚未完成,請儘速完成結帳程序,以免課程相關優惠權益失效。
刷卡失敗的原因
可能為以下原因: 1.授權失敗(例:信用卡發卡銀行系統忙碌、網路塞車、刷卡等待時間過久造成系統確認失敗等問題),建議稍待一段時間再重新刷卡。 2.輸入信用卡卡號等相關資料不正確(例:輸入資料不正確、卡號過期、尚未開卡等問題),建議重新確認輸入資訊。
如何選擇紙本發票
為響應政府政策,不主動提供紙本發票,委由金財通系統寄發電子發票開立通知信至學員購買課程時填寫之Email,發票自動存入會員載具,若未收到請告知。
企業請款之憑證,如何申請
若需要進行企業請款,請於購買時輸入統一編號、發票抬頭,本平台將以郵件寄送電子發票方式,至您填寫之信箱。
多久會收到發票
發票將於付款成功,3個工作天內開立,敬請稍候。
如何退款
請參考下方退款須知與流程 1.若您於本平台成功完成付款購買課程,有退款需求,於外部學習廠商兌換之線上課程自購買日起7天內,且未進行課程兌換,可申請全額退費;於104課程中心站內學習課程若購買日起7天內後「未進到學習頁」,可申請全額退費;實體課程須於開課日前 1 日之非假日上班時段前與104學習精靈提出申請,始得要求全額退費。 2.若需申請退款,請使用信件主旨:「課程中心退款申請」,並於信件內容寫明購買人姓名、訂單編號、欲退款之課程名稱,郵件至nabiservice@104.com.tw,本平台將於5個工作天內盡快為您處理。 3.確認提出退款申請時間為課程購買日起7天內,且未進行課程兌換,本平台將與欲申請退款課程之出版廠商,提出會員資料與學習紀錄查詢,確認您課程的觀看紀錄,並同步確認出版廠商訂定之退款事項,是否全數符合。申請退款的同時,即代表您同意本平台與退款課程之出版廠商,提出查詢會員資料與學習紀錄。 4.若您單一訂單中購買兩堂(含)以上課程,不需要整張訂單退款(只退其中幾堂課),退款金額為欲退款課程售價加總後,扣除此張訂單所使用之折扣碼(若折扣碼為整張訂單之折數折扣,則退款金額為欲退款課程售價加總後乘以折數折扣),若計算後退款金額低於(含)0元,本平台將不執行退款。5.上述退款方式僅限於本平台成功完成付款購買之課程,若付款與訂單成立之任一程序不在本平台完成,退款方式需依照課程出版之廠商所訂定之規則提出申請,並由課程出版廠商協助處理,本平台不介入。 6.若您的發票沒有填寫統一編號,並需要辦理退款時,由本平台代為處理發票相關作業 (如作廢電子發票或開立電子發票折讓單),以加速退款作業時程。 7.若您原訂單信用卡分期,其申請退費時,須整筆訂單全額退費,無法部分或擇一課程退費。
款項何時退回
課程退費採原信用卡退刷方式,退費所需之工作天依各金融機構實際作業時間為準。
相關證照
網頁設計證照
因應知識經濟與文創產業的時代來臨,各產業均發生結構性的變化,「設計」所帶來的附加價值與影響也日趨明顯。為了不淹沒在此一浪潮中,台灣產業界對於設計能力的提升,產生了迫切的需求。優秀而充足的人力是企業提升設計能力的根基,為提供產業界符合新時代的專業人才,本會推動「TQC+ 專業設計人才認證」,藉由嚴謹的認證職能體系架構與專業完善的考試服務,培育出符合企業職場需要的人才。 ● 為國際級證書,獲印度國家電子資訊科技學院(NIELIT)採認。 ● 以「專業設計領域任職必備能力」為認證標準。 ● 認證內容涵蓋「工程設計」、「視傳設計」、「軟體設計」、「電路設計」、「建築設計」、「跨域設計」等六大專業領域。 ● 擁有整合知識體系與專業技能的認證架構,是最貼近實際使用環境與就業需求的證照。
網頁設計專業人員
TQC+認證依各領域設計人才之專業謀生技能為出發點,根據國內各產業專業設計人才需求,依其工作職能及核心職能,規劃出各項認證測驗。 在視傳設計領域中,本會經過調查分析最普遍的工作職稱,根據各專業人員之職務不同,彙整出相對應之工作職務(Task),以及執行這些工作職務所需具備之核心職能(Core Competency)與專業職能(Functional Competency),規劃出幾項專業設計人員,分別為:「平面設計專業人員」、「Flash動畫設計專業人員」、「多媒體網頁設計專業人員」、「網頁設計專業人員」、「數位出版專業人員」等。
TQC-WD網頁設計類-FrontPage (停考)
企業人才技能認證(TQC)是財團法人中華民國電腦技能基金會針對企業用才需求,所提出來的一項整合性認證。由TQC-WD網頁設計類-FrontPage是財團法人中華民國電腦技能基金會所規劃的電腦技能認證,通過TQC-WD網頁設計類-FrontPage認證,可應用於專業電子商務應用工程師、專業網頁設計工程師、專業多媒體網頁設計工程師等職務上。
TQC-WD網頁設計類-HTML (停考)
企業人才技能認證(TQC)是財團法人中華民國電腦技能基金會針對企業用才需求,所提出來的一項整合性認證。TQC-WD網頁設計類-HTML是由財團法人中華民國電腦技能基金會所規劃的電腦技能認證,通過TQC-WD網頁設計類-HTML認證,可應用於專業電子商務應用工程師、專業網頁設計工程師、專業多媒體網頁設計工程師等職務上。
TQC專業多媒體網頁設計工程師 (停考)
企業人才技能認證(TQC)是財團法人中華民國電腦技能基金會針對企業用才需求,所提出來的一項整合性認證。這項認證是經過詳細調查、分析各職務工作需求,確認從事該項職務究應具備哪些電腦技能,再對所有電腦技能測驗項目重新歸類整合而成。不但能讓有志於從事多媒體網頁設計相關職務的人員掌握學習的方向,對求才企業也提供了更快速、更客觀、更簡化的人才甄選程序。
TQC-WD網頁設計類-JavaScript (停考)
企業人才技能認證(TQC)是財團法人中華民國電腦技能基金會針對企業用才需求,所提出來的一項整合性認證。TQC-WD網頁設計類-JavaScript是由財團法人中華民國電腦技能基金會所規劃的電腦技能認證,通過TQC-WD網頁設計類-JavaScript認證,可應用於專業網站程式開發工程師等職務上。
丙級網頁設計技術士
為提昇網頁設計專業人員之技能水準,建立職業證照制度,丙級應具備在視窗環境的網頁製作、測試及應用網頁物件的能力。
TQC專業網頁設計工程師 (停考)
企業人才技能認證(TQC)是財團法人中華民國電腦技能基金會針對企業用才需求,所提出來的一項整合性認證。
TQC-WD網頁設計類-ASP (停考)
企業人才技能認證(TQC)是財團法人中華民國電腦技能基金會針對企業用才需求,所提出來的一項整合性認證。通過TQC-WD網頁設計類-ASP認證,可應用於專業電子商務應用工程師、專業互動式網頁設計工程師、專業網站程式開發工程師等職務上。
TQC+ 多媒體網頁設計專業人員 (停考)
TQC+認證依各領域設計人才之專業謀生技能為出發點,根據國內各產業專業設計人才需求,依其工作職能及核心職能,規劃出各項認證測驗。 在視傳設計領域中,本會經過調查分析最普遍的工作職稱,根據各專業人員之職務不同,彙整出相對應之工作職務(Task),以及執行這些工作職務所需具備之核心職能(Core Competency)與專業職能(Functional Competency),規劃出幾項專業設計人員,分別為:「平面設計專業人員」、「Flash動畫設計專業人員」、「多媒體網頁設計專業人員」、「網頁設計專業人員」、「數位出版專業人員」等。
TQC+ VD-響應式網頁設計
為提供產業界符合新時代的專業人才,認證依照職場人才需求趨勢推動「TQC+專業設計人才認證」,藉由嚴謹的認證職能體系架構與專業完善的考試服務,培育出符合企業職場需要的人才。
TQC+ VD-響應式網頁編輯製作
為提供產業界符合新時代的專業人才,認證依照職場人才需求趨勢推動「TQC+專業設計人才認證」,藉由嚴謹的認證職能體系架構與專業完善的考試服務,培育出符合企業職場需要的人才。
網頁程式設計
因應知識經濟與文創產業的時代來臨,各產業均發生結構性的變化,「設計」所帶來的附加價值與影響也日趨明顯。為了不淹沒在此一浪潮中,台灣產業界對於設計能力的提升,產生了迫切的需求。優秀而充足的人力是企業提升設計能力的根基,為提供產業界符合新時代的專業人才,本會推動「TQC+ 專業設計人才認證」,藉由嚴謹的認證職能體系架構與專業完善的考試服務,培育出符合企業職場需要的人才。 ● 為國際級證書,獲印度國家電子資訊科技學院(NIELIT)採認。 ● 以「專業設計領域任職必備能力」為認證標準。 ● 認證內容涵蓋「工程設計」、「視傳設計」、「軟體設計」、「電路設計」、「建築設計」、「跨域設計」等六大專業領域。 ● 擁有整合知識體系與專業技能的認證架構,是最貼近實際使用環境與就業需求的證照。