網(wǎng)站重構(gòu)

前言

　　譯者序　　一本好書，不僅僅帶來知識(shí)，更重要的是傳達(dá)一種理念、一種思想，引起我們更多的思考?！毒W(wǎng)站重構(gòu)》無疑就是這樣一本好書。它的出版猶如一聲春雷打破了網(wǎng)頁(yè)設(shè)計(jì)行業(yè)的沉寂，傳統(tǒng)技術(shù)方式受到挑戰(zhàn)并逐步被淘汰，Web標(biāo)準(zhǔn)技術(shù)成為行業(yè)新的標(biāo)準(zhǔn)和開發(fā)指南?！　∪绻f六年前，本書第1版出版時(shí)，我們還需要大聲呼喊，我們要重視和推廣Web標(biāo)準(zhǔn)理念。那么六年后，當(dāng)本書即將出版第3版的時(shí)候，Web標(biāo)準(zhǔn)已經(jīng)成為網(wǎng)頁(yè)設(shè)計(jì)行業(yè)的共識(shí)，成為Web開發(fā)通用的技術(shù)標(biāo)準(zhǔn)，成為網(wǎng)頁(yè)設(shè)計(jì)師入門的基礎(chǔ)知識(shí)?！　￡P(guān)于作者　　作者Jeffrey Zeldman 是老牌的網(wǎng)頁(yè)設(shè)計(jì)師，也是Web標(biāo)準(zhǔn)技術(shù)的捍衛(wèi)者和“傳教士”。他在1998年創(chuàng)立的Web標(biāo)準(zhǔn)組織（www.webstandards.org）曾經(jīng)幫助Netscape公司和微軟公司結(jié)束了瀏覽器私有技術(shù)之戰(zhàn)；他的工作小組長(zhǎng)期幫助和推進(jìn)瀏覽器（例如IE5、IE7等版本）對(duì)Web標(biāo)準(zhǔn)的支持。本書自2004年第1版出版以來已經(jīng)被翻譯為 15種語(yǔ)言，成為成千上萬(wàn)網(wǎng)頁(yè)設(shè)計(jì)師學(xué)習(xí)網(wǎng)頁(yè)技術(shù)的重要指南書籍。由于Jeffrey Zeldman對(duì)Web標(biāo)準(zhǔn)技術(shù)的長(zhǎng)期推廣和堅(jiān)持，被《商業(yè)周刊》譽(yù)為“Web標(biāo)準(zhǔn)國(guó)王”?！　∵@是一本什么樣的書　　這是一本介紹Web標(biāo)準(zhǔn)的書籍。它是具有“里程碑”意義的書，已經(jīng)在Web發(fā)展過程中開創(chuàng)一個(gè)嶄新的時(shí)代！　　它的“里程碑”意義對(duì)于中國(guó)的網(wǎng)站項(xiàng)目開發(fā)者和網(wǎng)頁(yè)設(shè)計(jì)師來說尤為深刻。在本書出版之前，中國(guó)幾乎所有的網(wǎng)頁(yè)開發(fā)都采用表格布局法，《網(wǎng)站重構(gòu)》出版后，以“CSS布局”為典型代表的Web標(biāo)準(zhǔn)技術(shù)逐步為大家接受，直到今天被廣泛采用。Web標(biāo)準(zhǔn)技術(shù)不僅僅是一種技術(shù)的進(jìn)步和更替，更重要的是它的這種思想和理念，深深影響了這一代網(wǎng)頁(yè)設(shè)計(jì)師。讓我們開始學(xué)會(huì)思考，在“漂亮”的頁(yè)面背后，我們長(zhǎng)期忽略并應(yīng)該關(guān)注的東西，包括：網(wǎng)站的成本、易用性、可維護(hù)性、SEO以及可訪問性?！　”緯牡?部分介紹了Web標(biāo)準(zhǔn)”思想的產(chǎn)生、發(fā)展和推廣，讓我們了解采用Web標(biāo)準(zhǔn)的好處；書的第2部分結(jié)合實(shí)例，從技術(shù)細(xì)節(jié)上講解了如何采用Web標(biāo)準(zhǔn)技術(shù)進(jìn)行網(wǎng)頁(yè)開發(fā)。通過閱讀本書，你可以了解：　　.什么是Web標(biāo)準(zhǔn)？　　.Web標(biāo)準(zhǔn)有什么好處？　　.如何采用Web標(biāo)準(zhǔn)技術(shù)進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)和開發(fā)？　　適合什么樣的人看　　這本書適合的讀者是：所有的網(wǎng)站設(shè)計(jì)師、開發(fā)者和網(wǎng)站管理者?！　〔徽撃闶沁@一行業(yè)的新手還是資深人士，閱讀本書都將讓你獲益匪淺。管理者可以了解如何降低網(wǎng)站成本，如何獲得更多用戶；設(shè)計(jì)師可以領(lǐng)悟到“表現(xiàn)和結(jié)構(gòu)相分離”的真諦，用CSS自由地控制布局；開發(fā)者可以掌握如何降低維護(hù)成本，如何重用內(nèi)容，如何延長(zhǎng)網(wǎng)站的壽命?！　?duì)于已經(jīng)了解和熟悉Web標(biāo)準(zhǔn)的開發(fā)者來說，本書第3版增加了更多實(shí)用的內(nèi)容：　　.Web標(biāo)準(zhǔn)技術(shù)的最新發(fā)展動(dòng)態(tài)和方向；　　最新技術(shù)的介紹（包括HTML5、CSS3和網(wǎng)頁(yè)字體），以及這些技術(shù)將對(duì)網(wǎng)站產(chǎn)生怎樣的影響；　　更多的實(shí)例應(yīng)用和技術(shù)解決方案?！　∽g者感言　　從本書第1版出版到現(xiàn)在已經(jīng)六年了，從Web標(biāo)準(zhǔn)“零”概念到目前行業(yè)內(nèi)的普遍運(yùn)用，不得不說是一個(gè)令人驚喜的變化。中國(guó)的網(wǎng)頁(yè)設(shè)計(jì)師、開發(fā)者、管理者跟上了這一輪的技術(shù)變革。Web標(biāo)準(zhǔn)在快速發(fā)展，雖然Web標(biāo)準(zhǔn)的思想核心依然是網(wǎng)站可用性，但隨著更新的設(shè)備出現(xiàn)和技術(shù)的發(fā)展，許多老的Web標(biāo)準(zhǔn)開始淘汰，許多新的規(guī)范開始醞釀和發(fā)展，例如HTML5、CSS3等。學(xué)無止境，我們的設(shè)計(jì)師和開發(fā)者依然須要迎頭趕上?！　×硪环矫?，隨著中國(guó)互聯(lián)網(wǎng)應(yīng)用的普及和發(fā)展，中國(guó)網(wǎng)絡(luò)開發(fā)者的地位和聲音也逐步得到重視，萬(wàn)維網(wǎng)聯(lián)盟W3C于2006年成立了中國(guó)辦事處（www.chinaw3c.org），以便促進(jìn)中國(guó)企業(yè)和開發(fā)者參與標(biāo)準(zhǔn)技術(shù)的研究和制定。但這方面我們還有比較大的差距，不論是標(biāo)準(zhǔn)制定的參與還是技術(shù)研究都還處于初級(jí)階段。國(guó)際大型互聯(lián)網(wǎng)公司，包括微軟、蘋果、谷歌、Mozilla等都極力參與到標(biāo)準(zhǔn)的制定和推廣中，值得國(guó)內(nèi)的互聯(lián)網(wǎng)公司重視和借鑒?！　「兄x　　非常感謝電子工業(yè)出版社給我們翻譯本書的機(jī)會(huì)，讓我們得以見證和參與Web標(biāo)準(zhǔn)設(shè)計(jì)在中國(guó)的普及和推廣過程。這一過程使我們自己獲益匪淺。感謝博文視點(diǎn)公司總經(jīng)理郭立、策劃編輯孫學(xué)瑛的信任和鼓勵(lì)，使得我們信心百倍地來翻譯這本書，也感謝編輯許艷、顧慧芳，她們細(xì)心的工作幫我們彌補(bǔ)了很多細(xì)節(jié)上的漏洞。感謝許許多多給本書提出建議和意見的設(shè)計(jì)師朋友和網(wǎng)友?！　∽g者　　2010年6月于北京　　第3版前言　　當(dāng)我和同事們?cè)?998年創(chuàng)建The Web Standards Project（網(wǎng)頁(yè)標(biāo)準(zhǔn)計(jì)劃小組，WaSP）的時(shí)候，我們并不知道有效的（valid）、語(yǔ)義化的標(biāo)記（semantic markup）會(huì)讓你的網(wǎng)站內(nèi)容更容易被Google發(fā)現(xiàn)。是的，它確實(shí)有這個(gè)效果，但在Google出現(xiàn)之前，那并不是我們關(guān)注Web標(biāo)準(zhǔn)的原因。20世紀(jì)90年代，一個(gè)網(wǎng)頁(yè)設(shè)計(jì)高手的定義是：能夠用5套代碼方案為他的客戶設(shè)計(jì)網(wǎng)站，讓它在以下瀏覽器中都能正確顯示：Netscape 3、Netscape 4、IE3、IE4以及其他非主流瀏覽器?！　∪绻€希望你的網(wǎng)站能在Netscape和微軟的IE3、IE4瀏覽器里實(shí)現(xiàn)一些其他功能，那么你將不得不在同一個(gè)頁(yè)面里使用兩種不兼容的腳本語(yǔ)言，每種語(yǔ)言又有兩個(gè)版本，總計(jì)四種不兼容的腳本語(yǔ)言。這些代碼又混雜在使用復(fù)雜的表格布局（table layouts）的HTML代碼里，結(jié)果就是：頁(yè)面上至少多了60%不必要的代碼。當(dāng)網(wǎng)站改版，重新設(shè)計(jì)，或者需要調(diào)整你的網(wǎng)站內(nèi)容時(shí)，你會(huì)發(fā)現(xiàn)除了更高的成本之外，修改也非常困難，因?yàn)閮?nèi)容和布局完全混雜在一起?！　?duì)于我們這些WaSP發(fā)起人來說，所有瀏覽器的私有代碼都會(huì)嚴(yán)重威脅到Web發(fā)展。它導(dǎo)致每個(gè)網(wǎng)站至少浪費(fèi)25%的開發(fā)時(shí)間，從而成本提高至少25%。而且，如果在1998年設(shè)計(jì)一個(gè)簡(jiǎn)單網(wǎng)站就需要寫5套代碼，那么未來的網(wǎng)頁(yè)設(shè)計(jì)會(huì)變成什么樣子？如果瀏覽器廠商為了競(jìng)爭(zhēng)，故意推出不兼容的私有代碼，那么我們這場(chǎng)自從印刷術(shù)發(fā)明以來最激動(dòng)人心的出版和通信技術(shù)進(jìn)步會(huì)不會(huì)倒退？10年以后，我們是不是制作一個(gè)簡(jiǎn)單網(wǎng)站，就需要花費(fèi)12倍的成本，寫12套代碼才能實(shí)現(xiàn)？　　Web標(biāo)準(zhǔn)——語(yǔ)義（X）HTML標(biāo)記、CSS布局、基于JavaScript的不沖突腳本編程和DOM，是以上所有問題的解決方案。而且，一直以來，WaSP和其他組織對(duì)標(biāo)準(zhǔn)的倡導(dǎo)，最終說服了那些瀏覽器廠商支持標(biāo)準(zhǔn)，以及更多的專業(yè)人士來使用標(biāo)準(zhǔn)?！　∈褂肳eb標(biāo)準(zhǔn)進(jìn)行設(shè)計(jì)的好處，將在本書第1部分詳細(xì)解釋，它們包括如下。　　恰當(dāng)?shù)恼Z(yǔ)義化標(biāo)記將使你的網(wǎng)站內(nèi)容更容易被用戶和搜索引擎找到。只要將代碼從無語(yǔ)義的表格布局轉(zhuǎn)換成結(jié)構(gòu)良好的語(yǔ)義標(biāo)記，網(wǎng)站就可以提高在　　搜索引擎結(jié)果列表中的位置，提升它們的Alexa排名，并提高其他可發(fā)現(xiàn)性（Findability）的指標(biāo)。（可發(fā)現(xiàn)性，是標(biāo)準(zhǔn)化的重要指標(biāo)，以衡量搜索引擎優(yōu)化（SEO）帶來的好處。）　　將網(wǎng)站的表現(xiàn)從結(jié)構(gòu)和行為中剝離出來，使你的開發(fā)和測(cè)試更加容易，也更加便利，可以降低你的總預(yù)算，或者讓你在網(wǎng)站可用性和內(nèi)容開發(fā)方面的現(xiàn)金投入更寬裕?！　⒕W(wǎng)站的表現(xiàn)從結(jié)構(gòu)和行為中剝離出來，使你的網(wǎng)站更輕量級(jí)，從而提高性能?！　⒕W(wǎng)站的表現(xiàn)從結(jié)構(gòu)和行為中剝離出來，使用適當(dāng)?shù)挠姓Z(yǔ)義的標(biāo)記，使你的網(wǎng)站更容易被各種瀏覽器和不同設(shè)備訪問，包括移動(dòng)設(shè)備和給殘疾人士使用的瀏覽工具，例如屏幕閱讀器和其他輸入替代設(shè)備。使用Web標(biāo)準(zhǔn)設(shè)計(jì)網(wǎng)站同樣有利于提供手機(jī)版本，如果你希望推出網(wǎng)站的手機(jī)版本，采用標(biāo)準(zhǔn)會(huì)使它變得更容易。而且在某些情況下可能根本就不需要推出手機(jī)版本，當(dāng)然這也取決于你的網(wǎng)站內(nèi)容?！　∈褂肳eb標(biāo)準(zhǔn)而不是瀏覽器私有的代碼設(shè)計(jì)網(wǎng)站，更加適應(yīng)未來的發(fā)展。如果你的網(wǎng)站正確采用HTML 4.01或者XHTML 1.0，并用CSS2布局，將得到各種瀏覽器的永久支持，即使HTML5、CSS3或者其他新的規(guī)范最終確定下來，甚至它們得到將來新的瀏覽器的出色支持，你采用現(xiàn)在的Web標(biāo)準(zhǔn)制作的網(wǎng)站仍將完美工作。而非標(biāo)準(zhǔn)的網(wǎng)站則沒這么幸運(yùn)，在好一點(diǎn)的情況下，它們會(huì)出現(xiàn)混亂，不好的話，網(wǎng)站將停止工作。　　本書前兩個(gè)版本已經(jīng)翻譯成15種語(yǔ)言，從保加利亞到韓國(guó)，基于標(biāo)準(zhǔn)的設(shè)計(jì)概念和方法已經(jīng)被廣泛地介紹給世界上成千上萬(wàn)的設(shè)計(jì)師和開發(fā)者，以及他們的客戶。自從本書2003年開始銷售以來，幾乎所有承包商或自行開發(fā)的公司都已經(jīng)有了至少一位Web標(biāo)準(zhǔn)的擁護(hù)者。這個(gè)行業(yè)在不斷發(fā)展，不再只是那些領(lǐng)先的設(shè)計(jì)師們擁抱Web標(biāo)準(zhǔn)了，也不再只有那些前衛(wèi)的承包商宣稱自己在基于標(biāo)準(zhǔn)的設(shè)計(jì)方面很專業(yè)了?！　《?dāng)本書的第3版面世的時(shí)候，Web標(biāo)準(zhǔn)已經(jīng)成為了設(shè)計(jì)主流，設(shè)計(jì)師和開發(fā)者開始爭(zhēng)論CSS3，甚至不少人已經(jīng)開始嘗試微格式（microformats）和HTML5；符合Web標(biāo)準(zhǔn)現(xiàn)已成為包括蘋果、Google、Opera、Adobe、微軟等公司以及開源社區(qū)的軟件必備項(xiàng)目?！　∵@個(gè)版本經(jīng)過了大幅度修訂和重寫，并重新組成了以下兩個(gè)部分?！　牡?部分解釋了傳統(tǒng)的設(shè)計(jì)方法帶來的問題以及Web標(biāo)準(zhǔn)如何解決這些問題。同時(shí)也提供了充足的論據(jù)給那些需要“推銷”基于標(biāo)準(zhǔn)設(shè)計(jì)方案給那些仍然對(duì)標(biāo)準(zhǔn)持懷疑態(tài)度的客戶、同事和老板的人。我們繼續(xù)探查不斷擴(kuò)展的Web標(biāo)準(zhǔn)體系，展示新老標(biāo)準(zhǔn)是如何將整個(gè)網(wǎng)絡(luò)變成一個(gè)動(dòng)態(tài)的、有著眾多的應(yīng)用和高可訪問性、可發(fā)現(xiàn)性（以及漂亮的外觀）的內(nèi)容平臺(tái)。在第一部分的結(jié)尾我們展望一下Web的未來?！　牡?部分為讀者介紹了XHTML、HTML5和CSS，以及（更重要的）結(jié)構(gòu)化，語(yǔ)義化的標(biāo)記原則；簡(jiǎn)潔的、健壯的、優(yōu)化的CSS布局，以及不沖突的腳本編程（unobtrusive scripting）。之后是側(cè)邊欄在布局和易用性上的重要性。在第2部分結(jié)尾，我們將深入一些網(wǎng)站設(shè)計(jì)項(xiàng)目去揭示它們關(guān)于標(biāo)準(zhǔn)的秘密?！　∥液芨屑の业男潞现髡逧than Marcotte、我們的編輯Erin Kissane，以及技術(shù)編輯Aaron Gustafson，沒有比這更好的團(tuán)隊(duì)了。如果這是一本好書，那么就感謝這些伙計(jì)吧?！　〉谝淮谓佑|Web標(biāo)準(zhǔn)的新朋友，歡迎你們！還有那些早已經(jīng)和我們共度旅程的老朋友，歡迎你們回來！

