Web 設(shè)計相關(guān)概念教學(xué)課件

1、Web 設(shè)計相關(guān)概念內(nèi)容HTML與XHTML；DHTML ；DIV；CSSXML；SHTML；XHTML是什么？HTML是一種基本的WEB網(wǎng)頁設(shè)計語言，XHTML是一個基于XML的置標(biāo)語言，看起來與HTML有些相象，只有一些小的但重要的區(qū)別，XHTML就是一個扮演著類似HTML的角色的XML，所以，本質(zhì)上說，XHTML是一個過渡技術(shù)，結(jié)合了XML（有幾分）的強大功能及HTML（大多數(shù)）的簡單特性。2000年底，國際W3C(WorldWideWebConsortium)組織公布發(fā)行了XHTML1.0版本。XHTML1.0是一種在HTML4.0基礎(chǔ)上優(yōu)化和改進的的新語言，目的是基于XML應(yīng)用。XH

2、TML是一種增強了的HTML,它的可擴展性和靈活性將適應(yīng)未來網(wǎng)絡(luò)應(yīng)用更多的需求。XHTML解決什么問題？下面是W3C的HTML工作組主席StevenPemberton回答的關(guān)于XHTML的常見基礎(chǔ)問題。（1）XHTML解決HTML語言所存在的嚴(yán)重制約其發(fā)展的問題。HTML發(fā)展到今天存在三個主要缺點：不能適應(yīng)現(xiàn)在越多的網(wǎng)絡(luò)設(shè)備和應(yīng)用的需要，比如手機、PDA、信息家電都不能直接顯示HTML；由于HTML代碼不規(guī)范、臃腫，瀏覽器需要足夠智能和龐大才能夠正確顯示HTML；數(shù)據(jù)與表現(xiàn)混雜，這樣你的頁面要改變顯示，就必須重新制作HTML。因此HTML需要發(fā)展才能解決這個問題，于是W3C又制定了XHTML，

3、XHTML是HTML向XML過度的一個橋梁。（2）XML是web發(fā)展的趨勢，所以人們急切的希望加入XML的潮流中。XHTML是當(dāng)前替代HTML4標(biāo)記語言的標(biāo)準(zhǔn)，使用XHTML1.0，只要你小心遵守一些簡單規(guī)則，就可以設(shè)計出既適合XML系統(tǒng)，又適合當(dāng)前大部分HTML瀏覽器的頁面。這個意思就是說，你可以立刻設(shè)計使用XML，而不需要等到人們都使用支持XML的瀏覽器。這個指導(dǎo)方針可以使web平滑的過渡到XML。XHTML解決什么問題？ （3）使用XHTML的另一個優(yōu)勢是：它非常嚴(yán)密。當(dāng)前網(wǎng)絡(luò)上的HTML的糟糕情況讓人震驚，早期的瀏覽器接受私有的HTML標(biāo)簽，所以人們在頁面設(shè)計完畢后必須使用各種瀏覽器來

4、檢測頁面，看是否兼容，往往會有許多莫名其妙的差異，人們不得不修改設(shè)計以便適應(yīng)不同的瀏覽器。（4）XHTML是能與其它基于XML的標(biāo)記語言、應(yīng)用程序及協(xié)議進行良好的交互工作。（5）XHTML是Web標(biāo)準(zhǔn)家族的一部分，能很好在無線設(shè)備等其它用戶代理上。（6）在網(wǎng)站設(shè)計方面，XHTML可助你去掉表現(xiàn)層代碼的惡習(xí)，幫助你養(yǎng)成標(biāo)記校驗來測試頁面工作的習(xí)慣。什么是DHTML？DHTML只是一種制作網(wǎng)頁的概念，實際上沒有一個組織或機構(gòu)推出過所謂的DHTML標(biāo)準(zhǔn)或技術(shù)規(guī)范之類的。DHTML不是一種技術(shù)、標(biāo)準(zhǔn)或規(guī)范，DHTML只是一種將目前已有的網(wǎng)頁技術(shù)、語言標(biāo)準(zhǔn)整和運用，制作出能在下載后仍然能實時變換頁面元素

