摘要:一背景介紹漸進增強和優雅降級這兩個概念是在出現之后火起來的。二概念理解漸進增強漸進增強一開始就針對低版本瀏覽器進行構建頁面,完成基本的功能,然后再針對高級瀏覽器進行效果交互追加功能達到更好的體驗。
一、背景介紹
漸進增強和優雅降級這兩個概念是在 CSS3 出現之后火起來的。由于低級瀏覽器不支持 CSS3,但是 CSS3 特效太優秀不忍放棄,所以在高級瀏覽器中使用CSS3,而在低級瀏覽器只保證最基本的功能。二者的目的都是關注不同瀏覽器下的不同體驗,但是它們側重點不同,所以導致了工作流程上的不同。
二、概念理解 2.1 漸進增強漸進增強(Progressive Enhancement):一開始就針對低版本瀏覽器進行構建頁面,完成基本的功能,然后再針對高級瀏覽器進行效果、交互、追加功能達到更好的體驗。
2.2 優雅降級優雅降級(Graceful Degradation):一開始就構建站點的完整功能,然后再針對低版本瀏覽器進行兼容。比如一開始使用 CSS3 的特性構建了一個應用,然后逐步針對各大瀏覽器進行 hack 使其可以在低版本瀏覽器上正常瀏覽。
三、觀點不同 3.1 漸進增強漸進增強的觀點:應關注于內容本身。內容是我們建立網站的誘因。有的網站展示它,有的則收集它,有的尋求,有的操作,還有的網站甚至會包含以上的種種,但相同點是它們全都涉及到內容。這使得漸進增強成為一種更為合理的設計范例。
3.2 優雅降級優雅降級的觀點:應針對最高級、最完善的瀏覽器來開發網站。而將那些被認為“過時”或有功能缺失的瀏覽器下的測試工作安排在開發周期的最后階段,并把測試對象限定為主流瀏覽器(如 IE、Mozilla 等)的前一個版本。在這種設計范例下,舊版的瀏覽器被認為僅能提供“簡陋卻無妨 (poor, but passable)” 的瀏覽體驗。你可以做一些小的調整來適應某個特定的瀏覽器。但由于它們并非我們所關注的焦點,因此除了修復較大的錯誤之外,其它的差異將被直接忽略。
四、示例案例如下的兩段代碼的書寫順序,表明了漸進增強和優雅降級開發的重點不同。
前綴 CSS3(-webkit- / -moz- / -o-*)和正常 CSS3 在瀏覽器中的支持情況:
很久以前:瀏覽器前綴CSS3和正常CSS3都不支持;
不久之前:瀏覽器只支持前綴CSS3,不支持正常CSS3;
現在:瀏覽器既支持前綴CSS3,又支持正常CSS3;
未來:瀏覽器不支持前綴CSS3,僅支持正常CSS3。
4.1 具體說明漸進增強的寫法,優先考慮老版本瀏覽器的可用性,最后才考慮新版本的可用性。而在現在前綴CSS3和正常CSS3都可用的情況下,正常CSS3會覆蓋前綴CSS3。
優雅降級的寫法,優先考慮新版本瀏覽器的可用性,最后才考慮老版本的可用性。而在現在前綴CSS3和正常CSS3都可用的情況下,前綴CSS3會覆蓋正常的CSS3。
五、如何選擇 5.1 分析使用你客戶端程序的版本比例(1)若低版本用戶居多,則優先采用漸進增強的開發流程;
(2)若高版本用戶居多,則為了提高大多數用戶的使用體驗,那當然優先采用優雅降級的開發流程。
5.2 多數大公司采用漸進增強的方式業務優先,提升用戶體驗永遠不會排在最前面。
例如:新浪微博這種擁有億級用戶的網站,絕對不可能為了追求某個特效而不考慮低版本用戶,一定是確保低版本、高版本都可用的情況下,再去漸進增強,采用新功能給高版本用戶提供更好的用戶體驗。
六、總結其實優雅降級和漸進增強都是網站開發的加分項,最重要的還是保證盡可能多的用戶可以正常訪問網站,在此之后再考慮降級的極端情形和現代瀏覽器的體驗增強。
閱讀更多
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/115825.html
摘要:發生在很久以前的及更老的瀏覽器向過渡時期。數據始終在同源的請求中攜帶即使不需要,會在瀏覽器和服務器間來回傳遞。存儲大小數據大小不能超過。與上面問題相連,比也是明智的選擇。表現與結構相分離。兩種設計思想是有不同的考慮。 前言: 吾生也有涯,而知也無涯,以有涯隨無涯,殆己————莊子 閱讀本文前請做好以下心理準備:本系列文章將不定期更新。本系列文章不是很嚴謹。 前端面試之HTML篇 Pa...
摘要:而漸進增強和優雅降級兩種不同的開發流程,也是在我們項目初期做調研選型時會考慮的一個點。二者區別漸進增強和優雅降級只是看待同種事物的兩種觀點。漸進增強和優雅降級都關注于同一網站在不同設備里不同瀏覽器下的表現程度。 作為一名前端開發人員,最頭疼的莫過于瀏覽器兼容。遠古時期萬惡的IE6,到現在CSS3不兼容的IE7/8.為了保證不同版本瀏覽器都有共同或更優化的用戶體驗,前端搬磚的我們不得不與...
摘要:而漸進增強和優雅降級兩種不同的開發流程,也是在我們項目初期做調研選型時會考慮的一個點。二者區別漸進增強和優雅降級只是看待同種事物的兩種觀點。漸進增強和優雅降級都關注于同一網站在不同設備里不同瀏覽器下的表現程度。 作為一名前端開發人員,最頭疼的莫過于瀏覽器兼容。遠古時期萬惡的IE6,到現在CSS3不兼容的IE7/8.為了保證不同版本瀏覽器都有共同或更優化的用戶體驗,前端搬磚的我們不得不與...
摘要:而漸進增強和優雅降級兩種不同的開發流程,也是在我們項目初期做調研選型時會考慮的一個點。二者區別漸進增強和優雅降級只是看待同種事物的兩種觀點。漸進增強和優雅降級都關注于同一網站在不同設備里不同瀏覽器下的表現程度。 作為一名前端開發人員,最頭疼的莫過于瀏覽器兼容。遠古時期萬惡的IE6,到現在CSS3不兼容的IE7/8.為了保證不同版本瀏覽器都有共同或更優化的用戶體驗,前端搬磚的我們不得不與...
閱讀 1892·2021-11-23 09:51
閱讀 1534·2021-11-19 09:40
閱讀 3207·2021-11-11 11:01
閱讀 1104·2021-09-27 13:34
閱讀 1835·2021-09-22 15:56
閱讀 2121·2019-08-30 15:52
閱讀 1060·2019-08-30 14:13
閱讀 3473·2019-08-30 14:10