主題活動
6/3前 圖書滿$1,000折$100前往選購
主題活動
6/3前 全站滿$1,500折$120前往選購
主題活動
6/3前 全站滿$3,000折$300前往選購

讓響應式RWD網頁設計變簡單: Bootstrap開發速成 (附DVD)

期:
2016/07/03
9
420378

內容簡介

以3大實例一探業界極為流行的響應式網頁框架!

熱門的Bootstrap讓許多企業在徵求網頁設計師時都將之列為必備的技能條件,Bootstrap採用了模組化設計,簡易到只要懂得如何套用,就可以快速開發出具有美感的響應式(RWD)網頁。

對於許多不擅長視覺設計的網頁工程師來說,省去了許多美化的時間與困惱,而對於視覺設計師來說,也能依著自己設計的版型建置出網頁,同時支援市面上大部份的主流瀏覽器,而對於想踏入響應式網頁領域的初學者來說,則可以在短時間就學習到實務的響應式網頁設計技能。

書中從認識響應式網頁與Bootstrap開始,詳解網站開發流程、響應式網頁設計思維、SEO設定,以及網頁設計趨勢,導入視覺設計與網頁製作兩個不同領域的專業知識,並提供120多個Bootstrap功能範例網頁檔,說明如何使用Bootstrap框架所提供的各種CSS與組件等內容,最終再以3個完整實例製作出響應式網頁,以具備實務的設計技能。

書附超值DVD:
135分鐘網站實作專題影音教學/範例檔

產品目錄

PART 01 響應式網頁介紹
CHAPTER 01 響應式網頁介紹
了解何謂響應式網頁及彈性圖片與文字上等設計重點,使在網頁製作階段時可減少與避免素材需調整或重新設計等問題。
1.1 何謂響應式網頁
1.2 響應式網頁的優點
1.3 響應式網頁的缺點
1.4 響應式的概念(純手刻)
1.5 認識Viewport
1.6 流動網格Fluid Grid
1.7 媒體查詢(Media Queries)的基礎
1.8 流動圖片Fluid Image
1.9 字體

CHAPTER 02 何謂Bootstrap
在有了響應式網頁構成的觀念後,進行Bootstrap框架的認識,以理解Bootstrap框架對於響應式網頁製作上之便利性。
2.1 Bootstrap 簡介
2.2 Bootstrap 具有那些內容
2.3 下載Bootstrap
2.4 連結Bootstrap 框架
2.5 下載與連結jQuery 文件
2.6 快速體驗-套用CSS 樣式

PART 02 開發的注意事項

CHAPTER 03 網站的開發流程
了解在一個網頁專案中每個領域所需負責的內容,使理解自己的專長適合扮演專案中的何者角色,以發揮出自己最大的價值。
3.1 專案
3.2 企劃
3.3 設計
3.4 前端
3.5 後端
3.6 測試
3.7 上線

CHAPTER 04 響應式網頁的設計思維
理解傳統網頁設計與響應式網頁設計上之差異點與設計上須考量的要素。使設計出的版型與素材皆能符合各種載具之顯示外,也能讓程式人員順利製作。
4.1 與傳統網站開發的差異
4.2 響應式網頁的設計考量
4.3 行動載具的設計考量

CHAPTER 05 視覺設計師與前端工程師的專業認知
藉由理解不同領域的專業,可減少或避免在專案配合時的溝通問題,因而提升網頁在製作上的效率與品質。
5.1 網頁與印刷的差異
5.2 網頁向量格式SVG
5.3 版面設計時常用詞彙
5.4 網格的套用與製作
5.4.1. 網格輔助-PSD
5.4.2. 網格輔助-AI
5.4.3. 網格輔助-自行設定
5.5 讓視覺設計師懂切版

CHAPTER 06 SEO介紹與作法
了解搜尋引擎的搜尋模式,使在網頁製作階段可完成基本SEO內容設定,以在搜尋時更容易透過關鍵字找到網頁。
6.1 何謂SEO
6.2 改善網站標題與描述
6.3 改善網站架構
6.4 可最佳化的內容與作法
6.5 管理與行銷

CHAPTER 07 網頁設計趨勢
了解時下流行的網頁樣式,使在網頁提案階段能提出貼近客戶需求與具創新的網頁。
7.1 響應式網頁
7.2 全幅背景
7.3 單頁式網頁
7.4 固定式選單
7.5 扁平化設計
7.6 微動畫
7.7 磚牆式設計
7.8 隱藏式選單
7.9 超級大的字型
7.10 幽靈按鈕

CHAPTER 08 HTML5+CSS3的基本知識
了解如何利用DIV與CSS來組織網頁,讓設計師可清楚知道一個網頁版型中,哪些元素需要切割出圖檔,哪些則是可利用程式取代圖檔效果。
8.1 認識DIV與CSS
8.2 HTML5與CSS3之新增內容

