在科學的領域,每個人都要學習數學,因為數學是科學的母語,但並不是每個人都要成為數學家。
而在這個科技引領世界的潮流中,程式是科技的共通語言,雖然不是每個人都要成為開發者,但如果能夠學習程式,將讓溝通與理解能力更上一層樓。








網頁是通往所有資訊技術的入口,每個人每天都瀏覽無數的網頁,因此從最熟悉的開始,會讓大家更能接受。同時,網頁也是隨學即用的技術,能夠與工程師溝通、打造行銷自己創意的舞台,也能增加就業機會與薪資談判空間,因此學習網頁程式將會是您最佳的選擇。










寫網站就跟蓋房子一樣,HTML是鋼骨水泥,建立房子的骨架CSS是粉刷跟裝潢,讓我們加入自己的設計Jquery是家裡的家具,電器,為房子注入活力。
只要方法正確,循序漸進,大家都可以輕鬆學會。




















我們相信 Innovation leads the way.並且正在嘗試利用程式改變世界。平常主要以接案為主,KPMG、獵豹科技、政大之聲都是我們服務的客戶。但我們覺得這樣還不夠,我們覺得教育能帶來更多、更廣的改變,因此讓 Aptan 來帶領大家進入網頁的殿堂吧!

我們團隊為了提升自己的核心能力,花了很多時間精力自學。我們知道自學的痛苦與困難,我們也曾經當過初學者,經驗了許多無助、想放棄的時刻,但我們活下來了。因此,我們更能知道如何解決初學者的困擾!

如果你不知道該從哪裡開始? 不知道該怎麼問? 又該問誰? 我們將會是你最適合的選擇!




作品一:共構 CO-CONSTRUCTION



作品二:Exchange World





1. 看懂網路程式語言,讓你有能力與工程師溝通
2. 編寫網頁程式語言,運用多種雲端工具與資源讓網站上線
3. 寫出一頁式瀏覽的活動網站 Landing Page
4. 寫出專業的企業形象網站來行銷商品與服務內容
5. 寫出極具特色的個人網站,例如:作品集、履歷檔案
6. 瞭解 RWD 讓網頁適應各種螢幕的大小
7. 瞭解 SEO 搜尋引擎優化以提升網頁曝光率







Q1:請問在哪裡上課?上課時間是?
此課程是「線上課程」喔!課程上線後,台灣甚至世界任何角落都能隨時隨地透過手機、平板、電腦觀看。

Q2:課程可以看幾次、看多久?

購課後享不限次數、永久觀看,可以一直看一直學!

Q3:誰適合上這門課?
1. 想要增加就業機會、提高薪資的大學生
2. 期盼能夠展現並公開發表自己豐富才華的你
3. 工作上需要與工程師溝通、或者自己調整網頁排版的你
4. 希冀能夠做出自己品牌、進行網路行銷的創業家
5. 希望從後端邁入前端,成為全端工程師的你


Q4:可以問Aptan團隊問題嗎?
當然呀,歡迎到課程圖下方『購課問答』詢問,購買之後還可以到『課程討論』區和老師互動,Aptan團隊收到通知後會儘速回答您的問題!

Q5:如何付款?
YOTTA 目前提供 3 種付款方式供您選擇:信用卡、ATM轉帳、便利超商繳費。

單元

43

課程總長

548分鐘

課堂測驗

