HTML5的設(shè)計(jì)特性!
發(fā)表日期:2015/7/31 14:33:34 文章編輯: 瀏覽次數(shù):2738
第一個(gè),非常簡(jiǎn)單:避免不必要的復(fù)雜性。好像很簡(jiǎn)單吧。我用一個(gè)例子來說明。
假設(shè)我使用HTML 4.01規(guī)范,我打開文檔,輸入doctype。這里有人記得HTML 4.01的doctype嗎?好,沒有,我猜沒有。除非……我的意思是說,你是傻冒。現(xiàn)場(chǎng)恐怕真有人背過,這就是HTML 4.01的doctype:
1 | <!DOCTYPE html PUBLIC "-//W3C/DTD HTML 4.01//EN" |
2 | "http://www.w3.org/TR/html4/strict.dtd"> |
我不記這個(gè)兩行代碼,不然還要記事本、要Google、要模板有什么用呢?
要是我使用XHTML 1.0呢,這個(gè)規(guī)范我都已經(jīng)用了10年了。有誰(shuí)記得住這個(gè)doctype嗎?沒錯(cuò),它的長(zhǎng)度跟HTML 4.01的差不太多:
1 | <!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Strict//EN" |
2 | "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
是不是,基本上相同。它要告訴瀏覽器的是:這個(gè)文檔是XHTML 1.0的文檔。那么在HTML 5中,省掉不必要的復(fù)雜性,doctype就簡(jiǎn)化成了:
1 |
|
僅此而已。好了,就連我也能過目不忘了。我用不著把這幾個(gè)字符記在記事本里了。我得說,在我第一次看到這個(gè)doctype的時(shí)候——我當(dāng)然以為這是 一個(gè)HTML文檔的doctype——被它嚇了一跳:“是不是還少一個(gè)數(shù)字5???”我心里想:“這個(gè)doctype想告訴瀏覽器什么呢?就說這個(gè)文檔是 HTML嗎?難道這是有史以來唯一一個(gè)HTML版本嗎,這件事我得首先搞清楚,HTML今后永遠(yuǎn)不會(huì)再有新版本了嗎?”好一副唯我獨(dú)尊的架式!我錯(cuò)了,因 為這個(gè)doctype并沒有這個(gè)意思。為此,必須先搞清楚為什么文檔一開頭就要寫doctype。它不是寫給瀏覽器看的。Doctype是寫給驗(yàn)證器看 的。也就是說,我之所以要在文檔一開頭寫那行XHTML 1.0的doctype,是為了告訴驗(yàn)證器,讓驗(yàn)證器按照該doctype來驗(yàn)證我的文檔。
瀏覽器反倒無所謂了。假設(shè)我寫的是HTML 3.2文檔,文檔開頭寫的是HTML 3.2的doctype。而在文檔中某個(gè)地方,我使用了HTML 4.01中才出現(xiàn)的一個(gè)元素。瀏覽器會(huì)怎么處理這種情況?它會(huì)因?yàn)檫@個(gè)元素出現(xiàn)在比doctype聲明的HTML版本更晚的規(guī)范中,就不解釋呈現(xiàn)該元素 嗎?不會(huì),當(dāng)然不會(huì)!它照樣會(huì)解釋呈現(xiàn)該元素,別忘了伯斯塔爾法則,別忘了健壯性。瀏覽器在接收的時(shí)候必須要開放。因此,它不會(huì)檢查任何格式類型,而驗(yàn)證 器會(huì),驗(yàn)證器才關(guān)心格式類型。這才是存在doctype的真正原因。
而按照HTML5的另一個(gè)設(shè)計(jì)原理,它必須向前向后兼容,兼容未來的HTML版本——不管是HTML6、HTML7,還是其他什么——都要與當(dāng)前的HTML版本,HTML5,兼容。因此,把一個(gè)版本號(hào)放在doctype里面沒有多大的意義,即使對(duì)驗(yàn)器證也一樣。
剛才,我說doctype不是為瀏覽器寫的,這樣說大多數(shù)情況下沒有問題。在有一種情況下,你使用的doctype會(huì)影響到瀏覽器,相信在座諸位也 都知道。但在這種情況下,Doctype并非真正用得其所,而只是為了達(dá)到某種特殊的目的才使用doctype。當(dāng)初微軟在引入CSS的時(shí)候,走在了標(biāo)準(zhǔn) 的前頭,他們率先在瀏覽器中支持CSS,也推出了自己的盒模型——后來標(biāo)準(zhǔn)發(fā)布了,但標(biāo)準(zhǔn)中使用了不一樣的盒模型。他們?cè)趺崔k?他們想支持標(biāo)準(zhǔn),但也想向 后兼容自己過去推出的編碼方式。他們?cè)趺粗谰W(wǎng)頁(yè)作者想使用標(biāo)準(zhǔn),還是想使用他們過去的方式?
于是,他們想出了一個(gè)非常巧妙的主意。那就是利用doctype,利用有效的doctype來觸發(fā)標(biāo)準(zhǔn)模式,而不是兼容模型(quiks mode)。這個(gè)主意非常巧妙。我們今天也都是這樣在做,在我們向文檔中加入doctype時(shí),就相當(dāng)于聲明了“我想使用標(biāo)準(zhǔn)模式”,但這并不是發(fā)明 doctype的本意。這只是為了達(dá)到特殊的目的在利用doctype。
下面我出一道有獎(jiǎng)?chuàng)尨痤},聽好:“一分鐘后開始,如果你手快的話,第一個(gè)在文檔前面寫完doctype html,然后我用Internet Explorer打開你的文檔,會(huì)觸發(fā)它的標(biāo)準(zhǔn)模式,還是會(huì)觸發(fā)它的兼容模式?”
答案是,這是在Internet Explorer中觸發(fā)標(biāo)準(zhǔn)模式的最少字符數(shù)目。我認(rèn)為這也說明了HTML5規(guī)范的本質(zhì):它不追求理論上的完美。HTML5所體現(xiàn)的不是“噢,給作者一個(gè) 簡(jiǎn)短好記的doctype不好嗎?”,沒錯(cuò),簡(jiǎn)短好記是很好,但如果這個(gè)好記的doctype無法適應(yīng)現(xiàn)有的瀏覽器,還不如把它忘了更好。因此,這個(gè)平衡 把握得非常好,不僅理論上看是個(gè)好主意——簡(jiǎn)短好記的doctype,而且實(shí)踐中同樣也是個(gè)好主意——仍然可以觸發(fā)標(biāo)準(zhǔn)模式。應(yīng)該說,Doctype是一 個(gè)非常典型的例子。
還有一個(gè)例子,同樣可以說明規(guī)范是如何省略不必要的復(fù)雜性,避免不必要的復(fù)雜性的。如果前面的文檔使用的是HTML 4.01,假設(shè)我要指定文檔的字符編碼。理想的方式,是通過服務(wù)器在頭部信息中發(fā)送字符編碼,不過也可以在文檔這個(gè)級(jí)別上指定:
1 | < meta http-equiv = "Content-Type" content = "text/html; charset=utf-8" > |
同樣,我也不會(huì)把這行代碼背下來。我還想省下自己的腦細(xì)胞去記點(diǎn)別的更有價(jià)值的東西呢。不過,如果我想指定文檔使用UTF-8編碼,只能添加這行代 碼。這是在HTML 4.01中需要這樣做。要是你在XHTML 1.0指定同樣的編碼,就得多敲一下鍵盤,因?yàn)槟氵€得聲明meta元素位于一個(gè)開始的XML標(biāo)簽中。
1 | <? xml version = "1.0" encoding = "UTF-8" ?> |
2 | < meta http-equiv = "Content-Type" content = "text/html; charset=utf-8" /> |
在HTML5中,你要敲的字符只有:
1 | < meta charset = "utf-8" > |
簡(jiǎn)短好記。我能背下來。
同樣,這樣寫也是有效的。它不僅適用于最新版本的瀏覽器,只要是今天還有人在用的瀏覽器都同樣有效。為什么?因?yàn)樵谖覀儼堰@些meta元素輸入瀏覽 器時(shí),瀏覽器會(huì)這樣解釋它:“元數(shù)據(jù)(meta)點(diǎn)點(diǎn)點(diǎn)點(diǎn)點(diǎn),字符集(charset)utf-8。”這就是瀏覽器在解釋那行字符串時(shí)真正看到的內(nèi)容。它 必須看到這些內(nèi)容,根據(jù)就是伯斯塔爾法則,對(duì)不對(duì)?
我多次提到健壯性原理,但總有人不理解。我們換一種說法,瀏覽器會(huì)想“好,我覺得作者是想要指定一個(gè)字符集……看,沒錯(cuò),utf-8?!边@些都是規(guī)范里明文規(guī)定的。如今,不僅那個(gè)斜杠可以省了,而且總共只要寫meta charset=”utf-8″就行了。
關(guān)于省略不必要的復(fù)雜性,或者說避免不必要的復(fù)雜性的例子還有不少。但關(guān)鍵是既能避免不必要的復(fù)雜性,還不會(huì)妨礙在現(xiàn)有瀏覽器中使用。比如說,在HTML5中,如果我使用link元素鏈接到一個(gè)樣式表,我說了rel=”stylesheet”,然后再說type=”text/css”,那就是重復(fù)自己了。對(duì)瀏覽器而言,我就是在重復(fù)自己。瀏覽器用不著同時(shí)看到這兩個(gè)屬性。瀏覽器只要看到rel=”stylesheet”就夠了,因?yàn)樗梢圆鲁鰜砟阋溄拥氖且粋€(gè)CSS樣式表。所以就不用再指定type屬性了。你不是已經(jīng)說了這是一個(gè)樣式表了嘛;不用再說第二次了。當(dāng)然,愿意的話,你可以再說;如果你想包含type屬性,請(qǐng)便。
同樣地,如果你使用了script元素,你說type=”text/javascript”,瀏覽器差不多就知道是怎么回事了。對(duì)Web開發(fā)而言,你還使用其他的腳本語(yǔ)言嗎?如果你真想用其他腳本語(yǔ)言,沒人會(huì)阻攔你。但我要奉勸你一句,任何瀏覽器都不會(huì)支持你。
愿意的話,你可以添加一個(gè)type屬性。不過,也可以什么都不寫,瀏覽器自然會(huì)假設(shè)你在使用JavaScript。避免-不必要的-復(fù)雜性。
--------北京網(wǎng)站建設(shè)公司 北京傳誠(chéng)信--------
-
男女程序員的對(duì)比,那個(gè)更適合這個(gè)行業(yè).
日期:2016-02-24 瀏覽次數(shù):3243
-
網(wǎng)站布局之價(jià)格表單設(shè)計(jì)靈感來源。
日期:2015-12-14 瀏覽次數(shù):3193
-
JS判斷移動(dòng)設(shè)備并實(shí)現(xiàn)跳轉(zhuǎn)至手機(jī)版網(wǎng)頁(yè)
日期:2015-12-14 瀏覽次數(shù):3335
-
HTML5的設(shè)計(jì)原理之求真務(wù)實(shí)。
日期:2015-07-31 瀏覽次數(shù):2819
-
?HTML5是怎么來的!
日期:2015-07-31 瀏覽次數(shù):2831
-
免費(fèi)SSL證書申請(qǐng)網(wǎng)站topssl.cn上線
日期:2024-09-23 瀏覽次數(shù):1914
-
如何在北京順義尋找一個(gè)踏實(shí)的網(wǎng)站建設(shè)公司
日期:2023-08-10 瀏覽次數(shù):4978
-
順義網(wǎng)站建設(shè):北京順義網(wǎng)站建設(shè)的優(yōu)點(diǎn)
日期:2023-05-25 瀏覽次數(shù):5357
-
選擇網(wǎng)站公司需要考慮哪些因素
日期:2023-05-25 瀏覽次數(shù):4197
-
北京模板建站
日期:2023-03-28 瀏覽次數(shù):4414
-
為什么網(wǎng)站設(shè)計(jì)中PNG是最好的格式,具體原因什么
日期:2019-10-21 瀏覽次數(shù):2336
-
建設(shè)企業(yè)網(wǎng)站注意事項(xiàng)有哪些?
日期:2019-09-19 瀏覽次數(shù):2955
-
如何打造響應(yīng)式的布局結(jié)構(gòu)。
日期:2015-07-23 瀏覽次數(shù):2687
-
網(wǎng)站經(jīng)濟(jì)學(xué):您的網(wǎng)站的利潤(rùn)空間
日期:2019-01-10 瀏覽次數(shù):2417
-
當(dāng)您的高網(wǎng)站流量不能快速轉(zhuǎn)換的五個(gè)清單
日期:2019-06-10 瀏覽次數(shù):2460