"Me imagino que todavía hay mucho que puedes hacer sin Javascript" - gracioso, no hace mucho tiempo que hicimos todo sin javascript.
El mejor enfoque es lo que se conoce como 'mejora progresiva'. El principio es hacer algo que funcione sin JavaScript, y luego 'capa' en comportamientos adicionales vinculando el JavaScript a los objetos.Las bibliotecas como jQuery lo hacen sencillo, ya que admiten selectores de estilo CSS. De esta forma, puede aplicar comportamientos JS casi de la misma manera que aplicaría CSS (OK, una ligera exageración).
Es necesario reflexionar sobre qué es una buena referencia y cómo deben cambiarse las páginas.
A menudo, el trabajo extra real es en el lado del servidor, donde es posible que tenga que tener varios sistemas de procesamiento de solicitudes. ¡Es un gran campo para abordar en una pequeña respuesta!
Además, vale la pena pensar en quién y por qué los usuarios no usan javascript. Here's something I wrote a while ago on the subject en caso de que le interese.
¿Un ejemplo? Tome algo simple, ej. desea mostrar bonitas 'información sobre herramientas' en los campos de formulario cuando el usuario se desplaza hacia ellos. En el HTML, estos pueden (por ejemplo) se marcarán como párrafos:
<label for="username">User name</label><input type="text" id="username" />
<p>Username must be between 6-8 characters</p>
para los usuarios no JS, el indicador sólo se pueden mostrar como un párrafo agradable. Así que estilo esto con CSS. Tener CSS adicional para los usuarios de JS, que oculta el párrafo por defecto. Entonces: 2 juegos de CSS, uno anula al otro.
no JS:
form p {
margin: 10px 0 0 0;
border-bottom: 1px solid grey;
}
JS:
form p {
position: absolute; display: none;
width: 180px;
background-image: url(nice-bubble.gif);
padding: 10px;
}
Cómo aplicar CSS para situaciones JS JS/no depende de usted. Hay numerosas opciones. Personalmente, me gusta codificar JS en CSS y tener una variante noscript.css (es decir, trabajar hacia atrás) en una etiqueta. Lo cual no es XHTML válido, pero funciona bien.
Luego, tenga un JS que busque los elementos y administre el código de visualización para la información sobre herramientas. por ejemplo:
$(document).ready(function() {
$('form input').focus(function() {...display paragraph...});
// etc;
})
Es un código falso, pero ya entiendo la imagen. Lo que terminas con 1 juego de HTML, con 2 presentaciones y comportamientos adicionales, y sin JS enredado en tu HTML.
Cuéntame por qué me has votado negativamente? –