尚無測驗

  • 一、網頁基本架構
  • 1 什麼是HTML? 試看 08:39
  • 2 什麼是CSS? 試看 08:04
  • 3 網頁的運作與階層 試看 08:48
  • 二、HTML中的元素
  • 4 建立網頁基礎骨架 試看 02:49
  • 5 文字的標題與段落 試看 06:18
  • 6 選單與表單的製作 試看 24:51
  • 7 如何切分網頁區塊? 試看 06:17
  • 8 嵌入圖片、聲音、影片 試看 05:24
  • 9 刻劃表格 試看 08:22
  • 10 編號與列點清單 試看 06:34
  • 三、CSS
  • 11 如何套用CSS? 試看 14:05
  • 12 文字的樣式 試看 13:17
  • 13 設定元件外框 試看 12:07
  • 14 RWD響應式網頁設計-適應各種螢幕大小 試看 07:05
  • 15 RWD-元素位置大小設定 試看 15:26
  • 16 元素排列 試看 08:17
  • 17 自製項目列表的樣式 試看 04:56
  • 18 擬態選取器(1) -與使用者互動 試看 14:19
  • 19 擬態選取器(2) -元素間互動 試看 09:14
  • 20 CSS零零總總 試看 11:30
  • 四、jQuery - 包覆JavaScript的糖衣
  • 21 為什麼要學 jQuery? 試看 13:46
  • 22 讓網頁活起來 - 事件處理 試看 24:08
  • 23 用程式產生網頁 (上) 試看 20:38
  • 24 用程式產生網頁 (下) 試看 51:32
  • 25 動態資源傳輸 - Ajax 試看 21:55
  • 五、 雲端工具與資源
  • 26 雲端素材與工具介紹 試看 13:12
  • 27 雲端資料庫 - Firebase 試看 24:51
  • 28 雲端平台 - Heroku 試看 08:51
  • 六、 情境準備
  • 29 網頁開發工具、 環境介紹 試看 34:09
  • 七、情境一 (活動網站 Landing Page)
  • 30 吸睛的活動網站視覺設計-一頁式瀏覽 試看 06:09
  • 31 如何在手機上也能完整呈現資訊 試看 13:51
  • 32 報名與訂閱 試看 05:28
  • 33 SEO 搜尋引擎優化 - 提高搜尋曝光率 part 1 試看 08:12
  • 八、情境二 (企業形象網站)
  • 34 專業的企業形象網站視覺設計 試看 07:11
  • 35 規劃產品、服務目錄 試看 07:23
  • 36 後台管理 - API串接 試看 06:15
  • 37 與我聯繫 - Chatbox 試看 06:01
  • 38 SEO 搜尋引擎優化 - 提高搜尋曝光率 試看 16:46
  • 九、情境三 (個人網站)
  • 39 極具個人風格的視覺設計 試看 05:41
  • 40 內容管理 - 後台的API串接 試看 14:28
  • 41 留言與回覆 - 與FB社群網站互動 試看 05:51
  • 10、解鎖課程
  • 42 讓你Coding 更輕鬆 試看 14:49
  • 43 如何讓你的網頁更有質感 試看 20:28

開始分享你的學習成果吧!

這裡是專屬於課堂學員及老師可以互動的作業區,學員們可以透過實際操作來複習課程中所學習到的內容,作業完成後只要簡單上傳到平台裡,就能得到更多老師的指點唷!同時,在這裡也可以觀摩其他學員的成果,一起來互相切磋吧!

<%if list.length == 0 %>

尚無作業

老師還沒有出作業唷!

<%else%><%props list%>

作業<%>~numToZH(~toInt(key) + 1)%>

<%if prop.type == 'image' %> 圖片檔 <%else prop.type == 'pdf' %> picture_as_pdfPDF <%else prop.type == 'youtube' %> Youtube 影片連結 <%else prop.type == 'ppt' %> PowerPoint <%else prop.type == 'sound' %> 錄音檔 <%/if %>

<%:prop.title%>

<%/props%><%/if%>

作業觀摩

目前還沒有任何學員上傳作業喔!來當第一個吧~

<%props data%>

<%if prop.type == 'image' %> <%else prop.type == 'pdf' %> picture_as_pdf <%else prop.type == 'youtube' %> <%else prop.type == 'ppt' %> <%else prop.type == 'sound' %> <%/if %> 作業<%>~numToZH(~toInt(key) + 1)%> <%:prop.title%>

<%props prop.rows %>
<%if prop.type == 'image'%>
<%else prop.type == 'pdf' %>
picture_as_pdf
<%else prop.type == 'youtube' %>
<%else prop.type == 'ppt' %>
<%else prop.type == 'sound' %>
<%/if %>
<%if prop.isAuthor and prop.visible == 1 %> <%/if %>

<%:~formatDate(prop.create, 'YYYY-MM-DD')%>

<%:prop.title%>

<%:prop.user%>

<%if prop.isAuthor %> 刪除 編輯 <%/if %>

<%:prop.comment_count%>

<%/props%>
<%/props%>

錄音 <%:~numToZH(sort + 1)%>

錄音 <%:~numToZH(sort + 1)%>

來關注最新的課程資訊吧!

這裡是專屬課程的公告區,老師將在此發佈與課程相關的重要資訊,您可以在此看到所有與課程有關的最新公告。

尚無公告

老師還沒有發佈公告唷!

<%props data%>

<%:~formatDate(prop.publishDate, 'YYYY/MM/DD')%>

<%:prop.title%>

<%:prop.content%>
<%/props%>

回頂端