如何令你的網站“動感十足”

來源:互聯網
上載者:User
動感 如何令你的網站“動感十足”

  您的網站是否仍一如既往地保持“靜態”?目前呈幾何增長的互連網網站中,有相當一部分仍固守“靜態”,無形中已大大落後於時代的步伐。所謂“靜態”指的就是網站的網頁內容“固定不變”,當使用者瀏覽器通過互連網的HTTP(Hypertext Transport Pr otocol)協議向WEB伺服器請求提供網頁內容時,伺服器僅僅是將原已設計好的靜態HTML文檔傳送給使用者瀏覽器。其頁面的內容使用的僅僅是標準的HTML代碼,最多再加上流行的GIF89A格式的動態圖片,比如產生幾隻小狗小貓跑來跑去的動畫效果。若網站維護者要更新網頁的內容,就必須手動地來更新其所有的HTML文檔。

  “靜態”網站的致命弱點就是不易維護,為了不斷更新網頁內容,你必須不斷地重複製作HTML文檔,隨著網站內容和資訊量的日益擴增,你就會感到工作量大得出乎想象。

  你不禁要問:那麼什麼是動態網站呢?這就是本文將重點講述的核心,所謂“動態”,並不是指那幾個放在網頁上的GIF動態圖片,在這裡筆者為動態網頁面的概念制定了以下幾條規則:
  1、“互動性”即網頁會根據使用者的要求和選擇而動態改變和響應,將瀏覽器作為用戶端介面,這將是今後WEB發展的大事所趨。
  2、“自動更新”即無須手動地更新HTML文檔,便會自動產生新的頁面,可以大大節省工作量。
  3、“因時因人而變”,即當不同的時間、不同的人訪問同一網址時會產生不同的頁面,是不是很酷?

  現在你已經對“動態”網站有了一個基本的概念,接下來應挑選稱手的“兵刃”了。將網站“動態”化的方法很多,這要看你是出於何種需求。如果你是個人網站的維護者,使用的是免費首頁空間,那麼絕大多數情況下你只能使用Java、Java Script和最新的DHTML技術,如果你的首頁空間提供者能給予你CGI許可權或ASP支援,那麼你將能非常幸運地發揮真正的動態技術。關於CGI和ASP技術將在後面的著重討論,這裡針對個人網站僅就最新的DHTML技術進行重點介紹。

  究竟什麼是DHTML?它與傳統的HTML有什麼不同?DHTML就是當網頁從WEB伺服器下載後無須再經過伺服器的處理,而在瀏覽器中直接動態地更新網頁的內容、排版樣式、動畫。比如,當滑鼠移至文章段落中,段落能夠變成藍色,或者當你點擊一個超鏈後會自動產生一個下拉式的子超鏈目錄。這就是Dynamic HTML(動態HTML),它是近年來網路飛速發展進程中最振奮人心也是最具實用性的創新之一。它是一種通過各種技術的綜合發展而得以實現的概念,這些技術包括Java Script , VB0Script, Document Object Model (檔案目標模組),Layers和Cascading Style Sheets ( CSS樣式表)等。非常遺憾的是在網景Netscape和微軟IE瀏覽器幾番大戰後,我們仍沒有得到一個對DHTML支援的統一標準。因此本文在介紹DHTML時不得不分別講述。讓我們先來看看Microsoft IE 4對DHTML的支援:
  1 .動態內容(Dynamic Content):動態地更新網頁的內容,可"動態"地隨時插入、修改、或刪除網頁的元件,譬如文字、標記等。
  2 .動態排版樣式(Dynamic Styles Sheets):通過W3C的“Cascading Style Sheets”(串聯式排版樣式,簡稱CSS1或CSS),提供了設定HTML標記的字型大小、字型、粗細、字型樣式、行高度、文字顏色、加底線或加中間橫線、與邊緣距離、靠左右或置中、縮排、背景圖片或顏色等排版功能。而“動態排版樣式”,可以“動態”地隨時地改變排版樣式。
  3 .動態定位(Dynamic Positioning):通過W 3 C的“Working Draft on Positioning HTML with Cascading Style Sheets”,提供HTML元件在X、Y、Z軸的定位功能,讓設計者可以放置影像、控制項、文字等在網頁上的任何位置上。而放置在不同的Z軸上,設計者就可以產生重疊的效果。
  4 .內建資料處理(Data Awareness):無須複雜的程式,無須花費伺服器太多資源,即可讓網頁設計者即時處理文檔。
  5 .內建多媒體支援:IE 4.0結合CSS與內建的ActiveX Controls,提供多媒體支援的功能,包括轉換特效、濾鏡特效、路徑控制、順序控制、動畫、製圖、播放聲音和影像等多媒體功能。

  讓我們再來看看Netscape Communicator 4.0對DHTML所提供的支援:
  1 .動態排版樣式(Dynamic Styles Sheets):支援W 3 C的“Cascading Style Sheets”(串聯式排版樣式,簡稱CSS1或CSS)、和自創的“Java Script Style Sheets”。
  2 .Dynamic Layers:提供圖文定位、改變圖文重疊順序、控制隱藏或顯示圖文、移動圖文的功能,讓您設計出“動畫”的效果!
  3 .Dynamic Fonts:提供由伺服器下載字型的功能。可見雖然IE 4.0和Netscape Communicator 4.0都提供了“Dynamic HTML”的支援,但是事實上兩者除了對“Cascading Style Sheets”的規格相近外,其餘都相差甚遠。因此當你設計DHTML頁面時必須充分考慮到相容性的問題,選擇稱手的“兵刃”和方法對於設計者來說始終是最重要的。有關DHTML的使用方法和設計技巧作者將在第二章《動態網頁設計十八般武藝》中仔細講解,請密切關注。

  或許對於一個個人網站來說充分運用DHTML技術足以令網頁栩栩如生,動感十足。然而對於建立商業網站的企業而言,僅僅擁有DHTML是遠遠不夠的。因為僅僅發生在客戶瀏覽器端的動態效果是無法滿足商業網站大量資訊查詢,客戶諮詢,資源互動等“動態”需求的。因此作為商業網站的設計者,必須要設計出更具實用性和互動性的“動態”網站。由於絕大多數商業網站都具有大量的資料和資訊,而建網的初衷也就是在於方便客戶查詢企業資料,方便同客戶的交流,及時獲得資訊反饋。那麼,就必然會面臨如何讓使用者在瀏覽器介面中,通過互連網或內連網(Intranet)查詢WEB資料庫的資料,甚至輸入、更新和刪除WEB伺服器上的資料。下面筆者就簡單介紹幾種常用的“動態”網站設計方法:

  1、CGI(Common Gateway Interface)通用閘道介面的傳統方式,當使用者在瀏覽器端填好表單(form)要求輸入的資料,提出HTTP請求後,WEB伺服器端將執行一個表單所設定的可執行檔CGI應用程式,CGI程式分析表單(form)中所輸入的資料,存取WEB資料庫,將查詢執行的結果以HTML的格式返回給瀏覽器。使用CGI方式存取WEB資料庫,有很多的缺點,譬如不易開發、變更修改成本高、功能有限、不易偵錯、執行速度慢等,而且由於並非整合於HTML文檔之中,因此必須使用與HTML完全不同的設計過程來設計一個可執行檔應用程式。

  2、IDC(Internet Database Connector)互連網資料庫連接頭是Windows NT Server內含Internet Information Server(簡稱IIS)2.0的特徵之一,它提供了一種使你的互連網資料庫內容得以發布並可與使用者互動的方法,它實際上是一個包含於IIS中的I S A P I應用程式。你只需掌握HTML和SQL的基本知識並寫為數不多的代碼就能編出具有互動能力的資料庫應用程式,讓使用者在瀏覽器介面中得以查詢、輸入、更新、和刪除WEB伺服器上的資料資料。正如VB程式員所喜歡的那樣,構成IDC應用程式的檔案是解釋性的,由於設計簡易,只要準備兩個檔案,即可在使用者端的瀏覽器中存取WEB伺服器的資料資料,且無須編譯,因此具有快速的開發迴圈和反饋。但這種簡單性的代價是犧牲了許多靈活性,使你不得不放棄許多對使用者介面的控制,並幾乎放棄了所有驗證資料的能力。因而I D C僅適用於簡單的WEB應用程式。

  3、ActiveX Data Object(ADO)是WEB資料庫應用的最佳選擇。
  ActiveX Data Object(簡稱ADO)究竟是什麼呢?ActiveX Data Object的技術,讓您可以與Active Server Pages(簡稱ASP)結合以建立提供資料資訊的網頁內容,只需在網頁面中執行Structured Query Language(結構化查詢語言 (SQL),簡稱SQL)指令,讓使用者在瀏覽器介面中輸入、更新、和刪除WEB伺服器上的資料資料。當使用者端的瀏覽器填好表單所要求輸入的資料並按下“Submit”按鈕後,經過互連網、內連網傳送HTTP請求到WEB伺服器,該請求在WEB伺服器執行一個表單所指定的Active Server Pages程式(尾碼名為. ASP的文檔)。一個. ASP文檔是一個純文字檔,包括:HTML標記(tags)、VBScript或JScript語言的程式碼、ASP文法、和結構化查詢語言 (SQL)SQL指令。IIS3.0 / 4.0 WEB伺服器執行. ASP文檔,通過ODBC驅動程式,串連到支援O

[1] [2] 下一頁  



相關文章

Alibaba Cloud 10 Year Anniversary

With You, We are Shaping a Digital World, 2009-2019

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。