超越CSS:WEB設計藝術精髓

《超越CSS:WEB設計藝術精髓》是2008年人民郵電出版社出版的圖書,作者是克拉克。

內容簡介

《超越CSS:WEB設計藝術精髓》一書系統、深入地闡釋了網站的設計與實現,幫助讀者從設計的角度來使用CSS以達到完美的效果。作者通過使用標記和CSS的形象的創造性示例,幫助讀者掌握實現創意設計的方法。讀者將學會如何使用新的設計流程,創建對包括設計師在內的所有團隊成員都很好用的原型,有效地使用格線,設計標記的視覺效果,並了解優秀設計過程的每一個階段——從使用最新的瀏覽器到在團隊協作中高效地套用CSS3。

編輯推薦

著名設計師AndyClarke悉心傳授“超越CSS”方法,《CSS禪意花園》作者隆重推薦並擔任技術編輯。

對於普遍缺乏編程經驗的Web設計師來說,語義標記和CSS無疑是實現自由設計的障礙。如果沒有高效工作流的支持,快節奏的工作環境和較高的客戶要求都將意味著巨大的壓力和挑戰。

國際著名Web設計師AndyClarke對這種情況有著切身的體會。在本書中,Andy將與您分享他的“超越CSS”方法,引導讀者從設計的角度來使用CSS,來創建富有藝術性並且可用、易用的站點。

在這本開創性的著作中,作者通過可視化的範例來展示標記和CSS的創造性,帶領您掌握實現創意的設計方法。您將學會:

·如何使用新的工作流來創建對所有團隊成員——包括設計師在內——都非常好用的原型;

·有效地使用格線;

·設計標記的視覺效果:

·如何把握優秀設計過程的每一個階段——從使用最新的瀏覽器到在團隊協作中高效地運用CSS3,等等。

Web設計和CSS領域著名專家,AndyClarke權威著作:

·使用可視化方式幫助您學習編碼技術;

·包含大量世界級網站實例、攝影作品和其他靈感素材,傳授視覺化代碼的思想;

·帶領您體驗新的Web瀏覽器中組成CSS3規範的先進技術。

“AndyClarke擁有一種神秘的能力。能讓你重新思考你所熟知的事物,並奇怪為什麼以前一直沒有按他的方式做。”

“讀過《CSS禪意花園》,然後呢?Clarke先生給我們帶來了答案!”

——DaveShea,《CSS禪意花園》作者

該書適合Web設計師和開發人員研讀,對那些客戶要求高、工作節奏快的設計師有著尤其重要的指導作用。該書也適合有一定基礎的Web設計愛好者閱讀。

作者簡介

AndyClarke,近十年來一直從事Web工作。他是英國的一個Web平面設計師。從1998年開始,從事設計顧問工作,提供設計的素材和創意。

作為首席設計師和創意總監,他涉及的工作領域包括本地與全國性企業、慈善團體與政府機構。此外,他還為英國心臟基金會,英國迪斯尼商店,英國拯救兒童組織和世界野生動物基金會做過設計。

他也是Web標準項目的成員之一,正是他在2006年重構了這個組織的網站。作為Web設計師和開發人員的代表,他是W3C的CSS工作組特邀專家。

Andy定期培訓Web設計人員的動手能力,Web標準的創意套用,以及如何創建美觀、易用的網站。他曾在各種工作室和全球性的會議上發表演說。

走出工作室,Andy用他收藏的mod與ska音樂放肆騷擾他的鄰居以及周圍的人,並夢想著與PaulWeller一起品茶。

圖書目錄

1.發現

1.1 超越CSS簡介

1.1.1 需要什麼樣的工具來開始學習

1.1.2 為什麼需要超越CSS

1.1.3 盡情地發揮創造力

1.1.4 輔助功能本身就是設計,而不應僅把它當成一個特性

1.1.5 向超越CSS進發

1.2 超越CSS原則

1.2.1 不是所有的瀏覽器都顯示相同的設計

1.2.2 運用所有有效的CSS選擇符

1.2.3 CSS3:展望未來

1.2.4 運用JavaScript和DOM來彌補CSS的不足

1.2.5 避免運用Hacks和濾鏡

1.2.6 使用富含語義的命名規範和微型格式

1.2.7 分享你的想法,與他人協作

1.3 什麼使超越CSS變得可能

1.3.1 意想不到的CSS用途

1.3.2 瀏覽器分級支持

