相對于那些為單一媒介(諸如印刷)創(chuàng )建的文檔而言，我們?yōu)榫W(wǎng)頁(yè)制作的文檔擁有更為復雜的用途及功能。在某一環(huán)境中發(fā)揮良好作用的文檔，可能在另一個(gè)環(huán)境中就變得不可用了。例如，為大的顯示屏設計的網(wǎng)頁(yè)在打印時(shí)或者在小屏手機上顯示時(shí)的效果可能不會(huì )太好。在考慮頁(yè)面設計的時(shí)候，要將視野拓寬至代表性的顯示屏之外，并為包括打印和手機在內的其他環(huán)境預先提出相應的設計。


 
適應性設計
 
操作適當的話(huà)，網(wǎng)頁(yè)則可以適用于不同的環(huán)境而無(wú)需同一文檔的多個(gè)版本。使用了適應性設計的網(wǎng)頁(yè)文檔可以順利地應用于電影院或手機屏幕、電視或投影儀屏幕、油墨打印或盲文印刷，也可以被閱讀或使用軟件應用程序進(jìn)行瀏覽。從設計師的角度而言，需要關(guān)注兩大要素以便讓這一多用途系統更有效地發(fā)揮它的功能，即，源文檔和媒體樣式表。有了適應性設計，源文檔便包含了所有必要的信息和功能；媒體樣式表可以對源文檔進(jìn)行更改以適應于不同的環(huán)境。
 
樣式定義
 
可以通過(guò)很多種方式對樣式進(jìn)行定義:在元素標簽、頁(yè)面的頭元素或者在外部樣式表中使用樣式屬性。一般而言，外部樣式表是最有效的方法，例如，使用該方法可以通過(guò)在某一位置定義主體背景顏色屬性，來(lái)輕易地修改整個(gè)網(wǎng)站的主體背景顏色。使用適應性設計，我們可以為每個(gè)環(huán)境創(chuàng )建不同的外部樣式表，并隨后使用<link>標簽的“媒體”(media)屬性引用該樣式表。盡管在HTML規范中有很多媒體屬性，但此處我們集中關(guān)注使用最廣和最受支持的媒體類(lèi)型:顯示屏、打印以及手持設備。
 
在實(shí)際操作中，我們總是在既定事實(shí)之后才會(huì )考慮到媒體樣式。我們往往先為傳統的計算機顯示屏進(jìn)行設計，然后再為打印和手機的使用進(jìn)行修改。使用這一方式所產(chǎn)生的設計效果不是那么理想，因為我們往往沒(méi)有考慮到其他媒體以及查看設備。為了充分開(kāi)發(fā)網(wǎng)絡(luò )環(huán)境，我們需要從一開(kāi)始就考慮得更全面，并創(chuàng )建出適用于多種環(huán)境的源文檔。
 
文檔順序
 
文檔順序是指諸如網(wǎng)站形象、導航、主要內容、相關(guān)內容以及出處信息等元素在文檔源代碼中顯示的順序。文檔順序盡管在視覺(jué)環(huán)境中不明顯，但其對網(wǎng)頁(yè)的機讀性具有重大意義。很多搜索引擎賦予了文檔頂部?jì)热莞嗟臋嘀?。顯示屏閱讀者們在閱讀網(wǎng)頁(yè)的時(shí)候會(huì )從網(wǎng)頁(yè)的起始處開(kāi)始，然后按順序進(jìn)行瀏覽。很多網(wǎng)頁(yè)瀏覽器在小顯示屏上會(huì )將多欄布局折疊為一欄，以方便瀏覽。打印樣式往往使用單欄樣式來(lái)適應網(wǎng)頁(yè)的縱橫比。這些環(huán)境的效果極大地取決于文檔順序。
 
順序是文檔順序的一個(gè)重要方面。如果內容元素無(wú)法按一個(gè)邏輯順序進(jìn)行排列，那么信息就會(huì )被歪曲。例如，當相關(guān)鏈接和廣告與頁(yè)面主要內容混在一起的時(shí)候，各元素必須按照-定的邏輯順序在文檔源代碼中排列，并且各個(gè)元素之間必須充分連接，而不能被其他元素打斷。
 
