下面(mian)我就(jiu)給大家講解一下網(wang)頁(ye)頁(ye)面(mian)設計(ji)需要(yao)注意的一些基本要(yao)素。

一、版面(mian)設計(ji)相關：

1、文(wen)章內(nei)容頁(ye)/詳情頁(ye)，從標題開始(shi)到(dao)正(zheng)文(wen)內(nei)容結束，不要插入(ru)任何廣告；

2、禁止(zhi)加(jia)遮(zhe)屏(ping)廣(guang)(guang)告(gao)、彈窗廣(guang)(guang)告(gao)、底部懸浮廣(guang)(guang)告(gao)；

可以加面積(ji)極小的(de)置頂懸浮廣告。

3、一個網頁(ye)上最(zui)多只放一個引導APP下載的按鈕；

（參照百(bai)度移動(dong)搜索廣告(gao)白皮(pi)書(shu)3.0，對大幅廣告(gao)和強(qiang)制引(yin)導下載APP做了嚴格限(xian)制//ziyuan.baidu.com/college/documentinfo?id=1784）

4、主體(ti)(ti)內容（內容頁而言評論(lun)、分享、推薦等不視(shi)為主體(ti)(ti)內容）突出，盡量占據首屏，最好不要全部被大圖覆蓋。

5、頁面長(chang)度控制(zhi)不(bu)宜過長(chang)，不(bu)要(yao)超(chao)過3屏（個人感(gan)覺(jue)，僅供參考）

二(er)、內鏈結構相關：

1、一(yi)個文字title對應一(yi)個URL；

2、鏈接不要打在樣(yang)式上(shang)，要單獨加a，分別對應到(dao)相關的文字、圖片；

（一一對應的關系(xi)有利于提(ti)高內頁的權重以及與相關關鍵(jian)詞的對應度）

3、優化網站(zhan)分級結構，網頁主導(dao)航必不可少，且一定要用文字的形式。

PC站一定要有面包削(xue)導(dao)航；移(yi)動站可加(jia)面包削(xue)也可通(tong)過返(fan)回按鈕的形(xing)式。

4、控制頁面(mian)a的導(dao)出(chu)數量以(yi)及nofollow標簽的使用

（蜘蛛分配(pei)到每個頁面的權重是(shi)一定的，然后頁面權重會平均分配(pei)到下面每個a鏈接上，控制導(dao)出數量集中權重分配(pei)到需要引導(dao)的頁面上）

三、前端代碼相關(guan)

1、控制頁面(mian)的(de)大小，一個頁面(mian)最好(hao)不要超過100k 減少(shao)http請求提高網站的(de)加載速(su)度(du)。

圖片可以適當用Lazy Load Images延(yan)遲加載

2、少用JS

（蜘蛛不會抓取JS的內容，而且(qie)移(yi)動(dong)站目前采用MIP，也不支(zhi)持JS，需要(yao)提交組件(jian)百度(du)審核）

3、不(bu)用iframe嵌套

（蜘(zhi)蛛不抓取，極不利于優(you)化(hua)）

4、重(zhong)要(yao)的代碼(ma)放前面

（搜索引擎爬(pa)蟲是(shi)從左往右，從上到下(xia)進行抓取(qu)的）

5、TDK和H1一定要(yao)有(you)，是(shi)頁面(mian)最重(zhong)要(yao)的幾(ji)個標簽

一個頁面(mian)有且(qie)最多(duo)只能有一個H1

內容頁(ye)：正文(wen)標(biao)(biao)題用<h1>標(biao)(biao)簽，副(fu)標(biao)(biao)題用<h2>標(biao)(biao)簽，其它地方不隨(sui)便(bian)亂用 h 標(biao)(biao)簽；

首頁：可以打在logo上，再加上title屬性。

6、H2、H3等(deng)可(ke)以(yi)有，也(ye)可(ke)以(yi)沒有，同(tong)一個(ge)H2等(deng)標簽不(bu)要(yao)過(guo)多，最(zui)好(hao)不(bu)要(yao)超過(guo)4個(ge)

7、圖片(pian)img加上alt屬性，加了alt就不(bu)必加title了

（避免搜索引擎認(ren)為惡意優化）

8、在不影響頁面功能(neng)的情況下，可以盡量給a標簽加上title屬性

（可以更有利于蜘(zhi)蛛抓取(qu)信息）

9、<b>/<strong>不(bu)能大量使用

（加(jia)粗會被搜索引擎(qing)認為是強調作用(yong)，過(guo)多會被認為是作弊）

10、不要(yao)隱藏(zang)網頁(ye)內容(rong)