怎樣做一個響應(yīng)式網(wǎng)站才專業(yè)

網(wǎng)站建設(shè)站建設(shè)領(lǐng)域里策劃了近20年的站長來說，對網(wǎng)站設(shè)計行業(yè)認真仔細分析過響應(yīng)式網(wǎng)站，其實響應(yīng)式有許多優(yōu)點，在這里就不列舉了，網(wǎng)絡(luò)上有許多關(guān)于這方面的介紹，今天重點給大家講一下響應(yīng)式網(wǎng)站的幾個缺點。
首先我們來認識下，什么是響應(yīng)式網(wǎng)站？
響應(yīng)式網(wǎng)站： 最近幾年大眾對于響應(yīng)式網(wǎng)站的建設(shè)是越來越熱衷了，那么建設(shè)響應(yīng)式網(wǎng)站是從哪里開始的，現(xiàn)在的情況是怎么樣的，未來又會有怎樣的發(fā)展呢，這篇就帶著大家一起來了解一下響應(yīng)
最近幾年大眾對于響應(yīng)式網(wǎng)站的建設(shè)是越來越熱衷了，那么建設(shè)響應(yīng)式網(wǎng)站是從哪里開始的，現(xiàn)在的情況是怎么樣的，未來又會有怎樣的發(fā)展呢，這篇就帶著大家一起來了解一下響應(yīng)式網(wǎng)站的前世今生。
一、起源
從時間上來看，可以說的上是響應(yīng)式網(wǎng)站起源的時間點其實并不久遠，最早是來自于一個名叫伊桑的人在2010年撰寫的一篇關(guān)于網(wǎng)站設(shè)計的文章，在這篇文章中伊桑提出了使用流動布局，媒介查詢以及彈性圖片這三種工具就能建設(shè)一個能適應(yīng)不同屏幕的網(wǎng)站。
在傳統(tǒng)的網(wǎng)站設(shè)計中，對于顯示這一方面都是用像素這個單位來進行標示的，而在伊桑的文章中提出除了像素以外還可以使用百分比等方式來標示，這樣就能使網(wǎng)站具備靈活的布局。使用媒介查詢這種工具可以幫助網(wǎng)站查詢到使用設(shè)備包括分辨率在內(nèi)的多種屬性信息，布局變得彈性后，網(wǎng)頁中的圖片也要變得有彈性，然后還可擴大至圖標，視頻等范圍。
二、現(xiàn)狀
如今，互聯(lián)網(wǎng)在移動設(shè)備上的使用變得越來越多，這也使得這篇文章提出的建設(shè)響應(yīng)式網(wǎng)站的方法越來越得到大眾的認可。這既是由于環(huán)境這一外部因素的快速發(fā)展，也是由于響應(yīng)式網(wǎng)站的建設(shè)正能滿足來自內(nèi)部的需求。
目前建設(shè)響應(yīng)式網(wǎng)站的方式存在兩種，一種是匯總比較主流的設(shè)備的硬件信息，根據(jù)這些信息設(shè)計出多種布局的樣式，再分別進行投射。另一種則是不必看設(shè)備的硬件信息，只關(guān)注內(nèi)容，對內(nèi)容進行設(shè)計和布局，由內(nèi)容來決定應(yīng)該如何進行呈現(xiàn)。
響應(yīng)式網(wǎng)站的四大缺陷---響應(yīng)式網(wǎng)站就是一個很大很大的坑。那么如何理解響應(yīng)式網(wǎng)站呢，怎么樣建設(shè)響應(yīng)式網(wǎng)站呢，響應(yīng)式網(wǎng)站和自適應(yīng)網(wǎng)站有什么不同呢?
今天想要講的是響應(yīng)式網(wǎng)站四個致命缺陷：
1、就用戶體驗度來講響應(yīng)式網(wǎng)站做得并不到位
響應(yīng)式網(wǎng)站設(shè)計基本原則是：自動識別屏幕尺寸并做出相應(yīng)調(diào)整的網(wǎng)頁設(shè)計，頁面布局和展示的內(nèi)容可能會隨著屏幕尺寸變化而有所變化。響應(yīng)式布局不管使用什么設(shè)備都是在服務(wù)器把數(shù)據(jù)推送到瀏覽器后，腳本或CSS自行檢測設(shè)備屏幕大小后執(zhí)行對應(yīng)的樣式表內(nèi)容，并且一直通過本地腳本在監(jiān)聽屏幕大小的變化，隨時做出樣式響應(yīng)的變化。
比如在1280x768分辨率的電腦屏幕上和在320x240分辨率的手機屏幕上顯示一樣的內(nèi)容的話，內(nèi)容都擠一起無法看清楚。所以響應(yīng)式設(shè)計是選擇把部分內(nèi)容隱藏來解決這個問題。但這樣的話頁面的表現(xiàn)效果就不是那么好了，用戶的交互體驗也非常不友好。
比如下面這個響應(yīng)式網(wǎng)站，右邊移動端和左邊電腦端相比，把產(chǎn)品展示模板隱藏了，這對用戶體驗是非常不友好的。而且左邊明顯不符合我們平?？吹降囊苿佣说脑O(shè)計。同一個網(wǎng)站PC端和移動端風格差異太大，感覺就是兩個沒有任何聯(lián)系的網(wǎng)站。
如果是單獨設(shè)計PC站和移動站，就能整體考慮規(guī)劃，設(shè)計成一個整體風格類似功能相同的網(wǎng)站，避免像上面這種顯示上的突兀
從天貓的做法可以看到：移動站界面是大家熟悉的和流行的，交互上更接近APP的UI風格。
2、響應(yīng)式網(wǎng)站代碼因為不精簡所以對網(wǎng)站優(yōu)化無利
百度對移動站和PC站的關(guān)鍵詞處理策略不盡相同。如果網(wǎng)站設(shè)計成響應(yīng)式， 所有設(shè)備訪問同一份代碼，這就非常不利于百度關(guān)鍵詞優(yōu)化。
而且百度的搜索排名是區(qū)分移動站和PC站的。如果PC站和移動站是獨立分開的，那么移動站所做的百度排名，不會影響PC站的排名，PC站的百度優(yōu)化也可以獨立于移動站進行。
從商業(yè)推廣的角度來看的話，移動站和PC站分開單獨做比設(shè)計成一個統(tǒng)一的響應(yīng)式網(wǎng)站會更好。
3、響應(yīng)式網(wǎng)站同樣因為代碼過多會導致網(wǎng)站打開速度慢
響應(yīng)式網(wǎng)站的實現(xiàn)原理通常是通過css或js來控制部分內(nèi)容顯示或不顯示，從而使得網(wǎng)站在移動設(shè)備上看起來也正常。但通過代碼不顯示的內(nèi)容其實依然還在頁面上，只是表面看不見（不顯示）了而矣，所以瀏覽器依然還會加載這部分看不見的網(wǎng)頁代碼。也就是說響應(yīng)式網(wǎng)站要比單獨的非響應(yīng)式網(wǎng)站加載更多的數(shù)據(jù)，從而造成流量增加，而且網(wǎng)頁的打開速度變慢。
比如說單獨設(shè)計一個移動端網(wǎng)站，整個頁面大小可能是100kb，如果設(shè)計成響應(yīng)式網(wǎng)站（PC站和移動站代碼合在一起）則頁面大小可能就是400kb甚至更多。導致打開響應(yīng)式網(wǎng)站的時間相比非響應(yīng)式會慢很多，尤其是手機在用2G、3G網(wǎng)絡(luò)上網(wǎng)的情況下更明顯。
4、響應(yīng)式網(wǎng)站因為兼容性而存在，但兼容性恰恰又是他的一個缺點
響應(yīng)式網(wǎng)站算是比較新的技術(shù)了，運用了很多html5的特性，只有瀏覽器的高版本才支持這些html5特性，尤其是微軟的IE瀏覽器對這一塊的支持比較弱。
當然我們并不能完全去否定響應(yīng)式網(wǎng)站的存在,大家可以閱讀一下文章《官網(wǎng)為什么要做響應(yīng)式？》。畢竟如果你為了去適應(yīng)所有的瀏覽器而去做那么多網(wǎng)站也是不現(xiàn)實的事情。

名稱欄目：怎樣做一個響應(yīng)式網(wǎng)站才專業(yè)
文章網(wǎng)址：http://www.muchs.cn/news/51465.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營銷seo公司；服務(wù)項目有做網(wǎng)站、響應(yīng)式網(wǎng)站等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)