PART 03 Bootstrap介紹與使用方法

CHAPTER 09 響應式網頁的佈局方式
了解Bootstrap所提供的Grid System與佈局規則,使程式設計師能快速的規劃出在不同載具上的網頁內容;而視覺設計師則可根據Grid System來進行各種版型設計。
9.1 Grid System(網格系統)介紹
9.2 佈局規則

CHAPTER 10 Bootstrap CSS樣式的使用
了解Bootstrap 提供的各種CSS樣式,並學習如何進行套用與推疊各種樣式,以呈現出最佳的效果。
10.1 排版
10.2 表格
10.3 表單
10.4 按鈕
10.5 圖片

CHAPTER 11 Bootstrap佈局組件的使用
除了CSS基本的美化樣式外,還可套用Bootstrap所提供的多款組件於網頁內容中,加以呈現出動態的視覺與功能等效果。
11.1 符號圖示
11.2 下拉式選單
11.3 按鈕群組
11.4 輸入框(input)群組
11.5 導航
11.6 導航列
11.7 分頁
11.8 提示標誌
11.9 大螢幕效果
11.10 縮圖
11.11 進度條
11.12 面板
11.13 響應式嵌入內容

CHAPTER 12 Bootstrap JS插件的使用
運用Bootstrap所提供的Javascript插件,為網頁添加更多的互動。
12.1 概觀
12.2 頁籤
12.3 提示訊息
12.4 彈出提示
12.5 摺疊效果
12.6 輪播效果

PART 04 網站製作
將之前所學到的觀念與Bootstrap功能加以整合運用,從無到有完成響應式網頁的製作。範例為,第13 章:書籍宣傳網頁、第14章:產品推廣網頁、第15章:網站首頁製作。

CHAPTER 13 網站實作-書籍宣傳網頁
13.1 套入連結
13.2 網格佈局
13.3 頁面設計
13.4 CSS美化與套用

CHAPTER 14 網站實作-產品推廣網頁
14.1 套入連結
14.2 網格佈局
14.3 頁面設計

CHAPTER 15 網站實作-網站首頁製作
15.1 套入連結
15.2 網格佈局
15.3 第一層設計-選單
15.4 第二層設計-廣告橫幅
15.5 第三層設計-最新公告與廣告區
15.6 第四層設計-課程分享
15.7 第五層設計-按鈕連結
15.8 第六層頁面設計-頁腳
15.9 回頂部按鈕製作
15.10 檢查各尺寸瀏覽狀態

PART 05 知識補給站

CHAPTER 16 輔助工具
了解如何利用各種瀏覽器來檢測響應式網頁;了解如何利用線上編輯器快速製作Bootstrap框架;以及字型尺寸上的定義等輔助方式,以解決在製作響應式網頁時有可能遇到的問題。
16.1 Bootstrap套版下載
16.2 視覺化Bootstrap線上編輯器
16.3 瀏覽器開發者模式檢測
16.4 尺寸對應工具
16.5 檢測優化工具
16.6 載具尺寸參考

作者介紹

■作者簡介

呂國泰

現職:
文藻外語大學 數位內容應用與管理學系/兼任講師

學歷:
亞洲大學數位媒體設計研究所/碩士
專長:
1.多媒體技術整合應用/開發
2.數位出版/內容設計暨系統建置
3.多媒體影音作品設計/影像非線性剪輯技術設計
4.網頁視覺設計/切版組版與多媒體內容網站設置(RWD)
5.大型設計案製作流程管理與執行
6.設計業務相關客戶溝通協調
7.廣告設計相關企劃管理作業
8.影視多媒體後製技術行銷企劃、週邊產品與活動規劃與專案管理作業

著作:
著有動畫製作、遊戲設計、電子書、多媒體、國際認證⋯等近16本圖書

曾偉凱
學歷:
樹德科技大學應用設計研究所/碩士

