soworkworkwork的部落格

網站的PC端和WAP端都注重層次結構和排版佈局，這是用戶方便瀏覽體驗的重要操作。 在網站製作過程中，我們必須注意兩點。 一是頁面混亂，主次不清，樣樣醒目； 第二，背景干擾了用戶的瀏覽。 這直接干擾了用戶瀏覽網站的視覺，這必須大大提高網站跳出率。

PC側佈局

1 將頁面劃分為不同的區域，因為它允許用戶快速確定哪些區域是重點，哪些模塊內容不是用戶需要的。

例如，網站部分不清晰，這大大降低了用戶的瀏覽體驗。

2 創建清晰直觀的頁面層次結構； 越重要越突出，； 邏輯相關的內容也應該是視覺相關的。

比如頁面層次不清晰，相當於頁面邏輯不流暢，不符合要求。

三。 以嵌套管道直觀地顯示依賴項。

例如，網站級嵌套混亂，用戶無法找到相應的資訊，不符合要求。

PC側佈局程式碼的應用：

1 表格佈局：通過表格元素將頁面空間劃分為多個儲存格，將文字或圖片等元素放入儲存格，隱藏表格邊框，實現佈局。 這種佈局方法也稱為傳統佈局。 現時，它主要用於EDM（廣告郵件中的頁面），而不是主流的佈局方法。

2 HTML+CSS佈局（DIV+CSS）：主要使用CSS樣式設定來佈局文字或圖片等元素。 它需要CSS框模型、框類型、CSS浮動、CSS定位和CSS背景影像定位等知識。 它比傳統的佈局更複雜。 現時，它是主流的佈局管道。

表格佈局和HTML+CSS佈局（DIV+CSS）的優缺點：

表格佈局：

優點：佈局簡單，速度快，相容性好。

缺點：修改不方便，需要重新調整，工作量大。

DIV+CSS：

優點：佈局靈活，修改方便。

缺點：需要考慮平臺的相容性，對生產人員的技能要求高。