漸進增強和優雅降級有什麼區別

零下一度
發布: 2017-06-28 15:30:51
原創
1559 人瀏覽過

之前在看一些css3效果demo的時候,發現有些寫css3屬性時,相容性的寫法順序不太一樣,例如transition屬性,有些把transition放在前面有些是放在後面,當然這也有可能包含了coder個人的習慣或是強迫性>"<,例如下面這兩種:

#.transition{
 -webkit-transition: all .5s;
    -moz-transition: all .5s;
      -o-transition: 將;

.transition{        transition: all .5s;
    -o-transition: all .5s;   -moz-transition: all .5s; -webkit-transition: all .5s; }

有前綴的排列應該只是為了整齊(還是代表了對瀏覽器的喜好程度)?但transition放在前面還是後面卻引申了兩個概念:優雅降級和漸進增強。

優雅降級和漸進增強印像中是隨著css3流出來的概念。由於低階瀏覽器不支援css3,但css3的效果太優秀不忍放棄,所以在進階瀏覽中使用css3而低階瀏覽器只保證最基本的功能。咋一看兩個概念差不多,都是在關注不同瀏覽器下的不同體驗,關鍵的區別是他們所專注的內容,以及這種不同造成的工作流程的差異。

 

什麼是漸進增強(progressive enhancement)、優雅降級(graceful degradation)呢?

  漸進增強 progressive enhancement:針對低版本瀏覽器進行構建頁面,保證最基本的功能,然後再針對高級瀏覽器進行效果、交互等改進和追加功能達到更好的用戶體驗。

  優雅降級 graceful degradation:一開始就建立完整的功能,然後再針對低版本瀏覽器進行相容。

  區別:優雅降級是從複雜的現狀開始,並試圖減少用戶體驗的供給,而漸進增強則是從一個非常基礎的,能夠起作用的版本開始,並不斷擴充,以適應未來環境的需要。降級(功能衰減)意味著往回看;而漸進增強則意味著朝前看,同時確保其根基處於安全地帶。

 

「優雅降級」觀點

「優雅降級」觀點認為應該針對那些最高級、最完善的瀏覽器來設計網站。而將那些被認為「過時」或有功能缺失的瀏覽器下的測試工作安排在開發週期的最後階段,並將測試對象限定為主流瀏覽器(如 IE、Mozilla 等)的前一個版本。

在這個設計範例下,舊版的瀏覽器被認為僅能提供「簡陋卻無妨 (poor, but passable)」 的瀏覽體驗。你可以做一些小的調整來適應某個特定的瀏覽器。但由於它們並非我們所關注的焦點,因此除了修復較大的錯誤之外,其它的差異將被直接忽略。

 

「漸進增強」觀點

「漸進增強」觀點則認為應著重於內容本身。

內容是我們建立網站的誘因。有的網站展示它,有的則收集它,有的尋求,有的操作,還有的網站甚至會包含以上的種種,但相同點是它們全都涉及到內容。這使得「漸進增強」成為更合理的設計範例。這也是為什麼它立即被 Yahoo! 所採納並用以構建其「分級式瀏覽器支援 (Graded Browser Support)」策略的原因所在。

以上是漸進增強和優雅降級有什麼區別的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板