1.3.3 發現,過程,靈感,超越

1.4 突出內容的設計

1.4.1 突出內容的途徑

1.4.2 一個典型的沒經過最佳化的CSS布局

1.4.3 最佳化內容順序而不管有還是沒有樣式

1.5 語義就是含義

1.5.1 “CSS裸體日”

1.5.2 將含義翻譯成標記:這個標記是正確的

1.5.3 內容告訴你了什麼

1.5.4 語義的前行

1.6 標記這個世界

1.6.1 整個世界是一個列表;每一項都扮演著它自己的角色

1.6.2 環視四座皆列表

1.6.3 給我寄一張舊金山的hCard

1.6.4 學會拓寬視野

1.6.5 從“內容”開始工作

1.7 是時候整理一下你所學的知識了

2.過程

2.1 尋找最佳工作流程

2.1.1 尋找更好的方式

2.1.2 遵循基於內容的過程

2.2 蒐集內容

2.3 使用框架圖來工作

2.3.1 傳統的框架圖在哪裡會失效

2.3.2 框架圖有商業價值嗎

2.3.3 傳統框架圖以及互動腳本

2.4 使用灰盒方法改進

2.5 創建靜態設計

2.5.1 更快地通過設計流程

2.5.2 把標籤指南加入靜態設計

2.6 使用互動原型

2.6.1 互動原型使夢想成真

2.6.2 創建可重用的代碼

2.6.3 框架圖和原型的模型

2.6.4 所見即所得:你看到了什麼

2.7 遵循互動原型最佳實踐

2.7.1 選擇用於開發的瀏覽器

2.7.2 使用瀏覽器外掛程式

2.7.3 儘可能少地使用div元素

2.7.4 確保標籤是有效的

2.7.5 選擇定位優先於浮動

2.7.6 組織CSS

2.8 過程的實踐

2.8.1 著眼於組成部分

2.8.2 編寫分離內容的標籤

2.8.3 用CSS實現靜態設計

2.8.4 構建布局

2.8.5 從body開始

2.8.6 繼續向前還是移交

2.8.7 基本顏色樣式

2.8.8 創建商標

2.8.9 加上Logo

2.8.10 導航條樣式

2.8.11 設計頁腳樣式

2.8.12 理解元素的排版樣式

2.9 匯總

3.靈感

3.1 引入基於格線的設計

3.1.1 設計師與格線

3.1.2 黃金比例和三分之一規則

3.1.3 純粹的彈性布局

3.1.4 合理的格線設計

3.2 當今Web設計中的格線

3.2.1 減法

3.2.2 AirbagIndustries

3.2.3 JeffCroft

3.2.4 Veerle的部落格

3.3 尋找Web之外的格線

3.4 為Web設計帶來新的格線

3.4.1 打破新聞

3.4.2 以格線作為指導

3.4.3 揭穿小秘密

3.4.4 著迷於新聞手法

3.4.5 保持你的畫面

3.5 在意想不到的地方發現靈感

3.5.1 把主頁改頭換面

3.5.2 引入基調板

3.5.3 擁有一個設計剪貼簿

3.5.4 要獲得界面靈感去看雜誌吧

3.5.5 獲得版式靈感

3.5.6 重新審視Flash設計

3.5.7 使用圖片與相片

3.6 精美的藝術活動

3.6.1 設計不僅僅是創建引人注目的視覺效果

3.6.2 不要把焦點放在技術上

3.6.3 提升基調

3.6.4 尋找不同觀點

3.6.5 帶著目標剪貼

3.7 Web設計的美術

4.卓越

4.1 卓越的CSS

4.1.1 絕對定位

4.1.2 相對定位

4.1.3 浮動的創意

4.1.4 創建側邊欄

4.1.5 結合多種技術

4.2 CSS3(三倍好運)

4.2.1 各部分的匯總

4.2.2 開發新的標準

4.2.3 回到未來

4.2.4 使用CSS3選擇符模組進行設計

4.2.5 使用斑馬紋提高可讀性

4.2.6 使用背景和框線模組進行設計

4.2.7 使用多幅背景圖片進行設計

4.2.8 設計多欄布局

4.2.9 使用多欄布局模組

4.3 高級布局

4.3.1 回到格線(Grid)

4.3.2 使用高級布局模組進行設計

4.4 結束語

相關詞條

相關搜尋

熱門詞條

聯絡我們