web標準親身體驗

剛開始接觸網頁製作的時候，對許多概念都不很明白，其實現在好多也只是有一定瞭解，不一定能解釋清楚，講清楚。不過，半年的標準化工作經曆讓我多少有了點小小想法。原來製作頁面的時候不求過程只求結果，只要能踉踉蹌蹌的在瀏覽器中大概正常顯示就萬幸了，哪敢奢求什麼標籤合理分配，樣式表書寫規範之類的，不是不想做好只因心有餘而力不足啊。 對自己做的東西總是橫豎不順眼，到處尋醫問藥，時間不斷的流去，而我也漸漸的成長，漸漸的有了些體會，明白了前輩們些經驗之談，自己也悟出了些道理。

   我平時總是先對著設計圖，劃分頁面大概結構，並把每一塊內容所用的標籤盡量在腦海裡過一遍，選擇標籤比較注重實際含義，例如把div用於外層結構定位，p,h1,h2,h3等用於文本，b,strong也經常用到，列表標籤的使用頻率也蠻高的，尤其是dl,dt,dd，你看，dl 可以用來做容器，dt做標題，dd存放一條條的文本。總之，盡量增加有意義的標籤，盡量避免滿屏的div,span和泛濫的class。尤其在div的大海中為了改變一個屬性而不得不特意寫個class或id ，那種感覺真的極其不爽。要讓頁面的html結構合理，最大限度的為樣式表瘦身。那就要對整個網站，在把設計稿轉換成代碼之前必須整個頁面要有一個很好的規劃，要有比較強的整體把握能力。我個人採用的是用外層容器固定內部流動內容的模式，我自己瞎說的模式，呵呵，就是頁面上的每個版塊的最外層控制寬高大小，寫在id中，而把容器的共同屬性寫在class中，例如容器有一像素邊框等，這樣就通過id+css的方式將版塊的大小固定了，這樣做有很大的好處，在減少容器的共同屬性被書寫很多遍的同時，也不會失去對容器內部要實現個別屬性的要求。例如兩個或多個版塊極為相似，僅有字型大小或者顏色不同，就可以用選擇許可權來控制，因為外層用的是div是獨一無二的。外層容器好了，就剩內部元素了，內部存放文字和圖片之類的東西，把它做成流動的，就是不固定寬高且能自動換行，讓他受外層容器控制。總體感覺就是把整個網站拆成幾個頁面，接著把頁面拆成外層容器和內部流動元素，感覺就是把頁面當作生產產品一樣拼起來。噢，差點忘了，在定義標籤的初始樣式時，可以對自己用到的都分類設不同初始值，例如把h1用於14px加粗的文本，把h2用於14px不加粗的文本，把h3用於12px加粗的文本，h4用於12px不加粗的文本等等類似的，先把不同標籤的功能分配好再付預設值。要想不浪費標籤，為樣式表瘦身就得精打細算。

  最後，想說的是結構，樣式，行為要盡量分離，即html,css,js三者不要互相滲透，來個你中有我，我中有你的。那樣在寫的時候可能有些方便，但是後期修改的時候就要暈了，我親身體會了在js中尋找css的痛苦。先這樣啦，亂說一通。