Información

Aprendiendo Webflow, la guía definitiva (Actualizado a Julio 2021)

Esta guía es una recopilación de recursos, personas y webs pertenecientes al universo Webflow

4/7/2021

Esta recopilación es un compendio de fuentes variadas para diseñadores en su objetivo de aprender Webflow

Los recursos están organizados de principiante a avanzado.

SUPER TRUCO!

Como eliminar todas las imágenes no usadas en Webflow:
1) Abrir el panel de Assets
2) Seleccionar todo y borrarlo todo
3) Publicar el sitio web
4) Recargar el Designer de Webflow
5) Comprobar de nuevo el panel de Assets

Et voilà! Solo aparecerán los archivos usados en el sitio web. Lo que hace Webflow es recuperar los archivos necesarios a la hora de publicar el sitio web y solo esos.
También funciona con las imágenes del CMS.

Nota: las etiquetas Alt de las imágenes también desaparecen por lo que esa operación es a realizar al final del todo para no hacerlo dos veces.

EMPLEO

Nueva sección enfocada al empleo, sobre todo freelance:

CURSOS WEBFLOW

Para principiantes

  • Curso Webflow Kschool: Curso tanto para los que empiezan como los que ya tienen experiencia. En castellano y de pago (Nuevo)
  • Curso Webflow Xabi Nogueres en castellano: Curso en formato video en YouTube, perfecto para aprender e iniciarse
  • Webflow 101 crash course: Descripción general de los conceptos básicos para comenzar a crear su primer sitio web, sin aprender ni escribir código.
  • 2021 design portfolio course: Como crear y diseñar visualmente un sitio web portfolio completo en un lapso de 21 días. Cubriendo todos los aspectos, desde los conceptos básicos de Grid y Flexbox hasta interacciones avanzadas y accesibilidad. Este curso nos lleva a través de todos y cada uno de los pasos necesarios para crear y lanzar un sitio en Webflow.
  • Ultimate web design course: Desde los fundamentos hasta los temas más avanzados: aprenda a crear sitios en Webflow y conviértase en el diseñador que siempre quiso ser.
  • SEO fundamentals: Una descripción general de los fundamentos y las mejores prácticas de optimización de motores de búsqueda (SEO): aprenda cómo optimizar su contenido desde el principio.
  • Webflow Ecommerce: Aprenda a crear y diseñar su tienda de comercio electrónico Webflow. Personalice cada detalle y lance una tienda en línea completamente funcional, sin escribir código.

Para usuarios avanzados

  • CSS layout & positioning: Adéntrese en el mundo de los diseños HTML y CSS: aprenda cómo funcionan juntos y obtenga una descripción general de las propiedades de visualización, como el inline block o el Flexbox.
  • CSS styling: Eche un vistazo más de cerca a todas las posibilidades de estilo creativo que ofrece CSS. Aprenda a definir visualmente elementos con el poder de Webflow.
  • CSS grid in Webflow: Una descripción general de la cuadrícula CSS. Utilice el diseño de cuadrícula (Grid) en Webflow para tener más control sobre sus diseños y crear diseños potentes y receptivos, más rápido.
  • Web elements: Una mirada completa a los componentes y elementos que Webflow pone a su alcance: comience a diseñar sitios web visualmente, con confianza.
  • CMS & dynamic content: Aprenda a utilizar Webflow CMS para crear sitios web completamente personalizados con contenido dinámico y defina la estructura y el estilo de su contenido.
  • Client’s guide to the Editor: Esta es la guía del cliente para el editor de Webflow. Comparta estas lecciones para poner en marcha a sus clientes.
  • Full site build: Aprenda a diseñar y desarrollar un sitio web impulsado por CMS construido en torno a las necesidades de su cliente y su audiencia y ejecute un lanzamiento exitoso.

Otros cursos

MOVIMIENTO (MOTION)

  • Lottiefiles (Colección de animaciones en formato Lottie)
  • LottiFlow (Más recursos en formato Lottie)
  • Interactions & animations course: Aprenda a animar múltiples elementos administrados en una sola línea de tiempo: haga que sus diseños cobren vida con interacciones y animaciones ricas y secuenciadas.
  • Add web animations with After Effects & Lottie: Cree animaciones en Adobe After Effects, el estándar de la industria para gráficos en movimiento. Incrústelos y anímelos en su sitio Webflow.

EMPRESAS Y FREELANCES

  • Freelance web design bootcamp: Freelancer's Journey es un curso completo y gratuito que lo ayudará a desarrollar una carrera independiente exitosa y satisfactoria en diseño web.
  • Moving your business online: Un curso gratuito sobre cómo llevar su negocio en línea. Sirva a más clientes y genere más ingresos en este nuevo entorno.


EBOOKS WEBFLOW

Recopilación de algunos ebooks, en el futuro habrá muchos más:


DENOMINACIÓN DE LAS CLASES

Algunas convenciones de clase interesantes:


COMUNIDADES

Aquí puede encontrar mucha información y soluciones a cualquier problema:


RECURSOS Y BUENAS PRÁCTICAS

Recopilación de algunos buenos recursos que pueden ayudarlo en su flujo de trabajo:

  • Optimizar velocidad (Optimizar tu sitio web es uno de los aspectos fundamentales para tener una web eficiente y reactiva, por eso estos consejos son básicos. ¡Y Google lo agradecerá!) (Nuevo)
  • Herramientas SEO (Recopilación de herramientas y servicios enfocados a optimizar el SEO) (Nuevo)
  • Nobull (Permite conectar Airtable con un CMS Webflow de manera práctica) (Nuevo)
  • Wized (Permite crear rápidamente aplicaciones web sin codificación y es una extensión potente y fácil de usar para tus proyectos de Webflow. Funciones de inicio de sesión, integrar datos de Airtable, Stripe, etc...) (Nuevo)
  • Refokus Tools (Colección de magníficas herramientas para Webflow ofrecidas por esta experimentada agencia de diseño. ¡También en castellano! (Nuevo)


PERSONAS Y EMPRESAS A QUIÉN SEGUIR EN YOUTUBE

Selección de algunos:


INSPIRACIÓN

Los mejores sitios web realizados con Webflow:


Obviamente son muchos recursos pero seguro que hay más. Si estimas que falta alguno ponte en contacto con el autor original para ir completando esta guía.

Parte de la información procede de: https://uxplanet.org/learning-webflow-the-definitive-guide redactado por: www.fernandocomet.com

Imagen
Información

Los principales errores a no cometer con los Pop-up

Las ventanas emergentes o Pop-Up se han utilizado durante décadas y en la mayoría de los casos no son muy populares entre los usuarios de Internet.

Leer...
Imagen
Información

Diseño web visual y NoCode, el nuevo modelo del diseñador

¿Programar visualmente para diseñar un sitio web es realmente posible? La programación y su aplicación visual parecen dos conceptos incompatibles... ¿o no? La respuesta en este artículo.

Leer...
Imagen
Información

Los 10 errores freelance a evitar

Te propongo unos pequeños consejos que te pueden ayudar en tu labor de freelance

Leer...