內(nèi)容概要

　　暢銷書作家、設(shè)計(jì)師、網(wǎng)頁(yè)標(biāo)準(zhǔn)教父jeffrey
zeldman再次更新了他經(jīng)典的、顛覆行業(yè)的指南書。這已經(jīng)是本書的第3版了，此次更新基本涵蓋了隨著環(huán)境和技術(shù)的變化，web標(biāo)準(zhǔn)所面臨的挑戰(zhàn)以及因此而發(fā)生的改善。第3版讓基于標(biāo)準(zhǔn)的設(shè)計(jì)思想更加清晰，更加易于理解，幫助你在這個(gè)領(lǐng)域中保持聰明和領(lǐng)先。
　　一如既往，本書提供了更多明確的見解和新的例子，來闡述基于標(biāo)準(zhǔn)的設(shè)計(jì)的核心思想，為你的網(wǎng)站最終確定一個(gè)合理的設(shè)計(jì)與開發(fā)方法。
　　與前兩版不同的是，在第3版，除了有很多的“why?來提出問題，也提供了大量的“how”來解決問題。另外，在寫作方法上作者力圖用詼諧的、有吸引力的寫作風(fēng)格，使復(fù)雜的技術(shù)更易于理解消化，幫助你輕松創(chuàng)建一個(gè)訪問快速、低成本維護(hù)和開發(fā)、更多用戶的網(wǎng)站，幫助你用新技術(shù)使css布局適應(yīng)多個(gè)瀏覽器，使網(wǎng)站內(nèi)容更容易被搜索和訪問到。

