前端的職位現(xiàn)已不像很早以前，網(wǎng)站存在著簡(jiǎn)單的模板款式，那時(shí)的頁(yè)面規(guī)劃風(fēng)格相對(duì)單一，對(duì)應(yīng)的頁(yè)面需求比較簡(jiǎn)單，并且其時(shí)的瀏覽器也基本是 IE6 的全國(guó)，javascript 也只是網(wǎng)頁(yè)特效的代名詞，HTML 頁(yè)面自身沒(méi)有引起太多人的注重，好像只需能用 div 乃至 table 加 css 輔佐把圖片定好位，把頁(yè)面內(nèi)容預(yù)留好就 OK 了，并且這種觀念存在了很長(zhǎng)一段時(shí)間。

　　隨著3G業(yè)務(wù)的風(fēng)靡，還有不同人群對(duì)網(wǎng)站建造要求的層次不同，網(wǎng)站的規(guī)劃風(fēng)格越來(lái)越個(gè)性化、專業(yè)化、精巧化。交互復(fù)雜性的增加，AJAX 的運(yùn)用，瀏覽器的更新?lián)Q代，又讓咱們從頭對(duì)最基本的頁(yè)面自身注重起來(lái)。然后熱議的便是瀏覽器的兼容性，碰到問(wèn)題最熱衷的便是滿網(wǎng)絡(luò)查找 hack，趁便再罵罵 IE6、7……當(dāng)這些都做一遍后，好像又遇到了瓶頸，又開端尋找出路。咱們就從這個(gè)階段開端說(shuō)起。

　　網(wǎng)站前端具體能夠給網(wǎng)站帶來(lái)哪些好處呢：

　　（1）能夠給網(wǎng)站結(jié)構(gòu)布局帶來(lái)杰出的展現(xiàn)：拿到規(guī)劃圖后一定要靜心思考，多調(diào)查。先分框架然后規(guī)劃結(jié)構(gòu)，編寫代碼。特別在大型項(xiàng)目中，合理運(yùn)用模塊化的開發(fā)不管從整體進(jìn)行仍是拓展保護(hù)都有相當(dāng)大的好處。

　　（2）關(guān)于 hack 許多同學(xué)在頁(yè)面開發(fā)時(shí)上網(wǎng)查找最多的便是 hack 了，是否咱們完全要依賴 hack 來(lái)完成頁(yè)面兼容性，答案是否定的。咱們常常比喻 IE6 向咱們?nèi)隽艘粋€(gè)謊，成果咱們要再撒一百個(gè)謊來(lái)圓這個(gè)謊。不否認(rèn) IE6 常常讓咱們口吐鮮血，但不代表咱們用更多的“謊話”來(lái)彌補(bǔ)就能夠心安理得。大部分情況下能夠通過(guò)變換思路調(diào)整 HTML 結(jié)構(gòu)，或運(yùn)用一些雖然無(wú)法解釋但相對(duì)安全的 css 來(lái)干掉 hack。誰(shuí)都無(wú)法估計(jì)運(yùn)用 hack 什么時(shí)分會(huì)讓咱們?cè)砸粋€(gè)大跟頭。比方觸發(fā) layout 或 position:relative 就能夠協(xié)助解決許多 IE6 的問(wèn)題。

　　（3）優(yōu)美的代碼：看到合理的標(biāo)簽運(yùn)用、杰出的注釋、清晰的代碼結(jié)構(gòu)、用意準(zhǔn)確的 css 不只猶如欣賞一個(gè)藝術(shù)品，更為下流開發(fā)和協(xié)同開發(fā)降低了不小的溝通本錢。特別是 HTML5 供給了更豐厚的語(yǔ)義化標(biāo)簽，它們都苦苦地在等候戰(zhàn)場(chǎng)上的沖鋒號(hào)，讓咱們?nèi)ソ夥潘鼈儼桑?/span>

　　(4)“工欲善其事，必先利其器”，除了實(shí)戰(zhàn)經(jīng)驗(yàn)和代碼習(xí)慣的構(gòu)成能夠協(xié)助咱們進(jìn)步效率外，想要進(jìn)步對(duì)自己開發(fā)的進(jìn)度掌控能力，還有許多輔佐工具能夠協(xié)助咱們進(jìn)行頁(yè)面開發(fā)。比方運(yùn)用 Less 或 Sass 能夠協(xié)助咱們拓展和組織 CSS，大大進(jìn)步 CSS 的編寫效率增加了可保護(hù)性。

　　(5)與HTML5的結(jié)合，HTML5年代的降臨伴隨著移動(dòng)互聯(lián)網(wǎng)的興起發(fā)明了更大的機(jī)會(huì)，還有太多的東西值得咱們?nèi)W(xué)習(xí)去發(fā)現(xiàn)。 HTML5 供給了豐厚的 JS API 接口，需求咱們?nèi)パ杏懀籆SS3的絢麗吸引了足夠多的眼球，需求咱們?nèi)パ杏懀灰苿?dòng)設(shè)備上怎么開發(fā)更加適配的頁(yè)面，需求咱們?nèi)パ杏憽?/span>