在HTML5普遍的年代，網(wǎng)站前端也越來越遭到咱們的注重，可是仍是有許多人表明有置疑前端到底是做什么的，能夠在網(wǎng)站建造中起到什么效果呢？許多公司的職位劃分的時(shí)分是沒前端這個(gè)職位，只有特別專業(yè)或者具有完善的公司體系才會(huì)組織這個(gè)職位，許多公司的組織會(huì)把前端與規(guī)劃何為一同，還有把前端和后臺(tái)建造合在一體，所以網(wǎng)站建造中前端給人的印象不是非常的深入。

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

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

　　網(wǎng)站前端詳細(xì)能夠給網(wǎng)站帶來哪些好處呢：

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

　　（2）關(guān)于 hack

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

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

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

　　(5)與HTML5的結(jié)合，HTML5年代的來臨伴跟著移動(dòng)互聯(lián)網(wǎng)的興起創(chuàng)造了更大的機(jī)會(huì)，還有太多的東西值得咱們?nèi)�學(xué)習(xí)去發(fā)現(xiàn)。 HTML5 供給了豐厚的 JS API 接口，需求咱們?nèi)パ杏�；CSS3的艷麗招引了足夠多的眼球，需求咱們?nèi)パ杏�；移�?dòng)設(shè)備上怎么開發(fā)更加適配的頁面，需求咱們?nèi)パ杏憽��?/p>