Similar Posts

7 reglas para realizar Javascript de calidad

ByLuis

Siete consejos para realizar un javascript de calidad y no intrusivo:

  • No hagas suposiciones: no pienses que el usuario tendrá el javascript activado o que usará un navegador adecuado.
  • Usa IDs y relaciones entre elementos: para no depender de un HTML mal estructurado y que el javascript sea imposible de realizar, utiliza IDs para acceder a los elementos con los que se quiere tratar y busca elementos que faciliten acceder a otros elementos.
  • Utiliza estilos: en vez de modificar los estilos de los elementos HTML mediante Javascript, usa clases CSS que modifiquen los estilos, y mediante Javascript se le puede añadir la clase a un elemento superior.
  • Comprende el navegador y a los usuarios: debes pensar cómo funciona un navegador, no sobre saturar su comportamiento (abuso de drag&drop, eventos, …). Además debes pensar qué espera el usuario que haga el navegador, y respetarlo.
  • Comprende los eventos: los eventos no solo corresponden a un objeto, sino a los elementros hijo que contiene. Así se pueden realizar eventos sobr un único elemento y no tener que modificar los demás.
  • Respeta el código de otros: seguro que a parte de tu código existe algún otro que has añadido, por lo que deberás programar teniendo en cuenta que hay que evitar conflicto entre funciones.
  • Después de ti vendrá otro: es muy frecuente que alguien acabe modificando tu código, ten un poco de consideración por los demás y escribe código legible y entendible.

The seven rules of Unobtrusive JavaScript

Vía / @dcedilotte

XSS Rays: javascript que detecta vectores XSS

ByLuis

XSS Rays es un script que permite detectar vectores XSS en cualquier página web. Debemos instalar en un servidor web (puede ser en local) y añadir a nuestros marcadores o favoritos para poder ejecutarlo sobre cualquier página que visitemos.
Funciona para IE y FF, aunque puede funcionar en otros navegadores, además se pueden personalizar los vectores para cada navegador.
La ejecución es sencilla, accedes al marcador, empiezas el test y te va mostrando las incidencias que encuentra (si es que las hay).
XSS Rays
Vía / lajevardi

Consejos para tener un buen código Javascript

ByLuis

Consejos que nunca vienen mal para desarrollar un código Javascript decente:

  • Que sea limpio y esté bien documentado: esto no es exclusivo de Javascript, pero parece que en este lenguaje se olvida. También es recomendable tener dos versiones del script, uno de desarrollo y otro de producción (que estará comprimido).
  • Usa ficheros externos: no incluyas los scripts dentro de tu HTML, usa scripts externos. A parte de ser más eficiente en el gasto del ancho de banda es reutilizable y más legible.
  • Separa la capa de presentación de la capa lógica: no añadas eventos en las etiquetas HTML, create Javascripts no intrusivos que modifiquen los elementos y añadan los eventos.
  • Define el ámbito de las variables: aunque no sea necesario usar var para definir las variables, hay que hacerlo, así evitarás sorpresas de modificación de variables, sobre todo si usas recursividad.
  • No pienses que por defecto se soporta Javascript: no todo el mundo dispone de javascript, por ello no es conveniente llamar a funciones javascript dentro del href de los enlaces, y es conveniente tener acción por defecto en un enlace cuando se quiere modificar su funcionalidad por javascript:
<a href="#" onclick="javascript:accionClick()">enlace</a>
<a href="enlace.html" onclick="accionClick(); return false;">enlace</a>

5 JavaScript Best Practices

|

Ajax paso a paso: el ahorcado

ByLuis

Seguimos con nuestro especial sobre AJAX. Esta vez vamos a intentar dar un ejemplo de interactividad con el usuario y nada mejor para ello que un juego: el ahorcado.
ahoracado.png

La verdad es que los juegos de este tipo ya no se estilan, pero es un ejemplo sencillo que podemos usar para otros casos, por ejemplo formularios, encuestas, … Se trata de que el usuario interactúa sin preocuparse y la aplicación reacciona según lo que haga el usuario.

Read More “Ajax paso a paso: el ahorcado”

One Comment

Comments are closed.