作者簡(jiǎn)介

Jeffrey Zeldman被商業(yè)周刊譽(yù)為“Web標(biāo)準(zhǔn)之王”的Jeffrey Zeldman是最早的網(wǎng)頁(yè)設(shè)計(jì)師、blog作者、網(wǎng)絡(luò)獨(dú)立作家和最早的網(wǎng)頁(yè)設(shè)計(jì)教師之一。
在1998年，他和其他成員共同發(fā)起并創(chuàng)建了Web標(biāo)準(zhǔn)草根聯(lián)盟網(wǎng)頁(yè)標(biāo)準(zhǔn)計(jì)劃小組“The Web Standards Project”（從1999年到2002年一直主持該組織的工作），致力于推動(dòng)瀏覽器遵循Web標(biāo)準(zhǔn)，發(fā)起7Web標(biāo)準(zhǔn)運(yùn)動(dòng)。
Jeffrey已經(jīng)出版了兩本書，除本書外，另一本是“Taking Your Talent to the Web”，這是一本為想轉(zhuǎn)型成為網(wǎng)頁(yè)設(shè)計(jì)師和美術(shù)指導(dǎo)（Art Director）的人而寫的指南書（New Riders出版社，2001年，現(xiàn)在可以免費(fèi)在這個(gè)網(wǎng)址下載）。他同時(shí)還擔(dān)任SXSW互動(dòng)藝術(shù)節(jié)和Rosenfeld Media（出版公司）的咨詢顧問，也是Deck公司的創(chuàng)始人，Deck是一家提供創(chuàng)意、網(wǎng)頁(yè)和專業(yè)設(shè)計(jì)的網(wǎng)
Ethan Marcotte是一個(gè)多才多藝的用戶體驗(yàn)設(shè)計(jì)師和開發(fā)者，他的工作展示了高質(zhì)量代碼和美觀界面的完美結(jié)合。在加入Happy Cog之前，Ethan Marcotte為紐約雜志（New York Magazine）、哈佛大學(xué)以及世界互聯(lián)網(wǎng)組織W3C等客戶服務(wù)。
Ethan也是多個(gè)出版社的供稿作者，包括手寫CSS專題（New Riders 2009）、Web標(biāo)準(zhǔn)創(chuàng)造專題（friends of ED，2007），以及專業(yè)CSS專題（Wrox，2005）。Ethan還是一個(gè)有豐富經(jīng)驗(yàn)的技術(shù)編輯，參與編輯的書包括“Bulletproof Web Desert”（New Riders,2005），以及“Designing With Web Standards”第2版（New Riders，2006）。

