line icon fb icon 最新開課時間 設計學校榜單 設計專業師資 設計學員分享 設計影音分享
台北諮詢
高雄諮詢
  1. 首頁
  2. 電腦類課程
  3. RWD網頁製作課程

RWD網頁製作課程-電腦類課程


icon 防疫期間,本課程採線上課程Google meet直播互動教學,日後將依政府規定,改採線上/實體並行方式,提供同學多元學習選擇~icon

RWD網頁設計

HTML5 + javascript + CSS3+ SEO觀念

本課程針對適應各種不同介面,進行UI設計教學,並透過RWD觀念學習網頁設計語法,並透過RWD網頁開發流程帶領同學完整製作一專案作品。 如果你喜歡,最後也可以把建置好的RWD網站,透過一個簡單的軟體,瞬間變成APP上架!


UI、RWD網頁設計

響應式網頁設計(Responsive Web Design,RWD)

又稱適應性網頁、自適應網頁設計、回應式網頁設計、多螢網頁設計,被公認為日後網頁設計開發技術的趨勢。

網站會因應瀏覽裝置的解析度或寬度,自動調整整體文字大小、間距、區塊排版、圖片縮放等,使網站在不同的裝置或瀏覽器上,呈現最佳的瀏覽樣式,提供最佳的視覺體驗,是個因行動裝置用戶大量增加而想出的對應方法。

使用RWD網站最大的優點就是,只需要透過一個網址,所有資料的瀏覽與更新都只需要在一個後台操作,就可以在不同的瀏覽器、與裝置瀏覽網站。


RWD網站的優點:

► 一個網站能隨不同螢幕大小調整內容


► 提升SEO網頁排名(google喜歡):優化你的網頁能讓你的網頁容易在搜尋引擎找到。在SEO這一方面除了大勝app外,而相較於獨立網址的手機版網站,自適應網頁可以避免重覆的內容、保持網頁原本的連結,因此自適應網頁設計的原理與使用習慣都有利於於SEO。


► 開發成本與時間比APP低:APP必須開發iOS版及Android版兩版本,任一版本皆至少個花費數十萬元建置,加上開發及審核上架時間相當冗長,相對RWD網站開發容易快速,建議一個等於同時建置網站、手機、IPAD介面。


► 不需下載APP就能使用:這是所有手機版網頁相較於手機APP的最大優勢。APP必須被下載,若要更新,開發端必須重新審核過後,用戶才能更新。相對RWD網頁,只要管理者更新網站,每次連上網頁都會是最新版本。


► 維護成本比APP低:APP完成之後要不定期需針對新版本測試,才能確定APP在新手機上能運作順暢。以目前新手機上市的頻率來看,開發端需要一直不斷測試、更新。


► 品牌識別形象統一:同一網站適用於各種裝置,自然不需要針對不同版本設計不同視覺效果。


► 利於分享:APP沒有網址可以分享,但網站可以分享。

課程內容

HTML5

結構與標籤
相對與絕對尺寸
基本容器設定
快速建立三列式網頁
 
 
 

CSS3

觀念與應用
屬性設定(文字、排版、圖片)
float、position的應用
建立多欄式網頁
快速建立相簿、滑鼠互動
響應式網頁的建構
欄位變換設定

JQUERY

基礎語法觀念
RWD選單製作
符號應用
語法應用
 
 
 

SEO

觀念說明
實際執行技巧
雲端字型設定
 
 
 
 

10堂 I 共30HR I $16,800


建議加修Photoshop影像處理軟體