ajax progressive-enhancement

ajax - ¿Qué es la mejora progresiva?



progressive-enhancement (8)

Jeff mencionó el concepto de ''Mejora progresiva'' al hablar sobre el uso de JQuery para escribir stackoverflow.

Después de un rápido Google, encontré un par de discusiones de alto nivel al respecto.

¿Alguien puede recomendar un buen lugar para comenzar como programador?

Específicamente, he estado escribiendo aplicaciones web en PHP y me gustaría usar YUI para mejorar las páginas que estoy escribiendo, pero muchas de ellas parecen muy basadas en JavaScript, y la mayoría del trabajo de burro se hace usando JavaScript. Para mí, eso parece un poco exagerado, ya que ver el sitio sin Javascript probablemente romperá la mayor parte.

Alguien tiene algunos buenos lugares para comenzar a usar esta idea, realmente no me importa el idioma.

Idealmente, me gustaría ver cómo se comienza a crear primero el HTML estático y luego se agrega el YUI (o el marco Ajax) para que pueda obtener los beneficios de un cliente más rico.


Básicamente, si su sitio aún funciona con JavaScript desactivado, todo lo que agregue con JavaScript se puede considerar una mejora progresiva.

Algunas personas pueden pensar que esto es innecesario, pero muchas personas navegan con complementos como NoScript (o, con JavaScript simplemente desactivado en la configuración de su navegador). Además, muchos navegadores web móviles pueden o no admitir JavaScript. Por lo tanto, siempre es una buena idea probar tu sitio completamente con y sin JavaScript.


Escribí un tutorial sobre cómo crear una encuesta que utilizara la mejora progresiva en NETTUTS . La idea es crear un sitio funcional usando XHTML / CSS y PHP, y luego interceptar formularios, etc. con Javascript. (Usé JQuery).


Seguirlo desde la otra dirección a veces se denomina degradación elegante. Esto generalmente se necesita cuando el sitio se construye primero con la funcionalidad mejorada brindada por las diversas tecnologías y luego se modifica para degradar con gracia para los navegadores, ya que esas tecnologías no están disponibles.

También es una degradación elegante cuando se diseña para trabajar con navegadores más antiguos (antiguos en la terminología de Internets) como IE 5.5, Netscape, etc.

En mi opinión, es mucho más trabajo degradar graciosamente la aplicación. Progresivamente mejorarlo tiende a ser mucho más eficiente; sin embargo, a veces surge la necesidad de tomar una aplicación existente y hacerla accesible en estos entornos deficientes.


Véase también Javascript discreto, que es la mejora progresiva del lecho de roca está construido.


Mejora progresiva:

  1. El sitio HTML / CSS simple es increíble ( funciona y es fácil de usar ).
  2. Agregar JavaScript define un nuevo nivel de impresionante.

Como dijiste

Para mí, eso parece un poco exagerado, ya que ver el sitio sin Javascript probablemente romperá la mayor parte.

Esto no es una mejora progresiva. La mejora progresiva es cuando el sitio funciona perfectamente sin JavaScript o CSS, y luego agrega (aplica capas) estas tecnologías / códigos adicionales para aumentar la usabilidad y la funcionalidad del sitio web.

El mejor ejemplo que puedo dar es el cuadro de entrada de etiqueta en este sitio web. Con JavaScript desactivado, funcionaría permitiéndole ingresar etiquetas separadas por un espacio. Con JavaScript activado, obtendrá un menú desplegable con sugerencias de entradas anteriores.

Esta es una mejora progresiva.


Progressive Enhancement es una técnica de desarrollo que enfatiza la primacía del HTML semántico, luego prueba la capacidad del navegador y "capas" condicionalmente en JavaScript y / o mejoras de CSS para los navegadores que pueden utilizar esas mejoras.

Una de las claves es entender que estamos probando lo que el navegador puede hacer , en lugar de husmear en el navegador. Modernizr es un conjunto de pruebas de capacidades de navegador muy popular.

Progressive-Enhancement es inherentemente (sección 508) accesible; proporciona para cumplir con la letra de la ley y el espíritu de la regla.

The Filament Group escribió el excelente libro " Diseñando con mejora progresiva " sobre el tema. (No estoy afiliado a Filament Group, a pesar de que son tan geniales, ojalá lo fuera).


Este es un concepto tan importante y me entristece que tan pocos desarrolladores web lo entiendan.

Básicamente, comience por crear un sitio / marco en HTML simple antiguo: elementos estructurales, enlaces y formularios. Luego agrega un poco de estilo y luego cosas brillantes (Ajax o lo que sea).

No es muy difícil. Como dice palehorse , la degradación elegante es más trabajo.

Los sitios web deberían funcionar en cualquier agente de usuario, no tener el mismo aspecto (ni siquiera mirar pero sonido si su visión se ve afectada), simplemente funcionan.