2013-05-03 69 views
0

我想弄清楚如何簡化響應式設計的開發流程。標準的方法是首先使用從移動設備到桌面尺寸的媒體查詢來設計移動設備。首次使用移動設備和禁用的響應式設計javascript

我看到的問題是支持IE7和IE8。每個人都想要的解決方案是使用response.js。那麼支持那些禁用JavaScript的呢?有沒有我沒有看到的東西?

編輯:我知道它的一個超級百分比的用戶,禁用JS。這是這個項目的要求。

+1

除非你確實需要時才IE7,我只想堅持到IE8 +,以緩解疼痛。讓我們向前移動網絡。 – elclanrs 2013-05-03 05:24:04

回答

2

手機首先沿着的路徑優美降級。簡單地說,「我們只提供這種支持,或者你什麼也得不到」。而對於較老的瀏覽器,你什麼也得不到。這是腳本嘗試執行的polyfills,修補程序和變通方法的路徑。

另一方面,漸進增強只能滿足瀏覽器的所有基本功能。這就像「我們支持你所支持的最新的一切」。這就是你想要做的,你應該做什麼。

所以我們來利用CSS級聯的事實。最初使用固定或流體佈局,然後使用響應式佈局。對於不理解媒體查詢的瀏覽器將簡單地忽略它,讓您的固定或流暢風格閃耀。

移動瀏覽器支持媒體查詢或者JS最有可能打開。 Wap瀏覽器也可以通過流暢的佈局快樂地生活。


*對於JS,95%的用戶在JS上。另外5%的人認爲

  1. 有過時的瀏覽器(馬賽克?)
  2. 都沒有(爬蟲,代理,刮刀)桌面瀏覽器
  3. WAP瀏覽器(除了像Opera Mini的一些瀏覽器,其運行幾個JS上載)
  4. 和偏執的人害怕JS。

*現在,有多少人是其實是一個瀏覽器?最有可能的#3和#4。它是IE的機會是什麼? 1/3?爲了使用純粹的CSS,沒有JS方法,達到5%人口的一半的概率是多少?

不要依賴可能存在的事實。那些是在現實世界中只有1億分之一的極端情況。因爲來自UX的人會說:人口統計

*誇大的估計

+0

這就是我想的,但我不花費額外的時間來創建一個單獨的樣式表:/ – kel 2013-05-03 05:33:20

0

現在是2013年。如果某人有js殘疾人,他們知道他們的網絡體驗會很糟糕。不只是在你的網站上,而是在任何地方。它不到1%的用戶,所以不要擔心。您可以/應該基本上認爲js已啓用。

0

只是要在桌面大小的固定寬度的版本較舊IE的使用的ie.css片條件註釋。 (例如http://html5boilerplate.com/就是一個很好的例子)

Respond.js通常運行速度非常慢,而且要調試的話比「傳統的固定寬度」IE 7,8要困難得多。所以支持更多的工作(即使它不是支持非js用戶的項目需求的一部分)。

從終端用戶的角度來看它。如果我需要藉助運行IE 7的奶奶米色塔,我寧願有一個更快,固定寬度的網站,然後是一個錯誤的,響應速度緩慢的網站。而且這些都是老用戶用來固定寬度網站的計算機。

另外考慮調查使用SASS來幫助斷點瘋狂。我最喜歡的mixin是「Breakpoint」。查看他們的文檔,這裏涉及支持不支持媒體查詢的瀏覽器。簡而言之,您將一個變量添加到媒體查詢中,以查看「導出到我的IE.css = true」,那麼這些變量將成爲ie.css表的核心組件,並且定製IE工作量也會減少。

https://github.com/Team-Sass/breakpoint/wiki/No-Query-Fallbacks