5、效果的網(wǎng)頁的設(shè)計概念。DHTML大致包含以下網(wǎng)頁技術(shù)、標(biāo)準(zhǔn)或規(guī)范HTML4.0網(wǎng)頁的基礎(chǔ)語言標(biāo)準(zhǔn)。CSSL注意！不是CSS，是CSSL，它是Clent-SidescrptingLanguage的縮寫，譯作“客戶端腳本語言”，主要有Javascrpt(JS)，VBscrpt(VBS)，Jscrpt。Netscape主要支持JS，IE主要支持JS，VBS和Jscrpt。DOMDocumentObjectModel的縮寫，譯作“文檔對象模型”，是W3C日前極力推廣的web技術(shù)標(biāo)準(zhǔn)之一，它將網(wǎng)頁中的內(nèi)容抽象成對象，每個對象擁有各自的屬性(Properties)、方法(Method)和事件(Events

6、)，這些都可以通過上面講到的CSSL來進行控制。IE和NS的對象模型都是以W3C的公布的DOM為基準(zhǔn)，加上自己的ExtendedObject(擴展對象)來生成的。CSS這才是CascadingStyleSheets(層疊樣式表單)的縮寫，它是HTML的輔助設(shè)計規(guī)范，用來彌補HTML在排版上的所受的限制導(dǎo)致的不足，它是DOM的一部分。理論上說通過CSSL動態(tài)地改變CSS屬性可以做出任何你想要的頁面視覺效果。所以，簡單地說，要實現(xiàn)DHTML，就是以HTML為基礎(chǔ)，運用DOM將頁面元素對象化，利用CSSL控制這些對象的CSS屬性以達(dá)到網(wǎng)頁的動態(tài)視覺效果。什么 是DIV？網(wǎng)頁中的層；div和span都

7、是CSS里頭的層，由全球廣域網(wǎng)協(xié)會W3C的Positioning HTML Elements with Cascading Style Sheets（使用級聯(lián)樣式表確定HTML元素的定義）定義。DIV元素是用來為HTML文檔內(nèi)大塊（block-level）的內(nèi)容提供結(jié)構(gòu)和背景的元素。DIV的起始標(biāo)簽和結(jié)束標(biāo)簽之間的所有內(nèi)容都是用來構(gòu)成這個塊的，其中所包含元素的特性由DIV標(biāo)簽的屬性來控制，或者是通過使用樣式表格式化這個塊來進行控制。Internet Explorer和Netscape的瀏覽器都支持DIV標(biāo)簽。DIV和SPAN很多開發(fā)人員都把DIV元素同SPAN元素弄混淆了。盡管它們在特性上相同

8、，但是SPAN是用來定義內(nèi)嵌內(nèi)容而不是大塊內(nèi)容的。你可以對段落使用DIV標(biāo)簽，但是SPAN對于為段落內(nèi)的一個或者多個字賦予特殊的特性很有用。DIV標(biāo)簽允許你分割一個Web頁面，以此來進行格式化和演示?？梢詫⑺涂梢曅缘募记山M合起來使用，用以分割頁面的內(nèi)容，并顯示你所選擇的內(nèi)容。什么是CSS？CSS（Cascading Style Sheet，可譯為“層疊樣式表”或“級聯(lián)樣式表”）是一組格式設(shè)置規(guī)則，用于控制Web頁面的外觀。通過使用CSS樣式設(shè)置頁面的格式，可將頁面的內(nèi)容與表現(xiàn)形式分離。頁面內(nèi)容存放在HTML文檔中，而用于定義表現(xiàn)形式的CSS規(guī)則則存放在另一個文件中或HTML文檔的某一部分，通