專長:
1.3D遊戲引擎(Unity3D)
2.3D行動手機遊戲製作(iPhone,iPad,Android,Android Pad)
3.程式語言撰寫(JavaScript、C#)
4.遊戲動畫與角色動作捕捉器(motion capture)
5.遊戲企劃書製作

競賽獲獎:
1.2011年大中華區3DVR遊戲開發盟主競賽/手機遊戲開發組「金獎」
2.2011年第八屆育秀盃 創意設計大賽/軟體應用類 Mobile組 「佳作」
3.2011年4C數位創作競賽/行動內容應用組「大會銀獎」
4.2011年4C數位創作競賽/行動內容應用組「奧爾贊助獎」
5.2010年4C數位創作競賽/PC遊戲提案組「銅獎」
6.2010年4C數位創作競賽/PC遊戲提案組「樂陞遊戲公司贊助獎」
7.2009年第六屆育秀盃創意設計大賽 網頁設計組 食品達人培訓網特別獎 「第一名」

參展紀錄:
1.2011高雄歷史博物館「青春風火輪-哪吒三太子的異想世界」展覽
2.2011台視App Star高手爭霸戰節目-錄影展出
3.2011高雄左營萬年季-萬年互動館展出
4.2011台北世界設計大展-國際設計學生創作展

何昇隆
現職:
銳比數位科技有限公司/技術總監

學歷:
崑山科技大學資訊管理研究所/碩士

專長:
1.行動應用技術整合與開發
2.行動應用SDK開發與維護
3.伺服器網頁程式語言
4.網路伺服器系統管理

規格

誠品貨碼 / 2681339420004
ISBN13 / 9789863479659
ISBN10 / 9863479659
EAN貨碼 / 9789863479659
頁數 / 336
注音版 / 否
裝訂 / P:平裝
語言 / 1:中文/繁體
尺寸 / 23X17CM
級別 / N:無

退貨說明

退貨須知:

  1. 依照消費者保護法的規定,您享有商品貨到次日起七天猶豫期(含例假日)的權益(請注意!猶豫期非試用期),辦理退貨之商品必須是全新狀態(不得有刮傷、破損、受潮)且需完整(包含全部商品、配件、原廠內外包裝、贈品及所有附隨文件或資料的完整性等)。
  2. 請您以送貨廠商使用之包裝紙箱將退貨商品包裝妥當,若原紙箱已遺失,請另使用其他紙箱包覆於商品原廠包裝之外,切勿直接於原廠包裝上黏貼紙張或書寫文字。若原廠包裝損毀將可能被認定為已逾越檢查商品之必要程度,本公司得依毀損程度扣除回復原狀必要費用(整新費)後退費;請您先確認商品正確、外觀可接受,再行拆封,以免影響您的權利;若為產品瑕疵,本公司接受退貨。

依「通訊交易解除權合理例外情事適用準則」,下列商品不適用七日猶豫期,除產品本身有瑕疵外,不接受退貨:

  1. 易於腐敗、保存期限較短或解約時即將逾期。(如:生鮮蔬果、乳製品、冷凍冷藏食材、蛋糕)
  2. 依消費者要求所為之客製化給付。(如:客製印章、鋼筆刻字)
  3. 報紙、期刊或雜誌。
  4. 經消費者拆封之影音商品或電腦軟體。
  5. 非以有形媒介提供之數位內容或一經提供即為完成之線上服務,經消費者事先同意始提供。(如:電子書)
  6. 已拆封之個人衛生用品。(如:內衣褲、襪類、褲襪、刮鬍刀、除毛刀等貼身用品)
  7. 國際航空客運服務。

若您退貨時有下列情形,可能被認定已逾越檢查商品之必要程度而須負擔為回復原狀必要費用(整新費),或影響您的退貨權利,請您在拆封前決定是否要退貨:

  1. 以數位或電磁紀錄形式儲存或著作權相關之商品(包含但不限於CD、VCD、DVD、電腦軟體等) 包裝已拆封者(除運送用之包裝以外)。
  2. 耗材(包含但不限於墨水匣、碳粉匣、紙張、筆類墨水、清潔劑補充包等)之商品包裝已拆封者(除運送用之包裝以外)。
  3. 衣飾鞋類/寢具/織品(包含但不限於衣褲、鞋子、襪子、泳裝、床單、被套、填充玩具)或之商品缺件(含購買商品、附件、內外包裝、贈品等)或經剪標或下水或商品有不可回復之髒污或磨損痕跡。
  4. 食品、美容/保養用品、內衣褲等消耗性或個人衛生用品、商品銷售頁面上特別載明之商品已拆封者(除運送用之包裝外一切包裝、包括但不限於瓶蓋、封口、封膜等接觸商品內容之包裝部分)或已非全新狀態(外觀有刮傷、破損、受潮等)與包裝不完整(缺少商品、附件、原廠外盒、保護袋、配件紙箱、保麗龍、隨貨文件、贈品等)。
  5. 家電、3C、畫作、電子閱讀器等商品,除商品本身有瑕疵外,退回之商品已拆封(除運送用之包裝外一切包裝、包括但不限於封膜等接觸商品內容之包裝部分、移除封條、拆除吊牌、拆除貼膠或標籤等情形)或已非全新狀態(外觀有刮傷、破損、受潮等)與包裝不完整(缺少商品、附件、原廠外盒、保護袋、配件紙箱、保麗龍、隨貨文件、贈品等)。
  6. 退貨程序請參閱【客服專區→常見問題→誠品線上退貨退款】之說明。
付款/配送