web標(biāo)準(zhǔn)主要強(qiáng)調(diào)的是一個(gè)網(wǎng)站的結(jié)構(gòu),樣式,行為官份。這三者在網(wǎng)站進(jìn)行編寫的時(shí)候應(yīng)該盡量做的分離,從而達(dá)到結(jié)構(gòu)清晰羔味,易于閱讀赋元,易于維護(hù)的目的。那么我們又該如何進(jìn)行分離呢搁凸?
其實(shí)答案就是按結(jié)構(gòu)护糖,樣式嫡良,行為來(lái)分,哈哈皆刺。而更具體的說(shuō)就是將所有html代碼放在html文件中,將css代碼放在css文件中锨亏,將js代碼放在js文件中忙干。接下來(lái),進(jìn)一步闡明三門語(yǔ)言各自的職責(zé)乾翔。
HTML:HTML作為整個(gè)頁(yè)面的骨架反浓。負(fù)責(zé)的對(duì)整個(gè)頁(yè)面內(nèi)容的進(jìn)行合理的組織雷则,同時(shí)通過(guò)語(yǔ)義化的標(biāo)記使得頁(yè)面的內(nèi)容易于讀者閱讀肪笋,利于SEO度迂。應(yīng)該做到的點(diǎn):
1.結(jié)構(gòu)良好:良好的結(jié)構(gòu)將有利于頁(yè)面的拓展惭墓,且會(huì)影響到后續(xù)CSS而姐,JS代碼的質(zhì)量毅人,推薦篇文章
2.做到標(biāo)簽的語(yǔ)義化:例如如果是標(biāo)題那么請(qǐng)記得用h1-h6,如果是語(yǔ)氣的加強(qiáng)請(qǐng)使用strong.我覺(jué)得這方面有個(gè)很好的入口點(diǎn)就是設(shè)想你的頁(yè)面是為“盲人閱讀者而寫”的。而盲人是無(wú)法看到樣式的加粗來(lái)得知該內(nèi)容的強(qiáng)調(diào)的內(nèi)容丈莺。其對(duì)該內(nèi)容為強(qiáng)調(diào)是通過(guò)閱讀機(jī)來(lái)語(yǔ)氣的加強(qiáng)來(lái)得知的。而閱讀機(jī)則是想搜索引擎一樣是通過(guò)標(biāo)簽的語(yǔ)義來(lái)進(jìn)行判斷的
3.標(biāo)簽字母要小寫
4.標(biāo)簽要閉合
5.標(biāo)簽不允許隨意嵌套CSS:CSS主要是負(fù)責(zé)頁(yè)面的樣式弛秋,使得頁(yè)面的不至太過(guò)于單調(diào)乏味蟹略,也是頁(yè)面的的內(nèi)容布局更為優(yōu)美挖炬,給訪問(wèn)者以美感意敛。
JS:javascript使得頁(yè)面具有具有動(dòng)態(tài)性草姻,交互性稍刀。想想各種鼠標(biāo)hover時(shí)的想過(guò),輪播圖综膀〈氛希可知js使得頁(yè)面更加的豐富多彩项炼。另一方面,js也是得一些例如表單檢驗(yàn)的工作可以提前在客戶端完成面褐,進(jìn)一步提升了用戶體驗(yàn)。
最后取胎,想強(qiáng)調(diào)一下我在《DOM編程藝術(shù)》中g(shù)et到的一個(gè)思想展哭,"平穩(wěn)退化,漸進(jìn)增強(qiáng)"闻蛀。具體的闡釋是這樣的:
1.漸進(jìn)增強(qiáng):先實(shí)現(xiàn)最基本的頁(yè)面功能匪傍,然后在此基礎(chǔ)上進(jìn)行優(yōu)化,使得頁(yè)面的行為更加的豐富觉痛,進(jìn)而提高用戶體驗(yàn)役衡。
2.平穩(wěn)退化:通常我們都會(huì)通過(guò)js來(lái)實(shí)現(xiàn)某種效果,從而達(dá)到提高用戶體驗(yàn)的目的薪棒。但試想如果用戶瀏覽器禁用了js手蝎,頁(yè)面的最基本用能是否還能使用?如表單的填寫俐芯,內(nèi)容的展示棵介。
其中有一個(gè)例子至今印象深刻,對(duì)于注冊(cè)登錄時(shí)吧史。通常我們都是提供一個(gè)登錄或注冊(cè)按鈕逆巍。然后檢測(cè)按鈕的click事件芳肌,并將form表單設(shè)置為display:none;用戶的瀏覽器無(wú)法使用js想想是否該網(wǎng)站的登錄,注冊(cè)功能便變得無(wú)法使用了净薛。而作者提供的解決方法是用a作為按鈕。設(shè)為<a href="login.html">登錄</a>
,而在js中通過(guò)hack登陸按鈕的click事件來(lái)達(dá)到能用js時(shí)士聪,點(diǎn)擊登陸按鈕彈出登陸框的效果(當(dāng)然在click事件發(fā)生時(shí)會(huì)通過(guò)阻止默認(rèn)事件使得頁(yè)面不跳轉(zhuǎn))曼库,而當(dāng)js不能使用時(shí),也能通過(guò)跳轉(zhuǎn)單獨(dú)的登錄頁(yè)面進(jìn)行登錄功能的使用。書感覺(jué)還是挺好的蒂誉,尤其是里面的思想,建議有空找來(lái)閱讀閱讀悄窃。