您當前位置:圖趣網(wǎng)(Tuquu) >> 網(wǎng)頁設計教程 >> 用戶研究 >> 瀏覽設計教程

網(wǎng)頁設計新手對“WEB標準化”的理解

 

官方的話

WEB標準不是某一個標準,而是一系列標準的集合。網(wǎng)頁主要由三部分組成:結(jié)構(gòu)(Structure)、表現(xiàn)(Presentation)和行為(Behavior)。對應的標準也分三方面:結(jié)構(gòu)化標準語言主要包括XHTML和XML,表現(xiàn)標準語言主要包括CSS,行為標準主要包括對象模型(如 W3C DOM)、ECMAScript等。這些標準大部分由W3C起草和發(fā)布,也有一些是其他標準組織制訂的標準,比如ECMA(European Computer Manufacturers Association)的ECMAScript標準。

 

初級階段

2007年10月,第一次接觸到Div+Css,這個詞語。憑著對互聯(lián)網(wǎng)的熱愛,深入的進行了一下了解,當初的感覺就是,哇塞,DIV布局好帥哦。把網(wǎng)頁分成了一塊一塊的了,不用像表格那樣復雜的進行嵌套來實現(xiàn)網(wǎng)站的布局。瘋狂的熱愛上了這門技術(shù),花了兩個星期的日夜練習,終于寫出了自己的第一個所謂的“DIV+CSS”頁面,網(wǎng)站除了DIV,Span,Img,A,UL,li標簽外。沒有多余的了,我想這就是所謂的入門吧……

成長階段

不斷的進行“DIV+CSS”布局,手寫代碼的能力越來越高了,發(fā)現(xiàn)原來布局是這么“簡單”后,靜下心學著去看其它高手的頁面,以及一些概念的東西,這時候才知道,原來所謂的“DIV+CSS”,還有另外的叫法,即“XHTML+CSS”,除了,DIV標簽外,還有其它能使頁面元素更有語義的標簽……嘗試著改變自己的“DIV習慣”,進一步的“標準化”,并嘗試承接頁面制作任務,通過大量的任務實踐,讓自己的水平,處理兼容性的程度上進一步提高。我想這就是所謂的像“標準”的成長階段吧……

現(xiàn)在階段

結(jié)構(gòu),表現(xiàn),行為相分離,網(wǎng)上的解釋已經(jīng)夠多了。自己現(xiàn)在也有了自己的理解。我們所看到的網(wǎng)頁,就好比一座高樓大廈,地基,橫梁,樓梯,水管,空間,好比我們頁面中的標簽(結(jié)構(gòu))。房子建好了。裝修公司按照房子進行裝修,同一棟大樓,很多同樣的房子,但是可以裝修出不同的風格,這就是我們頁面中的CSS(表現(xiàn))。至于JS,我不知道這樣的比喻是否恰當,大廈里每家都要用水和電,通過物業(yè)的控制,可以控制是否給某家用戶(點)供水電,我想這就是所謂的行為吧。

做頁面,首先要對效果圖進行分析,分析過后,要認真布局,就像修房子一樣,地基沒打好,以后遲早會垮掉……要考慮到該布局的向后延展性……以后我要在這里添加或隱藏掉一個BOX,是否會大面積修改頁面。

地基打好了,CSS寫起來也順暢了,關于CSS的寫法,能合并簡寫的地方就盡量去做,還要考慮每個瀏覽器對CSS的解釋。深刻理解“盒模型”,減少不必要的Hack。

關于JS,由于我現(xiàn)在還不能自己寫JS,只能從理解上來想一想,讓所有的瀏覽器能夠兼容,這是首要的,其次,簡寫代碼,用最簡單的方法實現(xiàn)同樣的效果,但是,一定要考慮瀏覽器,用戶的機器性能等因素,不要做過多的算法運算和遍歷。以免對用戶造成不必要的后果。

頁面優(yōu)化,現(xiàn)在正在往這方面學習,合理使用標簽,CSS分離,背景融合,減少Http請求數(shù),頁面中的圖片能減小體積就要減小……
多多總結(jié)別人和自己的經(jīng)驗,掌握一些小技巧,小技巧可以讓你用最簡單的辦法,實現(xiàn)你用復雜方法(結(jié)構(gòu))實現(xiàn)的東西,也可以減少代碼量……

其它,用戶體驗,我想這也是一門很深奧的學問吧,我們所做的這么多,就是要給用戶帶來最大的方便,合理的布局讓用戶賞心悅目,優(yōu)化頁面讓用戶訪問速度達到最佳,當然還有很多酷炫的“行為”,可以留住用戶……等等
最后說一下,不需要盲目的去追求所謂的“標準”,什么W3C驗證阿,完全不需要,個人覺得,能給用戶和網(wǎng)站帶來最好效果和體驗的,才是最佳的 :)
以上是本人在學習中對web標準化的理解,難免有錯誤和遺漏,也是想起什么就說什么,請見諒……現(xiàn)在還在不斷學習中……

[教程作者:admin]
免責聲明:本站文章系圖趣網(wǎng)整理發(fā)布,如需轉(zhuǎn)載,請注明出處,素材資料僅供個人學習與參考,請勿用于商業(yè)用途!
本文地址:http://m.likemindfilms.com/tutorial/yj1552.html
設計人眼中的《喬布斯傳》:那些樸素的設計美原理
設計師的逆襲
圖趣網(wǎng)微信
建議反饋
×