隨著信息技術向縱深發(fā)展，作為依托互聯(lián)網(wǎng)發(fā)展起來的網(wǎng)站制作面臨新的挑戰(zhàn)。一方面，用戶更加注重站點信息豐富、功能齊備、頁面精美、操作流暢；另一方面，要滿足用戶不受系統(tǒng)平臺和軟件插件的限制，可以通過移動設備訪問網(wǎng)站。Web新技術HTML5和CSS3能夠實現(xiàn)這些新要求，使其迅速成為網(wǎng)頁設計的熱點。 
　　網(wǎng)頁設計與制作課程是B/S架構軟件項目開發(fā)的Web前端技術課程，而HTML與CSS是網(wǎng)頁制作技術的核心和基礎，也是每個網(wǎng)頁制作者必須掌握的基本知識，兩者在網(wǎng)頁設計中不可或缺。 
　　網(wǎng)頁設計本身是一個復雜的系統(tǒng)過程，需要了解問題，對問題進行分析，用邏輯的方法確定最佳的優(yōu)化方案，最后通過相關技術來實現(xiàn)。初學者如何掌握網(wǎng)頁設計的方法尤為重要。本書以HTML5與CSS3技術為工具，以響應式布局Web頁面設計為載體，強調(diào)問題的分析、技術的掌握、能力的拓展，所有知識點都緊跟HTML5與CSS3的發(fā)展動態(tài)，以創(chuàng)新的模式、結構化的設計、實用的案例、簡明的語言詳細介紹了使用HTML5與CSS3進行網(wǎng)頁設計與制作的相關內(nèi)容和技巧。 
　　本書針對職業(yè)教育人才培養(yǎng)規(guī)格的需要，突出職業(yè)素質教育和技術應用能力，運用創(chuàng)新思維模式理實一體系統(tǒng)化教學方法。各項目首先確定學習目標，通過項目實施掌握相關的基本知識，然后通過拓展練習強調(diào)基本技能的訓練，最后輔以習題。本書每個項目都提供英語角，形成專業(yè)詞匯提示，幫助讀者對國際化專業(yè)術語的認識，提升學習效果。 
　　本書編寫有以下特色： 
　�。�1）全書結構廣度層面體現(xiàn)了職業(yè)教育特點，以應用為主，適度夠用為量，內(nèi)容以HTML5與CSS3技術的技能訓練為主線，突出能力的培養(yǎng)，內(nèi)容完整、由淺入深、循序漸進，層次清楚。 
　�。�2）各項目結構深度層面運用了思維導圖形式，提供一個以職業(yè)技能發(fā)展為主軸的結構化學習方案，直觀體現(xiàn)學習路徑，提升學習效率。 
　�。�3）內(nèi)容采用任務驅動、項目導入、教學做一體化模式編排而成，通過任務驅動將項目載體融入教學，高強度培養(yǎng)學生工程實踐能力，要求在教學過程中達到項目實踐實訓的目的，實現(xiàn)技術培養(yǎng)與行業(yè)企業(yè)人才需求接軌。 
　�。�4）項目設計實用性強，選取當今互聯(lián)網(wǎng)熱點網(wǎng)站設計作為素材，將8個仿真項目融入教材，提高了學習者的學習熱情；同時，添加了企業(yè)站點開發(fā)的管理規(guī)范元素，突出項目管理理念。 
　�。�5）突出“做中學、做中教、做中練”，與項目剖析相結合，在體系結構安排上，盡可能將HTML5+CSS3的重要特性與項目相結合。通過項目的分析、設計、總結，將所學的知識與技能點融會貫通，易于理解，能夠幫助讀者提升實際應用技能。 
　�。�6）注重“以能力培養(yǎng)為核心，強化實際操作的訓練”，每個項目都精心設計了拓展練習，目的明確，突出實用性、操作性。考慮到初學者經(jīng)常困惑于如何進行頁面程序的設計，拓展項目給出了相關的提示步驟，使學生在學習的過程中不至于“毫無頭緒”而產(chǎn)生厭煩，從而提高學習的興趣和對編程的愛好程度。 
　�。�7）配有針對性的習題，強調(diào)每個項目的學習重點，鞏固對知識的掌握。同時，每個項目的英語角提供了相應的專業(yè)詞匯，利于專業(yè)國際化標準的引入和職業(yè)素養(yǎng)的培養(yǎng)。 
　　（8）豐富的新形態(tài)教學資源。本書除配套提供電子教學課件、案例庫、習題庫之外，還提供了大量的關于網(wǎng)頁設計、HTML5和CSS3技術的數(shù)字資源庫，讀者可以通過掃描二維碼獲取相關資料，實現(xiàn)課程全方位的資源共享。 
　　本書由長期工作在職業(yè)教育教學一線，同時具有企業(yè)實踐開發(fā)經(jīng)驗的教師編寫而成。其中，項目1～項目4主要由王慶樺老師編寫，項目5～項目8和附錄主要由王新強老師編寫，王玥老師編寫了本書部分內(nèi)容。全書由王慶樺老師統(tǒng)稿。 
　　雖然編者力求準確無誤、盡善盡美，但由于時間倉促，書中的內(nèi)容仍難免出現(xiàn)錯誤或不足之處，懇請專家、教師和讀者批評指正。 
　　編 者