現(xiàn)在很多網站都使用了自適應網頁設計(Response-Web-Design),以滿足龐大的移動端用戶群的需要。但是在技術上設計了自適應的網頁之后,出于SEO的考慮,你還要照顧到如何對百度更友好,即告訴百度“我是自適應頁面”,方便百度進行識別校驗。
自適應網頁設計
瀏覽器對自適應識別校驗代碼
在自適應網頁設計中,我們使用meta標簽來告訴瀏覽器網頁的自適應規(guī)則。如:
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=yes" />
這個meta,user-scalable=yes 是聲明網頁可以縮小放大。
通用搜索引擎對自適應識別校驗代碼
<meta http-equiv="Cache-Control" content="no-transform" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
這兩個meta,no-siteapp和no-transform,是告訴搜索引擎不要把網頁轉碼。
自適應網站設計對百度友好的關鍵
其實,使用上面兩個meta聲明,百度就能識別自適應網頁了。
不過,為了對百度更友好,讓百度更方便識別校驗,我們要再添加一個meta標簽。
方法也很簡單,只要在上面viewport標簽下面再添加一個applicable-device標簽就行:
<meta name="applicable-device" content="pc,mobile">
這個meta標簽,表示頁面同時適合在移動設備和PC上進行瀏覽。
不是所有網站都適合自適應設計
自適應網頁設計(Responsive Web Design)是指可以自動識別終端設備屏幕的大小從而做出相應調整的網頁設計方法。這種網頁設計方法完美解決了如何在不同大小的網絡設備上呈現(xiàn)同樣的網頁效果。大家公認自適應至少有4個好處:提升用戶體驗;PC端和移動端SEO保持一致;避免重復內容和出錯內容;鏈接統(tǒng)一。
而自適應比較明顯的缺陷是,開發(fā)成本比較高,尤其是要構建包含額外編程的復雜的自適應網站,所需的時間會比較長。如果網站需求較簡單,有許多開源模板可供選擇。
對于已經比較成熟PC網站來說,如果要實現(xiàn)全站的自適應,有可能需要推掉原來所有的代碼進行重構,時間和技術成本都比較大,而且如果一個網站有多個portal(入口),會大大增加架構設計的復雜度,所以現(xiàn)在有很多網站只在移動端實現(xiàn)了響應式布局設計。
您可能對如下文章也感興趣