Learn JavaScript for Designers

Bring your websites to life with interactive elements using JavaScript. These tutorials are tailored to web designers and are full of practical examples and tips.

All JavaScript for Designers content:

  1. Crea un elegante formulario de contacto oscuro con HTML, CSS y JavaScript

    Crea un elegante formulario de contacto oscuro con HTML, CSS y JavaScript

    Tutorial Intermediate

    En este tutorial, veremos el proceso de diseño de elementos básicos de un formulario de contacto. Examinaremos diferentes formas de hacer que un formulario...

  2. Consejo rápido: crea un efecto de paralaje muy simple con CSS y JavaScript

    Consejo rápido: crea un efecto de paralaje muy simple con CSS y JavaScript

    Tutorial Intermediate

    En este consejo rápido, aprenderemos a añadir un simple, pero útil, efecto de desplazamiento de paralaje a una imagen «hero». Para lograrlo, usaremos un...

  3. Cómo crear una página estática para portafolio con CSS y JavaScript

    Cómo crear una página estática para portafolio con CSS y JavaScript

    Tutorial Intermediate

    En este tutorial utilizaremos todo el poder de flexbox y aprenderemos a crear una simple, pero atractiva página estática para portafolio en HTML. También...

  4. Mejor presentación de datos para infografías: Ejemplos prácticos de animación

    Mejor presentación de datos para infografías: Ejemplos prácticos de animación

    Tutorial Beginner

    El movimiento y la animación, cuando se realizan correctamente, pueden hacer que su sitio web sea más atractivo. Los sitios web que utilizan la...

  5. Navegación desplegable: Cómo mantener la opción seleccionada al cargarse la página

    Navegación desplegable: Cómo mantener la opción seleccionada al cargarse la página

    Tutorial Intermediate

    Imagina que estás utilizando un elemento "select" para navegar entre páginas; normalmente, la selección volverá a su opción predeterminada cuando la página...

  6. Cómo construir un tablero SaaS en React con Google Sheets y FusionCharts

    Cómo construir un tablero SaaS en React con Google Sheets y FusionCharts

    Tutorial Beginner

    En este tutorial explicaré el proceso de creación de un tablero (o dashboard, en inglés) SaaS obteniendo datos de Google Sheets a través del uso de la API de...

  7. Cómo crear una presentación animada para el Día del Espíritu con fullPage.js

    Cómo crear una presentación animada para el Día del Espíritu con fullPage.js

    Tutorial Intermediate

    El 18 de octubre de 2018 es el Día del Espíritu, algo que reconocemos cada año en Tuts+, y en este día nos pronunciamos en contra del acoso al colectivo...

  8. Consejo rápido: Cómo manipular la apariencia del cursor con CSS

    Consejo rápido: Cómo manipular la apariencia del cursor con CSS

    Tutorial Beginner

    En este Consejo rápido, aprenderemos cómo personalizar el aspecto del cursor con CSS. Va estar cambiando nuestro cursor en las flechas para facilitar una...

  9. 5 cursos de JavaScript para diseñadores web 

    5 cursos de JavaScript para diseñadores web 

    Tutorial Beginner

    JavaScript es un lenguaje esencial para cualquier diseñador web para dominar. Pero muchos de los cursos y tutoriales que encontrarás en JavaScript están...

  10. Cómo crear un carrusel deslizante responsivo a pantalla completa con Owl.js

    Cómo crear un carrusel deslizante responsivo a pantalla completa con Owl.js

    Tutorial Intermediate

    En una publicación anterior, te mostré cómo crear una galería de imágenes personalizada con slick.js. Hoy cubriré el proceso de creación de un slider...

  11. Cómo crear una galería de imágenes atractiva y responsiva con slick.js

    Cómo crear una galería de imágenes atractiva y responsiva con slick.js

    Tutorial Intermediate

    En este tutorial utilizaremos slick.js, un popular plugin de jQuery, para crear una atractiva galería de imágenes responsiva. Aquí está la galería que vamos...

  12. Cómo agregar enlaces de profundidad al componente de pestañas en Bootstrap 4

    Cómo agregar enlaces de profundidad al componente de pestañas en Bootstrap 4

    Tutorial Intermediate

    Hoy aprenderemos cómo agregar "enlaces profundos" a las pestañas Bootstrap 4. Para comprender mejor en qué estamos trabajando, consulta la página de...