結構要盡量簡潔，盡量減少結構中的嵌套，不要為了實現(xiàn)某種樣式添加多余的空標簽。頁面結構好壞直接會影響到css代碼的質量，也會影響js和后臺的開發(fā)，還會影響到以后功能的擴展和代碼的優(yōu)化。確實html頁面沒有js那么多復雜的交互，也不需要和后臺數(shù)據(jù)打交道，但并不能代表就沒有技術含量，也不是人人都能做好的。固然html5對于標簽的相互嵌套體現(xiàn)了很好的包容性，即使標簽沒有閉合，或是inline元素中包含一堆block元素也不會有題目，但是為了養(yǎng)成良好的習慣仍是盡量做到嚴格遵循xhtml的規(guī)范。

頁面中直接引用的圖片盡可能少的縮放，非常影響頁面的渲染速度；盡可能少的使用前端技術控制圖像顯示大小，對用戶不可見的部門就是鋪張帶寬，鋪張錢，頁面的渲染速度也肯定會受到影響，影響用戶體驗；在知道圖片寬高的情況下盡量在img中加上寬高，減少頁面reflow造成的速度損耗。

靜態(tài)圖片一定要小，建議存成png8格局，在不影響圖片的顯示質量下，可以選擇128色或是更低的顏色輸出圖片。在進行合圖的時候，盡量把顏色相近的圖標放到一起，可以減少圖片的大小。下面我們就講講頁面開發(fā)，開發(fā)中需要事項和常碰到的題目吧。現(xiàn)在html5添加了更多的語義化標簽，像header，section等，大膽勇敢的使用吧。

標簽盡量語義化，能夠讓代碼更加清楚。

首先分析效果圖，細節(jié)上是否和站內風格同一；設計的元素是否便于實現(xiàn)；元素是否能復用。當然有的色彩比較豐碩的圖片，存成jpg格局的更小，豈非你會非選png的嗎？存儲完后圖片還能用一些壓縮工具進行無損壓縮（如：PNGGauntlet）。這些都是為更好的布局和精簡css代碼做的必要工作。

背景圖是通過樣式在頁面上輸出，會在頁面中產生哀求，延長頁面的渲染時間，為了解決這個題目，可以把類似的圖片進行合并，減少哀求數(shù)。

網頁設計公道布局很重要，猶如大廈的地基，大廈的高度再于地基是否牢固，公道的布局能有更好的擴展性。

前端頁面的工作很瑣碎，需要的不僅是基礎知識的扎實，知識面的廣泛，很重要的一點還要細心。

發(fā)頁面在良多人眼里很簡樸，大部門的人都會說不就是把效果圖變成網頁嘛，哪里需要那么多的時間，一點技術含量都沒有。有題目及時和產品職員進行溝通，避免開發(fā)過程中的頻繁修改，影響工期和代碼的質量。

圖片有幾點需要注意：
1、我們在使用背景圖做圖標的時候通常會在頁面加一個鉤子——img標簽。
2、如果你的工程已經上線，我們站內對靜態(tài)文件會有一個緩存機制。在開發(fā)過程中，經常會遇到修改圖片的情況，如果你修改后的圖片不更改文件名或是在樣式中更改引用該圖片的版本號，對于用戶而言，他們仍然看不到修改后的圖片。所以，一定要記得修改文件名。
3、避免過小的背景圖平鋪。
4、盡量將圖片上的文字提取出來用代碼實現(xiàn)，便于圖片的復用和日后文案的修改；