9、常為文件頭部分。將內(nèi)容與表現(xiàn)形式分離，不僅可使維護站點的外觀更加容易，而且還可以使HTML文檔代碼更加簡練，縮短瀏覽器的加載時間。CSS解決什么問題？樣式解決了一個普遍的問題 HTML 標(biāo)簽原本被設(shè)計為用于定義文檔內(nèi)容。通過使用 、 這樣的標(biāo)簽，HTML 的初衷是表達(dá)“這是標(biāo)題”、“這是段落”、“這是表格”之類的信息。同時文檔布局由瀏覽器來完成，而不使用任何的格式化標(biāo)簽。由于兩種主要的瀏覽器（Netscape 和 Internet Explorer）不斷地將新的 HTML 標(biāo)簽和屬性（比如字體標(biāo)簽和顏色屬性）添加到 HTML 規(guī)范中，創(chuàng)建文檔內(nèi)容清晰地獨立于文檔表現(xiàn)層的站點變得越來越困難。為了

10、解決這個問題，萬維網(wǎng)聯(lián)盟（W3C），這個非營利的標(biāo)準(zhǔn)化聯(lián)盟，肩負(fù)起了 HTML 標(biāo)準(zhǔn)化的使命，并在 HTML 4.0 之外創(chuàng)造出樣式（Style）。所有的主流瀏覽器均支持層疊樣式表。 樣式表極大地提高了工作效率樣式表定義如何顯示 HTML 元素，就像 HTML 3.2 的字體標(biāo)簽和顏色屬性所起的作用那樣。樣式通常保存在外部的 .css 文件中。通過僅僅編輯一個簡單的 CSS 文檔，外部樣式表使你有能力同時改變站點中所有頁面的布局和外觀。由于允許同時控制多重頁面的樣式和布局，CSS 可以稱得上 WEB 設(shè)計領(lǐng)域的一個突破。作為網(wǎng)站開發(fā)者，你能夠為每個 HTML 元素定義樣式，并將之應(yīng)用于你希望的

11、任意多的頁面中。如需進行全局的更新，只需簡單地改變樣式，然后網(wǎng)站中的所有元素均會自動地什么是XML？XML（Extensible Markup Language）即可擴展標(biāo)記語言，它與HTML一樣，都是SGML(Standard Generalized Markup Language,標(biāo)準(zhǔn)通用標(biāo)記語言)。Xml是Internet環(huán)境中跨平臺的，依賴于內(nèi)容的技術(shù)，是當(dāng)前處理結(jié)構(gòu)化文檔信息的有力工具。擴展標(biāo)記語言XML是一種簡單的數(shù)據(jù)存儲語言，使用一系列簡單的標(biāo)記描述數(shù)據(jù)，而這些標(biāo)記可以用方便的方式建立，雖然XML占用的空間比二進制數(shù)據(jù)要占用更多的空間，但XML極其簡單易于掌握和使用。XML特性X

12、ML與Access,Oracle和SQL Server等數(shù)據(jù)庫不同，數(shù)據(jù)庫提供了更強有力的數(shù)據(jù)存儲和分析能力，例如：數(shù)據(jù)索引、排序、查找、相關(guān)一致性等，XML僅僅是展示數(shù)據(jù)。事實上XML與其他數(shù)據(jù)表現(xiàn)形式最大的不同是：他極其簡單。這是一個看上去有點瑣細(xì)的優(yōu)點，但正是這點使XML與眾不同。 XML與HTML的設(shè)計區(qū)別是：XML是用來存儲數(shù)據(jù)的，重在數(shù)據(jù)本身。而HTML是用來定義數(shù)據(jù)的，重在數(shù)據(jù)的顯示模式。XML的簡單使其易于在任何應(yīng)用程序中讀寫數(shù)據(jù)，這使XML很快成為數(shù)據(jù)交換的唯一公共語言，雖然不同的應(yīng)用軟件也支持其它的數(shù)據(jù)交換格式，但不久之后他們都將支持XML，那就意味著程序可以更容易的與Wi