書籍目錄

第1部分
　第0章 在開始閱讀之前
　第1章 99.9%的網(wǎng)站已經(jīng)過時(shí)了
　第2章 根據(jù)標(biāo)準(zhǔn)設(shè)計(jì)和建造
　第3章 溫和勸導(dǎo)
　第4章 web標(biāo)準(zhǔn)的未來
第2部分
　第5章 現(xiàn)代標(biāo)?語(yǔ)言
　第6章 xhtml和語(yǔ)義標(biāo)記
　第7章 html5：新的希望
　第8章 更嚴(yán)格穩(wěn)健的頁(yè)面保證：結(jié)構(gòu)和語(yǔ)義
　第9章 css入門
　第10章 css布局：標(biāo)記、盒模型和浮動(dòng)
　第11章 深入瀏覽器之一：doctype 切換和標(biāo)準(zhǔn)模式
　第12章 深入瀏覽器之二：bug、變通辦法和css3帶來的一線希望
　第13章 深入瀏覽器之三：文字版式
　第14章 可訪問性：web標(biāo)準(zhǔn)的靈魂
　第15章 使用基于dom的腳本語(yǔ)言
　第16章 一個(gè)網(wǎng)站重構(gòu)的實(shí)例
　第17章 nymag.com：簡(jiǎn)單的標(biāo)準(zhǔn)，迷人的界面

圖書封面

圖書標(biāo)簽Tags

無

評(píng)論、評(píng)分、閱讀與下載

---

    網(wǎng)站重構(gòu) PDF格式下載

---