渐进增强

目录

  1. 1 什么是渐进增强
  2. 2 核心原则
  1. 3 支持和采用
  2. 4 辅助功能的好处
  1. 5 搜索引擎优化(SEO)的好处
  2. 6 批评与回应

    什么是渐进增强

    渐进增强是网站设计的一种策略,它首先强调核心网页内容。然后,此策略会在最终用户的浏览器/互联网连接允许的情况下,在内容之上逐步添加更细微差别和技术上严格的表示和功能层。此策略的建议优点是,它允许每个人使用任何浏览器或Internet连接访问网页的基本内容和功能,同时还为使用更高级的浏览器软件或更大带宽的用户提供页面的增强版本。

    该策略是先前的网页设计策略(称为优雅降级)的发展,其中设计人员将为最新的浏览器创建网页,这些网页在较旧版本的浏览器软件中也能正常运行。正常降级应该允许页面“降级”,或者即使不存在设计所假定的某些技术也可以保持可显示状态,而不会给这样的旧软件的用户带来麻烦。

    在渐进增强(PE)中,该策略被有意地颠倒了:创建了基本的标记文档,以浏览器软件功能的最低公分母为目标,然后设计人员使用现代的功能为页面的表示和行为添加了功能或增强功能级联样式表,可伸缩矢量图形(SVG)或JavaScript等技术。所有这些增强功能都是外部链接的,从而防止了不必要地下载某些浏览器无法使用的数据。

    渐进增强

    渐进增强方法源于Champeon在使用HTML或任何Web表示语言之前的使用标准通用标记语言(SGML)的早期经验(约1993-4),以及后来使用CSS解决浏览器错误的经验。在那些早期的SGML上下文中,语义标记至关重要,而表示几乎总是分开考虑的,而不是嵌入标记本身。这个概念被不同地称为在标记圆圈为一体的规则表示和内容的分离,内容和风格的分离,或语义和呈现的分离。随着Web在90年代中期的发展,但是在CSS引入并得到广泛支持之前,HTML的扩展程序屡屡违反了​​SGML的基本规则。结果,网页设计师被迫采用破坏性的新技术和标签,以便保持相关性。出于优雅降级的考虑,认识到并不是每个人都拥有最新的浏览器,因此许多人开始简单地采用仅在最新版本以及以前的单个主要浏览器版本中受支持的设计实践和技术。几年来,大多数Web仅在最新,最受欢迎的浏览器上无法使用。直到CSS的兴起,广泛采用和支持以及许多民粹主义基层的教育努力(来自Eric Costello、Owen Briggs、Dave Shea、渐进式增强基于以下认识:随着具有低功能浏览器和严格带宽限制的手持设备和PDA设备的兴起,“优雅降级”背后的核心假设(即浏览器总是变得越来越快、功能越来越强大)证明了自己是错误的。此外,HTML和Web早期相关技术的快速发展已经放慢了脚步,而且非常老旧的浏览器已经过时,设计师可以使用强大的技术(例如CSS)来管理所有演示任务,并使用JavaScript来增强复杂的客户端-副行为。

    首先提出一个不太复杂的通用短语来描述“将文档结构和内容与语义,表示和行为分开”的精致技巧,并基于当时常见的CSS hack来解决在特定浏览器中呈现bug的问题,随着新的设计师接受了这种想法并扩展和修订了这种方法,渐进增强策略已经有了自己的生命。

    核心原则

    渐进增强策略包括以下核心原则:

    • 基本内容应可供所有Web浏览器访问
    • 所有网络浏览器都应可以访问基本功能
    • 稀疏的语义标记包含所有内容
    • 外部链接的CSS提供了增强的布局
    • 通过不引人注目的外部链接JavaScript 提供增强的行为
    • 尊重最终用户的Web浏览器首选项

    支持和采用

    • 2003年8月,吉姆·威尔金森(Jim Wilkinson)创建了一个渐进式增强Wiki页面,以收集一些技巧和窍门并解释总体策略。
    • 杰里米·基思(Jeremy Keith)这样的设计师已经展示了该方法如何与现代Web设计的其他方法(例如Ajax)和谐地结合使用,以提供灵活但强大的用户体验。
    • 亚伦·古斯塔夫森(Aaron Gustafson)为A List Apart撰写了一系列涵盖渐进增强基础知识的系列文章,从基础哲学到CSS方法再到如何处理JavaScript。
    • 包括Dave Shea在内的其他人帮助扩展了该术语的使用,以指代基于CSS的设计策略。
    • 诸如Acids和Acid3测试的创建背后的Web Standards Project(WaSP)之类的组织已经接受了逐步增强作为其教育工作的基础。
    • 2006年,内特·科希利(Nate Koechley)在Yahoo! 在他自己的Web设计和浏览器支持方法(分级浏览器支持(GBS))中广泛引用了逐步增强功能。
    • 美国在线(AOL)的史蒂夫·奇普曼(Steve Chipman)将渐进式增强(通过DOM脚本编写)称为其Web设计策略的基础。
    • AOL优化团队的负责人David Artz开发了一套可访问的渲染技术,并发明了一种动态拆分“增强”的技术,从而节省了用户的偏好。
    • 克里斯·海尔曼(Chris Heilmann)讨论了有针对性地交付CSS的重要性,以便每个浏览器仅获得它可以处理的内容(和增强功能)。
    • Filament Group的Scott Jehl提出了“测试驱动的渐进增强”,建议在提供增强功能之前测试设备功能(而不是从检测到的用户代理中推断出它们)。
    • Wt是一个开放源代码的服务器端Web应用程序框架,在其引导过程中透明地实现了逐步增强,从纯HTML到完整的Ajax。

    辅助功能的好处

    根据渐进增强原理创建的网页从本质上来说更易于访问,因为该策略要求基本内容始终可用,而不受通常不受支持或容易禁用的脚本的阻碍。此外,稀疏标记原理使大声读取内容的工具更容易找到该内容。目前尚不清楚渐进式增强站点与旨在处理表格布局,“ 标记汤 ”等的较旧工具的配合效果如何。需要引用 ]

    搜索引擎优化(SEO)的好处

    关于搜索引擎优化(SEO)的改进结果是基于渐进增强的Web设计策略的另一个副作用。由于搜索引擎蜘蛛始终可以访问基本内容,因此使用渐进增强方法构建的页面避免了可能妨碍搜索引擎索引的问题。

    批评与回应

    一些怀疑论者,例如Garret Dimon,已经表达了他们的担忧,即在严重依赖JavaScript来实现某些用户界面表示或行为的情况下,渐进增强是行不通的,JavaScript的不干扰是一种回应。其他人则反驳了这样的观点,即信息页面应使用渐进增强进行编码,以便被蜘蛛索引,而即使是闪存繁多的页面也应使用渐进增强进行编码。在一个相关领域,许多人对内容和表述以xxx术语分开的原则表示怀疑,反而促使人们现实地认识到两者之间有着千丝万缕的联系。


    渐进增强

    相关推荐

    响应式网页设计

    目录 1 响应式网页设计 2 响应式网页对SEO的影响 3 相关概念 ▪ 移动优先、顺畅的JavaScript和渐进增强 ▪ 基于浏览器、设备或功能检测的渐进增强 4 挑战和其他方法响应式网页设计响应式网页设计(RWD)是一种网页设计方法,可使网页在各种设备以及窗口或屏幕尺寸上都能很好地呈现。最近的工作也将观看者的接近度作为观看上下文的一部分视为RWD的扩展... (继续浏览)

    用户体验

    目录 1 什么是用户体验 ▪ 定义 2 对用户体验的影响 3 瞬间情绪或整体用户体验 4 UX的因素什么是用户体验用户体验(UX)是一个人对使用特定产品,系统或服务的情感和态度。它包括人机交互和产品所有权的实践、体验、情感、有意义和有价值的方面。此外,它还包括人们对系统方面的看法,例如实用性,易用性和效率。用户体验本质上可以是主观的,其程度是关于产品或系统的... (继续浏览)

    设计思维

    目录 1 设计思维 2 设计过程 3 创新过程 ▪ 设计灵感 ▪ 构想:发散和收敛的思想 ▪ 实现和原型 4 应用 ▪ 在商业中 ▪ 在教育 ▪ 在计算机科学中设计思维设计思维指的是认知,战略和实践过程,通过这些过程可以开发出设计概念(新产品、建筑物、机器等的建议)。通过对不同设计领域的研究,在实验室和自然环境下的设计认知和设计活动,已经确定了设计思维的许多... (继续浏览)

    用户界面设计原理

    目录 1 用户界面设计原理用户界面设计原理用户界面设计 的原理旨在提高用户界面设计的质量。根据露西·洛克伍德(Lucy Lockwood)的使用为中心的设计,这些原则是: 结构原则:设计应基于对用户显而易见且清晰的一致模型,以有意义和有用的方式有针对性地组织用户界面,将相关事物放在一起并将不相关事物分开,区分不同事物并使相似事物彼此相似。结构原理与整体... (继续浏览)

    参与式设计

    目录 1 什么是参与式设计 ▪ 定义 ▪ 共同设计 2 话语 ▪ 设计政治 ▪ 参与性质 ▪ 在构建环境中 3 从社区咨询到社区设计 ▪ 在软件开发中 4 流程、程序和方法 ▪ 分布式参与设计什么是参与式设计参与式设计(通常是协作设计)是一种设计方法,旨在使所有利益相关者(例如员工、合作伙伴、客户、最终用户)积极参与设计过程,以帮助确保结果符合他们的要求。需... (继续浏览)

    声音交互设计

    目录 1 声音交互设计 2 研究领域 ▪ 声音相互作用的知觉,认知和情感研究 ▪ 产品声音设计 ▪ 互动艺术和音乐 ▪ 声化声音交互设计声音交互设计是对声音的研究和开发,它是在交互上下文中传达信息,含义以及美学/情感品质的主要渠道之一。声波交互设计处于交互设计与声音和音乐计算的交汇处。如果交互设计是关于设计与人交互的对象,并且这种交互通过计算手段来促进,则在... (继续浏览)

    交互设计模式

    目录 1 什么是交互设计模式 2 图书馆 3 移动交互模式库 4 元素 ▪ 共同要素 ▪ 可选元素 5 使用设计模式的原因 6 优于设计准则什么是交互设计模式交互设计模式是设计模式中的上下文应用于人机交互,描述用于共同设计的图形用户界面。 设计模式是记录常见设计问题解决方案的正式方法。这个想法是由建筑师Christopher Alexander提出的,... (继续浏览)

    用户界面设计

    目录 1 什么是用户界面设计 2 设计流程 3 要求 4 研究什么是用户界面设计用户界面设计(UI)或用户界面工程是设计的用户界面的机器和软件,如电脑,家电,移动设备和其他电子设备,重点最大化的可用性和用户体验。用户界面设计的目标是就实现用户目标(以用户为中心的设计)而言,使用户的交互尽可能简单有效。 良好的用户界面设计有助于完成手头的任务,而不会引起... (继续浏览)

    用户体验设计

    目录 1 什么是用户体验设计 2 元素 ▪ 研究 ▪ 视觉设计 ▪ 信息架构 ▪ 交互设计 ▪ 可用性 ▪ 辅助功能 ▪ 符合WCAG ▪ 人机交互 3 UX可交付成果 4 平面设计师 5 视觉设计师 6 互动设计师 7 视频游戏的用户体验什么是用户体验设计用户体验设计(UXD)是通过与产品交互时提供的可用性,有用性和可取性来操纵用户行为的过程。用户体验设计... (继续浏览)

    格里菲斯法学院

    目录 1 格里菲斯法学院 2 著名校友格里菲斯法学院格里菲斯法学院是格里菲斯大学的法学院,位于布里斯班和黄金海岸。该学校以其对社会正义,国际法和法律改革的承诺而闻名。在2018年《上海大学学科排名》中,法律(包括犯罪学)在全球排名第33位,格里菲斯在澳大利亚排名xxx。院长兼校长是Therese Wilson副教授。学与教的副院长是凯莉·伯恩斯博士,研究的副... (继续浏览)

    格里菲斯大学

    目录 1 格里菲斯大学 2 各大校区 3 黄金海岸校区 ▪ 洛根校区 ▪ 弥敦道校区 ▪ 格拉瓦特山校园 ▪ 南岸校园 ▪ 数字校园 4 组织 ▪ 艺术,教育和法律 ▪ 格里菲斯商学院 ▪ 格里菲斯健康 ▪ 格里菲斯科学 5 学生生活 ▪ 学生组织 ▪ 格里菲斯荣誉学院 ▪ 格里菲斯体育学院 ▪ GUMURRII学生支持单位 ▪ 格里菲斯学院 ▪ 格里菲斯英... (继续浏览)

    拉筹伯大学

    目录 1 拉筹伯大学 2 组织与行政 ▪ 组织 ▪ 中央行政 ▪ 财政 ▪ 排名 3 研究 ▪ 拉筹伯分子科学研究所 4 学生生活 ▪ 学生会 ▪ 拉贝莱斯 ▪ 学院和学生宿舍拉筹伯大学拉筹伯大学是公立 研究型大学,总部设在澳大利亚墨尔本。它的旗舰校区位于墨尔本郊区的邦多拉(Bundoora)。该大学成立于1964年,成为维多利亚州的第三所大学和澳大利亚的第... (继续浏览)

    新英格兰大学

    目录 1 新英格兰大学 2 校园 3 研究 4 学术系 5 住宅学院新英格兰大学新英格兰大学(UNE)是一所公立大学在澳大利亚,该校拥有约22,500 高等教育的 学生。它的原始校园和主要校园位于新南威尔士州中北部的Armidale市。UNE是在州首府以外建立的xxx所澳大利亚大学。每年,大学为学生提供超过500万美元的奖学金,奖品和助学金,并为从事研究的教... (继续浏览)

    默多克大学

    目录 1 默多克大学 2 学生人口统计 3 学术简介 ▪ 排名 ▪ 声誉 4 默多克大学国际学习中心 ▪ 迪拜默多克大学 ▪ 新加坡默多克大学国际学习中心 5 著名的教师和校友默多克大学默多克大学是西澳大利亚州珀斯的一所公立大学,在新加坡和迪拜都有校区。它于1973年7月25日开始运营,是该州的第二所大学,并于1975年招收了xxx批本科生。它的名字取自沃尔... (继续浏览)

    澳大利亚联邦大学

    目录 1 澳大利亚联邦大学 2 学术界 ▪ 本科学习 ▪ 研究 ▪ 排名 3 学生的人口统计和参与度 4 校园 ▪ 巴拉瑞特 ▪ 西维多利亚时代的校园 ▪ 海伦山校园 ▪ 吉普斯兰校区 ▪ 伯威克校区 ▪ 科技园 ▪ 研究机构和中心澳大利亚联邦大学澳大利亚联邦大学是一个公共,双部门设在大学巴拉瑞特在澳大利亚维多利亚州。该大学还在阿拉拉特(Ararat),霍舍... (继续浏览)

    堪培拉大学

    目录 1 堪培拉大学 2 校园 ▪ 布鲁斯 ▪ 图书馆 ▪ 设施 ▪ 学生宿舍 3 组织与行政 ▪ 管理 ▪ 五大院系 4 著名人物堪培拉大学堪培拉大学(UC)是一所澳大利亚首都堪培拉布鲁斯的公立大学。该校区距离Westfield Belconnen酒店仅几步之遥,距离堪培拉的市民中心 8.7公里(5.4英里)。加州大学提供涵盖五个系的本科和研究生课程:健康... (继续浏览)

    墨尔本皇后学院

    目录 1 墨尔本皇后学院 2 传统 3 大学负责人 ▪ 大师 ▪ 副校长 ▪ 院长 4 著名校友墨尔本皇后学院墨尔本皇后学院是一所附属于墨尔本大学的住宿学院,为大约220名就读墨尔本大学,维多利亚艺术学院,RMIT大学和莫纳什大学药学与药学学院的学生提供住宿。除了学生(通常称为“昆纳大学”)之外,皇后学院(通常简称为“女王大学”)还设有许多研究员,常驻导师,... (继续浏览)

    卫斯理学院

    目录 1 卫斯理学院 2 建筑物 3 学生生活 ▪ 罗森杯 ▪ 玫瑰杯杯 ▪ 社交日历 4 大师 5 著名校友卫斯理学院卫斯理学院是悉尼大学内265名学生的一所合宿学院。该学院位于悉尼大学主校区,建在Crown Land的次级拨款上。韦斯利大学是悉尼大学提供住宿的6所校园大学之一。1923年,该学院平均有45名学生。最初,该学院仅容纳男性,但在1969年,女... (继续浏览)

    圣塔索菲亚学院

    目录 1 圣塔索菲亚学院 2 学生生活 ▪ 学术 ▪ 文化 ▪ 体育 3 大学治理 ▪ 理事会和负责人 ▪ 学生委员会 4 著名人物 ▪ 政治与法律 ▪ 学术和医学 ▪ 商业 ▪ 人文艺术圣塔索菲亚学院圣塔索菲亚学院是一所悉尼大学女子学院和研究生学院的女子学院。这所大学有天主教基金会,但可以招收任何宗教信仰的学生。Fiona Hastings自2018年以来... (继续浏览)

    圣保罗学院

    目录 1 圣保罗学院 2 学术荣誉圣保罗学院圣保罗书院是英国国教其参加与住宿学院悉尼大学在澳大利亚悉尼。它是根据新南威尔士州立法委员会 1854年的一项法案于1856年成立的,它是澳大利亚最古老的大学学院。众所周知,圣保罗被称为“保罗”,居民被称为“ Paulines”,校友被称为“ Old Paulines”。校友包括总理,副总理,联邦和州政府部长,澳大利... (继续浏览)