HTML代碼 (左側)中的代碼順序，以及使用樣式表后每個(gè)代碼塊是如何排列的此外，考慮元素的相對重要性以及將最重要的信息置于網(wǎng)頁(yè)起始位置也是必的。這一方法被稱(chēng)為“前置”，它有很多好處。當主要內容在源代碼中位于較前的置時(shí)，盲人用戶(hù)以及使用小顯示屏的用戶(hù)能更直接地訪(fǎng)問(wèn)這些內容，而鍵盤(pán)用戶(hù)能更直接地訪(fǎng)問(wèn)頁(yè)面的功能性元素。若相關(guān)內容位于文檔頂部，搜索引擎在對頁(yè)進(jìn)行索引時(shí)便可以發(fā)揮更好的功效。
 
選擇性顯示
 
文檔設計的另一方面在于，吸收與不同環(huán)境相關(guān)的元素并對文檔進(jìn)行編碼，這樣元素就可以根據情況顯示或者不顯示了。例如，盡管對任何顯示屏設計而言，導航鏈接是基礎，但當打印到紙面上時(shí)，它們就沒(méi)有多大幫助了。
 
另外，當我們打算集中為電腦屏幕設計文檔時(shí)，絕大多數文檔內容解決的是視覺(jué)瀏覽需求，其中某些元素對其他環(huán)境會(huì )有用。在打印時(shí)，頁(yè)面URL有助于返回頁(yè)面或引用文章。而在顯示屏上，頁(yè)面URL則可以便捷地獲得，因而沒(méi)必要顯示該信息。在這一實(shí)例中，可以使用CSS來(lái)隱藏顯示屏樣式表中的URL。
 
文本替代物
 
網(wǎng)頁(yè)設計涉及提供視覺(jué)和非視覺(jué)方式以訪(fǎng)問(wèn)信息和功能。我們之所以能夠滿(mǎn)足如此廣泛且各異的在線(xiàn)觀(guān)眾的需求，主要原因在于可以使用軟件閱讀文本。當然。并非網(wǎng)頁(yè)上所有的信息和功能都是文本格式:事實(shí)上，網(wǎng)頁(yè)正不斷地被諸如圖像、
 
視頻以及交互性等其他內容豐富著(zhù)。要想在一個(gè)復雜且視覺(jué)上豐盛的環(huán)境中獲得普遍的可用性，需要為所有相關(guān)的非文本元素提供文本替代物。
 
替代文本可以有很多形式。描述性標題是一種替代方式，它可以顯示包含圖像的信息。很多網(wǎng)站會(huì )在頁(yè)面的腳注中使用文本鏈接，以便為基于圖片的鏈接是供只由文本組成的替代物。你可以在頁(yè)面代碼中提供替代文本。例如，使用<img>標簽的“alt"屬性，可以為圖像提供替代文本。音頻和視頻展示往往使用標題和文本記錄來(lái)進(jìn)行展示。核心概念不在于提供了多少，而在于替代文本被提供給源代碼，以便頁(yè)面中必要的內容和功能具有機讀性，并因此具有可訪(fǎng)問(wèn)性和通用可用性。
 
人們通過(guò)不同的方式來(lái)進(jìn)行網(wǎng)頁(yè)體驗。對某些人來(lái)說(shuō)，網(wǎng)絡(luò )是頁(yè)面在線(xiàn)閱讀的直接媒介一在大的電腦顯示屏上，使用小型便攜式設備 .或使用軟件進(jìn)行有聲閱讀。對其他人來(lái)說(shuō)，網(wǎng)絡(luò )是一個(gè)發(fā)送媒介，使用它可以離線(xiàn)獲取信息，即將信息下載到光盤(pán)或者打印到紙面上。對人們普遍使用網(wǎng)站的方式的預期將主導你對頁(yè)面設計的決定。在線(xiàn)閱讀的文檔將為在線(xiàn)閱讀這目的進(jìn)行書(shū)寫(xiě)，使用可以完全適應不同屏幕大小和訪(fǎng)向方式的頁(yè)面設計。那些很可能用于打印或離線(xiàn)閱讀的文檔，則應當完美地呈現在一個(gè)網(wǎng)站制作頁(yè)面上，并且應當使用打印樣式表以確保設計適應于最理想的打印樣式，例如，去掉打印頁(yè)中無(wú)關(guān)的網(wǎng)站導航鏈接。那些可能面向移動(dòng)用戶(hù)的文檔應當能夠在混合移動(dòng)環(huán)境中工作，可以在經(jīng)過(guò)拆分的頁(yè)面閱讀，同時(shí)也可以通過(guò)小但完備的移動(dòng)瀏覽器進(jìn)行常規瀏覽。