13、ndows、Mac OS, Linux以及其他平臺下產(chǎn)生的信息結(jié)合，然后可以很容易加載XML數(shù)據(jù)到程序中并分析他，并以XML格式輸出結(jié)果。為了使得SGML顯得用戶友好，XML重新定義了SGML的一些內(nèi)部值和參數(shù)，去掉了大量的很少用到的功能，這些繁雜的功能使得SGML在設(shè)計網(wǎng)站時顯得復(fù)雜化。XML保留了SGML的結(jié)構(gòu)化功能，這樣就使得網(wǎng)站設(shè)計者可以定義自己的文檔類型，XML同時也推出一種新型文檔類型，使得開發(fā)者也可以不必定義文檔類型。 因為XML是W3C制定的，XML的標(biāo)準(zhǔn)化工作由W3C的XML工作組負(fù)責(zé)，該小組成員由來自各個地方和行業(yè)的專家組成，他們通過email交流對XML標(biāo)準(zhǔn)的意見，并提出

14、自己的看法 (/TR/WD-xml)。因為XML 是個公共格式， (它不專屬于任何一家公司)，你不必?fù)?dān)心XML技術(shù)會成為少數(shù)公司的盈利工具，XML不是一個依附于特定瀏覽器的語言什么是SHTML？SHTML不是HTML而是一種服務(wù)器API，shtml是服務(wù)器動態(tài)產(chǎn)成的html。雖然兩者都是超文本格式,但shtml是一種用于SSI技術(shù)的文件。也就是ServerSideInclude-SSI服務(wù)器端包含指令。如果WebServer有SSI功能的話(大多數(shù)（尤其是基于Unix平臺）的WEB服務(wù)器如NetscapeEnterpriseServer等均支持SSI命令)。會對shtml文件特殊招待。先掃一次

15、shtml文件看沒有特殊的SSI指令現(xiàn)在。有就按WebServer設(shè)定規(guī)則解釋SSI指令。解釋完后跟一般html一起掉去客戶端。SHTML使用SSI(ServerSideInclude)的html文件擴展名，SSI（ServerSideInclude)，通常稱為服務(wù)器端嵌入或者叫服務(wù)器端包含，是一種類似于ASP的基于服務(wù)器的網(wǎng)頁制作技術(shù)。SSI工作原理將內(nèi)容發(fā)送到瀏覽器之前，可以使用“服務(wù)器端包含(SSI)”指令將文本、圖形或應(yīng)用程序信息包含到網(wǎng)頁中。例如，可以使用SSI包含時間/日期戳、版權(quán)聲明或供客戶填寫并返回的表單。對于在多個文件中重復(fù)出現(xiàn)的文本或圖形，使用包含文件是一種簡便的方法。將內(nèi)

16、容存入一個包含文件中即可，而不必將內(nèi)容輸入所有文件。通過一個非常簡單的語句即可調(diào)用包含文件，此語句指示W(wǎng)eb服務(wù)器將內(nèi)容插入適當(dāng)網(wǎng)頁。而且，使用包含文件時，對內(nèi)容的所有更改只需在一個地方就能完成。因為包含SSI指令的文件要求特殊處理，所以必須為所有SSI文件賦予SSI文件擴展名。默認(rèn)擴展名是.stm、.shtm和.shtmlWeb服務(wù)器在處理網(wǎng)頁的同時處理SSI指令。當(dāng)Web服務(wù)器遇到SSI指令時，直接將包含文件的內(nèi)容插入HTML網(wǎng)頁。如果“包含文件”中包含SSI指令，則同時插入此文件。除了用于包含文件的基本指令之外，還可以使用SSI指令插入文件的相關(guān)信息（如文件的大小）或者運行應(yīng)用程序或shell命令。網(wǎng)站維護常常碰到的一個問題是，網(wǎng)站的結(jié)構(gòu)已經(jīng)固定，卻為了更新一點內(nèi)容而不得不重做一大批網(wǎng)頁。SSI提供了一種簡單、有效的方法來解決這一問題，它將一個網(wǎng)站的基本結(jié)構(gòu)放在幾個簡單的HTML文件中（模板），以后我們