漸進增強和優雅降級

来源:http://www.cnblogs.com/elementzhao/archive/2017/06/04/6941196.html
-Advertisement-
Play Games

優雅降級(graceful degradation):一開始就構建站點的完整功能,然後針對瀏覽器測試和修複。 漸進增強(progressive enhancement):一開始只構建站點的最少特性,然後不斷針對各瀏覽器追加功能。優雅降級:使用優雅降級方案,Web站點在所有新式瀏覽器中都能正常工作,如 ...


優雅降級(graceful degradation):一開始就構建站點的完整功能,然後針對瀏覽器測試和修複。
漸進增強(progressive enhancement):一開始只構建站點的最少特性,然後不斷針對各瀏覽器追加功能。優雅降級:使用優雅降級方案,Web站點在所有新式瀏覽器中都能正常工作,如果用戶使用的是老式瀏覽器,則代碼會檢查以確認它們是否能正常工作。由於IE獨特的盒模型佈局問題,絕大多數Web設計師和開發者都通過專門的樣式表或針對不同版本的IE的hack實踐過優雅降級了;
使用優雅降級技術時,你必須首先完整的實現了網站,其中包括所有的功能和效果。然後再為那些無法支持所有功能的瀏覽器增加候選方案,使之在舊式瀏覽器上以某種形式降級體驗卻不至於完全失效。 漸進增強:從被所有瀏覽器支持的基本功能開始,逐步地添加那些只有新式瀏覽器才支持的功能。漸進增強是值得所有開發者採用的做法。漸進增強方案並不假定所有用戶都支持javascript,而總是提供一種候補方法,確保用戶可以訪問(主要的)內容。
使用漸進增強時,無需為了一個已成型的網站在舊式瀏覽器下正常工作而做逆向工程。首先,只需要為所有的設備和瀏覽器準備好清晰且語義化的HTML以及完善的內容,然後再以無侵入的方式向頁面增加無害於基礎瀏覽器的額外樣式和功能。當瀏覽器升級時,它們會自動地呈現出來併發揮作用。
想讓網站在任何環境下看起來都保持一致是不可能的,不管為此付出多少努力,結局依舊會令你失望。與其試圖讓IE看起來堪比年輕它十歲的瀏覽器,不如努力改善網站的可訪問性,或是進行更多的可用性測試,而不僅僅是讓頁面看起來更靚一點。

您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 今天敲代碼的時候,正好碰到這個問題. 與大家分享這個解決方法: 1/7 到bootstrap官方網站下載,對於我們開發者來說,直接下載編譯和壓縮後的CSS、JavaScript文件,另外還包含字體文件,但是不包含文檔和源碼文件。打開解壓包之後可以發現包含三個文件夾 css、fonts、js。這是最基 ...
  • 因為最近在搞百度地圖API的時候到了webpack的externals,才發現我之前都只是用webpack做一些搭建完項目後的“收尾工作”——即打包,而沒有把它納入到項目開發的“主體過程”中來,真是“物不盡其用”。於是就有了我今天的這篇文章。 本文提綱:1.複習webpack的知識 2.詳解webp... ...
  • 1、CSS定義 CSS 指層疊樣式表 (Cascading Style Sheets),是一種樣式表語言,用來描述 HTML 或 XML(包括如 SVG、XHTML 之類的 XML 分支語言)文檔的呈現。CSS 描述了在屏幕、紙質、音頻等其它媒體上的元素應該如何被渲染的問題。 2、為何使用CSS 網 ...
  • 在前面兩篇博客中,我們討論了Android中的事件分發的相關內容,那麼在本篇博客當中,我們就簡單探討一下html或javascript中的事件分發機制,併進行簡單的對比。 在前端中,對事件進行綁定有三種方式。 (1).在DOM中綁定。 (2).在腳本中綁定。 (3).通過監聽事件 綁定 而對於前兩種 ...
  • 一、apply,和call的用法。 先來一個與本次博文無關的東西,就是apply和call的用法。其實apply和call的用法都一樣,只是他們的傳參不一樣。apply是數組,而call是單獨的傳,類似枚舉。 1.列子一把arguments轉化為標準數組,可以使用push等方法。 2.如何把argu ...
  • HTML 一、簡介 1.HTML是超文本標記語言,標準通用標記語言下的一個應用,解釋性語言。 2.“超文本”就是指頁面內可以包含圖片、鏈接,甚至音樂、程式等非文字元素。 3.超文本標記語言的結構包括“頭”部分(英語:Head)、和“主體”部分(英語:Body),其中“頭”部提供關於網頁的信息,“主體 ...
  • 頭部 header 用於頭部 主要內容 main 用於主體內容(中部) 左側 main-left 左側佈局 右側 main-right 右側佈局 外套 wrap 用於最外層 導航條 nav 網頁菜單導航條 內容 content 用於網頁中部主體 底部 footer 用於底部 頭部 header 用於 ...
  • 【塊級標簽與行級標簽的區別】 1.塊級標簽: 預設寬度100%(獨占一行) 自動換行(右邊不能有任何東西) 可以使用css設置寬度高度 2.行級標簽: 內容寬度,由內容撐開(內容多寬,寬度就占多寬) 不會自動換行(從左往右依次排列) 【常見的行級標簽】 span(文本) img(圖片) em(強調) ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...