一变应万变的响应式网页设计

课程介绍：

透过动画理解原理

对于教学只有程式码是不足够的，在重要的观念传达部分，我们製作大量的说明动画来介绍，在了解原理后再看难以理解的程式码。

行动版中的超实用技巧

行动版网站只有版面切换是不足够的，课程中还会补充许多行动版网站动态效果，优化网站中的使用者体验。

为您的客户量身打造响应式网页

行动版网站已势不可当，在人手一支手机的情况下，各家厂商都想要加入行动版的网站，课程中还包含不同部门合作、用户沟通心法，使开发更顺利。

〖课程目录〗:

• | └──5、一變應萬變的響應式網頁設計
• | | ├──01 六角學院線上資源
• | | | └──001 六角學院線上社團[www.ko996.com].html 1.97kb
• | | ├──02 基本環境介紹
• | | | ├──002 什麼是響應式網頁設計？(上)[www.ko996.com].mp4 10.87M
• | | | ├──003 什麼是響應式網頁設計？(下)[www.ko996.com].mp4 23.89M
• | | | ├──004 1-viewport[www.ko996.com].zip 0.55kb
• | | | ├──004 基本環境建立 (上)[www.ko996.com].mp4 10.96M
• | | | ├──005 基本環境建立 (下)[www.ko996.com].mp4 13.30M
• | | | ├──006 1-maxwidth[www.ko996.com].zip 1.04kb
• | | | ├──006 CSS 3 Media Query 觀念 (上)[www.ko996.com].mp4 20.97M
• | | | ├──007 CSS 3 Media Query 觀念 (下)[www.ko996.com].mp4 9.73M
• | | | ├──008 1-minwidth[www.ko996.com].zip 0.99kb
• | | | ├──008 min-width 語法教學[www.ko996.com].mp4 8.21M
• | | | ├──009 你知道瀏覽器內建就有模擬 Mobile 介面工具了嗎？[www.ko996.com].mp4 43.92M
• | | | └──010 六角學院線上問答會[www.ko996.com].html 3.18kb
• | | ├──03 常見版型佈局設定
• | | | ├──011 禁止顯示 x 軸法則[www.ko996.com].mp4 29.93M
• | | | ├──012 max-width：一個小設定輕易將網頁設定成流體式佈局[www.ko996.com].mp4 36.14M
• | | | ├──013 版型單位 % 數觀念[www.ko996.com].mp4 23.10M
• | | | ├──014 2-maxwidth-percent[www.ko996.com].zip 3.13kb
• | | | ├──014 三欄流體式設計[www.ko996.com].mp4 66.83M
• | | | ├──015 2-floatleft-rightcontent[www.ko996.com].zip 4.18kb
• | | | ├──015 左側 Float固定、右側流體式設計[www.ko996.com].mp4 40.81M
• | | | ├──016 2-maxwidth-percent-none[www.ko996.com].zip 4.24kb
• | | | ├──016 Float：none 清除浮動並排效果[www.ko996.com].mp4 27.25M
• | | | ├──017 2-website[www.ko996.com].zip 13.00kb
• | | | ├──017 網站版型框架設定[www.ko996.com].mp4 42.93M
• | | | ├──018 images[www.ko996.com].zip 101.52kb
• | | | └──018 第二章作業[www.ko996.com].mp4 12.58M
• | | ├──04 以 UI 設計角度切入響應式設計該注意的細節
• | | | ├──019 動線設計：並非所有內容都要全部塞到網頁內容[www.ko996.com].mp4 7.76M
• | | | ├──020 斷點時機：設計多欄式佈局的必要觀念[www.ko996.com].mp4 15.07M
• | | | ├──021 點擊範圍：設計讓人好點選的元素[www.ko996.com].mp4 6.55M
• | | | ├──022 少即是多：避免資訊量爆炸[www.ko996.com].mp4 5.37M
• | | | ├──023 載具特性：使用者行為 touch、hover 傻傻分不清楚[www.ko996.com].mp4 5.82M
• | | | └──024 斷點元素：只有手機才會顯示的功能與Layout切換[www.ko996.com].mp4 9.74M
• | | ├──05 斷點規劃
• | | | ├──025 先要有個認知，響應式無法讓所有螢幕解析度都最佳化[www.ko996.com].mp4 28.98M
• | | | ├──026 遵循 80_20 法則，先兼容熱門瀏覽器吧！[www.ko996.com].mp4 19.42M
• | | | ├──027 5-mobilefirst[www.ko996.com].zip 19.79kb
• | | | ├──027 什麼是 Mobile First 與 Desktop First 優先？[www.ko996.com].mp4 41.66M
• | | | ├──028 5-whymobilefirst[www.ko996.com].zip 20.17kb
• | | | ├──028 為何要考量 Mobile First 與 Desktop 優先的網頁版型？[www.ko996.com].mp4 41.09M
• | | | ├──029 常見 PC 解析度斷點設計[www.ko996.com].mp4 53.59M
• | | | ├──030 Viewport Sizes 服務網站介紹[www.ko996.com].mp4 7.59M
• | | | └──031 六角講師斷點設計分享[www.ko996.com].html 2.58kb
• | | ├──06 響應式表格與表單設計
• | | | ├──032 6-table-none[www.ko996.com].zip 17.32kb
• | | | ├──032 響應式表格設計 (上)[www.ko996.com].mp4 28.07M
• | | | ├──033 6-table-overflow[www.ko996.com].zip 3.52kb
• | | | ├──033 響應式表格設計 (下)[www.ko996.com].mp4 18.47M
• | | | ├──034 pure[www.ko996.com].css：加強你對網頁元素的了解[www.ko996.com].mp4 11.85M
• | | | ├──035 pure[www.ko996.com].css：按鈕設計原理[www.ko996.com].mp4 36.00M
• | | | ├──036 6-purebutton[www.ko996.com].zip 14.02kb
• | | | ├──036 pure[www.ko996.com].css：自行新增子模組[www.ko996.com].mp4 40.67M
• | | | ├──037 pure[www.ko996.com].css：重新認識表單狀態[www.ko996.com].mp4 64.26M
• | | | ├──038 6-formchange[www.ko996.com].zip 7.25kb
• | | | ├──038 pure[www.ko996.com].css：如何將表單整合至網頁[www.ko996.com].mp4 63.93M
• | | | └──039 表單設計：文字欄位並非只有「text」[www.ko996.com].mp4 10.79M
• | | ├──07 響應式圖形設計
• | | | ├──040 8-maxwidth[www.ko996.com].zip 216.27kb
• | | | ├──040 基礎篇：響應式圖片設計[www.ko996.com].mp4 40.77M
• | | | ├──041 8-reset[www.ko996.com].zip 216.50kb
• | | | ├──041 基礎篇：響應式圖片 reset 教學[www.ko996.com].mp4 20.48M
• | | | ├──042 8-bigimg[www.ko996.com].zip 447.90kb
• | | | ├──042 心法篇：圖片 SIZE 規劃，刻意設計較大張一點的技巧[www.ko996.com].mp4 70.51M
• | | | ├──043 心法篇：判斷圖片使用時機[www.ko996.com].mp4 16.36M
• | | | ├──044 SVG 篇：向量圖片介紹[www.ko996.com].mp4 17.61M
• | | | ├──045 logo[www.ko996.com].ai[www.ko996.com].zip 351.76kb
• | | | ├──045 SVG 篇：繪圖軟體匯出 svg 與 png 圖片流程[www.ko996.com].mp4 8.56M
• | | | ├──046 8-svg-logo[www.ko996.com].zip 12.62kb
• | | | ├──046 SVG 篇：將 LOGO 取代為 SVG 格式[www.ko996.com].mp4 10.65M
• | | | ├──047 big[www.ko996.com].png 555.48kb
• | | | ├──047 small[www.ko996.com].png 320.37kb
• | | | ├──047 技巧篇：Banner 設計 – 縮放圖片原理[www.ko996.com].mp4 23.18M
• | | | ├──048 -codepen[www.ko996.com].txt 0.03kb
• | | | ├──048 技巧篇：Banner 設計 – 背景擷取[www.ko996.com].mp4 16.50M
• | | | ├──049 TinyPNG[www.ko996.com].txt 0.02kb
• | | | └──049 工具篇： tinypng 壓縮圖片服務[www.ko996.com].mp4 21.16M
• | | ├──08 常見響應式設計選單
• | | | ├──050 -[www.ko996.com].txt 0.08kb
• | | | ├──050 Off-canvas-[www.ko996.com].txt 0.03kb
• | | | ├──050 響應式選單常見樣式[www.ko996.com].mp4 33.00M
• | | | ├──051 menu-sample[www.ko996.com].zip 2.08kb
• | | | ├──051 多欄多列式設計細節[www.ko996.com].mp4 23.96M
• | | | ├──052 menu-Hamburger[www.ko996.com].zip 33.07kb
• | | | ├──052 漢堡選單設計[www.ko996.com].mp4 52.68M
• | | | ├──053 menu-fixed[www.ko996.com].zip 33.07kb
• | | | ├──053 固定式選單 (Fixed)[www.ko996.com].mp4 26.28M
• | | | ├──054 menu-new-offcanvas[www.ko996.com].zip 44.88kb
• | | | ├──054 Off Canvas 選單設計[www.ko996.com].mp4 41.81M
• | | | └──055 選單設計總結[www.ko996.com].mp4 15.24M
• | | ├──09 開始實作前的注意事項
• | | | ├──056 確認你的 media query 設定[www.ko996.com].mp4 18.18M
• | | | ├──057 media 到底要全部寫在一起還是隔離[www.ko996.com].mp4 22.87M
• | | | ├──058 8-height-auto[www.ko996.com].zip 13.15kb
• | | | └──058 請不要習慣寫死高度[www.ko996.com].mp4 11.33M
• | | ├──10 最後，讓你的響應式網頁設計更專業
• | | | ├──059 最終作業寄送 mail 變更[www.ko996.com].html 1.34kb
• | | | ├──060 -[www.ko996.com].txt 0.12kb
• | | | ├──060 最後一版作業練習[www.ko996.com].mp4 38.48M
• | | | ├──061 最後一版作業細節 (多頁設計)[www.ko996.com].mp4 24.13M
• | | | └──062 最後一版作業評分標準[www.ko996.com].mp4 24.64M
• | | ├──11 PM、Sales、Art、F2E、Backend 之間如何真心合作
• | | | ├──063 -Google-[www.ko996.com].txt 0.07kb
• | | | ├──063 業務篇：如何說服客戶導入響應式設計[www.ko996.com].mp4 21.06M
• | | | ├──064 業務篇：各部門投入人力時程比較[www.ko996.com].mp4 31.38M
• | | | ├──065 企劃篇：為客戶量身打造客製化斷點設計[www.ko996.com].mp4 28.19M
• | | | ├──066 企劃篇：開發過程中，你需要與客戶溝通的建置與維護細節[www.ko996.com].mp4 51.58M
• | | | ├──067 前端篇：設計一套讓客戶能夠自行上稿的 template[www.ko996.com].mp4 17.63M
• | | | ├──068 前端篇：注意網頁載入速度與效能問題[www.ko996.com].mp4 31.41M
• | | | └──069 全部門：以電子商務網頁版型為例進行探討[www.ko996.com].mp4 24.62M
• | | ├──12 彩蛋課程：Sass、RWD 無痛整合，提升網頁開發效率
• | | | ├──070 Sass+Sublime Text 3 插件安裝[www.ko996.com].html 1.17kb
• | | | ├──071 環境篇 – 簡單編譯環境，輕鬆好上手[www.ko996.com].mp4 13.94M
• | | | ├──072 寫法篇 – 減少重工負擔[www.ko996.com].mp4 26.90M
• | | | ├──073 變數篇 – 整合相同設定好幫手[www.ko996.com].mp4 21.53M
• | | | ├──074 拆檔篇 – @import_ 每隻 Sass 檔專心做一件事情[www.ko996.com].mp4 18.93M
• | | | ├──075 工具篇 – @mixin_ 將常用語法化簡為自己的知識庫[www.ko996.com].mp4 17.36M
• | | | ├──076 載具篇 – @mixin+@content 設計響應式設計超方便[www.ko996.com].mp4 20.69M
• | | | ├──077 結構篇 – 如何循序漸進優化網頁架構[www.ko996.com].mp4 10.42M
• | | | └──078 作業篇 – 試著將作業改成 SASS 架構[www.ko996.com].mp4 13.22M
• | | ├──13 彩蛋課程：視差滾動網頁設計
• | | | ├──079 視差滾動簡介[www.ko996.com].mp4 12.14M
• | | | ├──080 視差滾動練習範例[www.ko996.com].html 1.60kb
• | | | ├──081 視差滾動基本環境介紹[www.ko996.com].mp4 23.16M
• | | | ├──082 CSS 固定背景的手法[www.ko996.com].mp4 16.86M
• | | | ├──083 一頁式宣傳頁常用的選單滑動效果[www.ko996.com].mp4 49.55M
• | | | ├──084 動態顯示的進度條[www.ko996.com].mp4 39.26M
• | | | ├──085 滾動套用 CSS 效果[www.ko996.com].mp4 25.07M
• | | | └──086 滾動中持續改變物件位置 (CSS transform)[www.ko996.com].mp4 25.66M
• | | ├──14 響應式工具與服務介紹
• | | | ├──087 Google-mobile-friendly[www.ko996.com].txt 0.04kb
• | | | ├──087 Google-[www.ko996.com].txt 0.06kb
• | | | └──087 PageSpeed：使用 Google 線上服務觀察 Mobile 速度與使用體驗[www.ko996.com].mp4 40.07M
• | | └──Quiz(responsive)[www.ko996.com].html 14.36kb

yeyudao普通

收藏 海报 链接