我說的是同一主機同一域名的網站如何同時適配PC和移動設備(根據終端的不同呈現相應的內容)。


分情況。

簡單小網站,不十分注重用戶體驗-》響應式。

大、複雜網站,同時注重用戶體驗-》後端判斷渲染不同模板輸出 or 跳轉。


響應式

嗯,也就是問題標籤上的「Responsive web design」

這方面的資料有很多,題主自己搜一下?算了,我把我平時的積累發出來一點。

Media Queries

http://zhannei.baidu.com/cse/search?s=10994702955876242907entry=1q=%E5%93%8D%E5%BA%94%E5%BC%8F乾貨!如何在響應式網頁中安置和處理圖片及視頻折騰響應式布局設計談響應式web設計代碼實現


兩種方法:1. 響應式,只做一套前端模板,同時兼容PC和移動設備,但是對設計和前端開發的要求都比較高,而且複雜的網站不適用。2. 做兩套前端模板,服務端判斷設備類型,渲染不同的模板,對技術的要求比做響應式要低。除非網站的頁面都很簡單,不然不建議做響應式。目前國內的大型網站極少有做響應式的。
行業術語 叫 響應式布局, 大眾叫法叫——移動適配。 本質都是基於css3多媒體查詢技術來實現的。

找一家專門做前端開發的公司,例如我們(切圖網),進行移動適配開發就可以實現了。

路友同行-首頁適配後的效果是這樣,拿手機訪問網址即可看到效果。

響應式布局比較多,目前用的前端框架是bootstrap

我們最新給客戶做的一套高端定製官網,就是運用此技術:

北京電滿滿科技有限公司?

www.chargefull.cn圖標銀河航天?

www.yinhe.ht圖標

其中也做過網站也是複雜的社區形式的,完全沒問題有需求的可以聯繫!~

響應式,Bootstrap框架可以實現,只做一套前端模板,同時兼容PC端和移動端設備,但是對設計和前端開發的要求都比較高,而且複雜的網站不適用。具體操作比較複雜,你可以看一下這個教程:

下載Bootstrap - 前端學習教程- 前端-前端開發-前端工程師?

book.itheima.net圖標
其實利用user agent區分移動和pc成本更低,有時候響應試的開發成本高於兩個獨立
響應式設計。根據不同尺寸(或者說是臨界點:最好以內容為臨界點)來展示不同的界面效果。從而達到各個設備的瀏覽都具有用戶體驗。
你首先搞懂兩個很重要的概念: viewport和媒體查詢
推薦閱讀:
相关文章