Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

WPO para WooCommerce Monetiza 2020

99 Aufrufe

Veröffentlicht am

Esta presentación incluye conceptos básicos, definiciones de KPI´s típicos en WPO, estrategias de WPO para WooCommerce en dos escenarios diferentes subiendo en dificultad, y un listado de medios en los que se puede encontrar más información sobre cada uno de los conceptos y estrategias a poner en marcha.

Aquí disponéis de un enlace al video en YouTube de esta presentación:
https://youtu.be/Hmgf8hnev2M?t=21803

Veröffentlicht in: Internet
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

WPO para WooCommerce Monetiza 2020

  1. 1. WPO para WooCommerce #Monetiza20 @monchomad @SiteGround_ES
  2. 2. “Si la velocidad es un problema, el problema no es la velocidad.” Mon #Monetiza20 @monchomad @SiteGround_ES
  3. 3. WPO= Website Performance Optimization ¿Qué objetivos tenemos que cumplir? #Monetiza20 @monchomad @SiteGround_ES
  4. 4. WPO= Website Performance Optimization - Web rápida - Fácil navegación - Optimizada para cada dispositivo - Todos sus recursos optimizados #Monetiza20 @monchomad @SiteGround_ES
  5. 5. ¿Qué no es WPO? - Quitar funcionalidades de negocio - Optimizar una única página - “Sensaciones” - Obsesión por los indicadores #Monetiza20 @monchomad @SiteGround_ES
  6. 6. ¿Por qué es importante la velocidad en cualquier web o eCommerce? #Monetiza20 @monchomad @SiteGround_ES
  7. 7. La velocidad es dinero pasta, plata, tela, parné, cuartos... #Monetiza20 @monchomad @SiteGround_ES
  8. 8. AliExpress redujo su tiempo de carga en un 36% y observó un 10,5% de incremento en pedidos y un incremento del 27% en la conversión en nuevos clientes Fuente: https://wpostats.com #Monetiza20 @monchomad @SiteGround_ES
  9. 9. Zalando registró un 0,7% de incremento de beneficio cuando recortaron en 100ms. el tiempo de carga de su web Fuente: https://wpostats.com #Monetiza20 @monchomad @SiteGround_ES
  10. 10. Rediseñando páginas de Pinterest bajaron el tiempo de carga un 40%. Se incrementó el tráfico SEO en un 15% y se mejoró el ratio de altas en un 15%. Fuente: https://wpostats.com #Monetiza20 @monchomad @SiteGround_ES
  11. 11. En todos estos casos lo que se mejoró fue la EXPERIENCIA DE USUARIO #Monetiza20 @monchomad @SiteGround_ES
  12. 12. Comencemos sabiendo medir #Monetiza20 @monchomad @SiteGround_ES
  13. 13. @monchomad @SiteGround_ES Métricas, conceptos: - TTFB (Time To First Byte): mide el tiempo que transcurre entre la petición del usuario y que el navegador reciba el primer byte del servidor. #Monetiza20 @monchomad @SiteGround_ES
  14. 14. @monchomad @SiteGround_ES Métricas Fuente: https://web.dev/optimize-lcp/ https://web.dev/optimize-fid/ https://web.dev/optimize-cls/ Determina cuándo el contenido principal en la pantalla ha terminado de renderizarse, bloque de texto o imagen Mide el tiempo entre que un usuario interactúa por primera vez con la web y lo que tarda el navegador en responder Mide visualmente la posición y movimiento de todos los elementos de la página durante la carga de la misma.
  15. 15. @monchomad @SiteGround_ES Métricas GTmetrix TTFB: Redirect + Connect + Backend #Monetiza20 @monchomad @SiteGround_ES
  16. 16. @monchomad @SiteGround_ES Métricas GTmetrix First paint: Momento en el que el navegador pinta su primer renderizado #Monetiza20 @monchomad @SiteGround_ES
  17. 17. @monchomad @SiteGround_ES Métricas GTmetrix Contentful paint: Momento en el que el primer contenido aparece, texto, imagen… #Monetiza20 @monchomad @SiteGround_ES
  18. 18. @monchomad @SiteGround_ES Métricas GTmetrix DOM interactive time: Momento en el que ha terminado de cargar el html y el DOM #Monetiza20 @monchomad @SiteGround_ES
  19. 19. @monchomad @SiteGround_ES Métricas GTmetrix DOM loaded: El DOM está preparado y no hay hojas de estilo bloqueando el JS. #Monetiza20 @monchomad @SiteGround_ES
  20. 20. @monchomad @SiteGround_ES Métricas GTmetrix Onload: Procesamiento completo de página y todos los recursos han sido cargados #Monetiza20 @monchomad @SiteGround_ES
  21. 21. Básicos del WPO #Monetiza20 @monchomad @SiteGround_ES
  22. 22. Comencemos con lo básico WordPress WooCommerce #Monetiza20 @monchomad @SiteGround_ES
  23. 23. Comencemos con lo básico Fuente: HTTP archive #Monetiza20 @monchomad @SiteGround_ES 3,48MB
  24. 24. Áreas de optimización Imágenes, video Estáticos: (HTML, JS, CSS, fuentes) Software (plugins, tema, WP, servidor web) Entorno: (https, PHP, compresión, caché navegador, CDN, DNS) Bases de datos #Monetiza20 @monchomad @SiteGround_ES
  25. 25. Primer nivel de optimización #Monetiza20 @monchomad @SiteGround_ES
  26. 26. Optimización básica Imágenes: redimensionamos, comprimimos, atención al tipo de fichero Estáticos: minimizamos HTML, JS, CSS, SVG Software: últimas versiones de plugins, tema, WordPress y WooCommerce Video: Fuera del hosting Entorno: https, HTTP/2 + QUIC, versión de PHP, activamos Gzip/Brotli, caché de navegador y CDN, validación de caché. Servidor: activamos caché dinámica con las exclusiones (carrito, checkout,...), reducir redirecciones Plugins eliminar plugins no usados WordPress: nº de posts que se muestran, deshabilita pingbacks, optimizar nº de comentarios. Full caché para páginas estáticas Woo: ¿revisiones de productos? Medimos en cada paso el rendimiento y contamos con un tema rápido que se ajusta a nuestras necesidades #Monetiza20 @monchomad @SiteGround_ES
  27. 27. Optimización básica, herramientas Imágenes: TinyJPG, compressor.io, Kraken, Image optimizer Estáticos: Autoptimize Software: escritorio de WordPress y panel de hosting Video: incrustar videos en la web alojándolos en YouTube, Vimeo... Entorno: Panel de control del proveedor de hosting, código o plugin, activar CDN en su web o desde el prov. Hosting, ejemplo CloudFlare, KeyCDN Servidor: plugins de caché: WP Super Cache, W3, WP fastest cache, etc... Plugins eliminar plugins no usados desde el escritorio de WP WordPress: ajustes-lectura WooCommerce: ajustes Para estas operaciones: WP Rocket de pago, o SG Optimizer gratuito #Monetiza20 @monchomad @SiteGround_ES
  28. 28. Segundo nivel de optimización #Monetiza20 @monchomad @SiteGround_ES
  29. 29. Optimización fase dos Estáticos: Aplazar (Defer) o asíncrona para CSS y JS no críticos, Incrustar (Inline) CSS y JS para los críticos. Carga condicional de JS y CSS Software: Versión de servidor web Base de datos: Limpiar BBDD (wp_options). Limpiar transitorios caducados. Limitar y borrar revisiones antiguas. Entorno: precarga de DNS´s externas. APO de CloudFlare Servidor: caché de objetos. Cron wp a cron del servidor WordPress+WooCommerce: Desactivar scripts Woo donde no hagan falta, carga condicional de plugins. Heartbeat Medimos en cada paso el rendimiento #Monetiza20 @monchomad @SiteGround_ES
  30. 30. Optimización fase dos, herramientas Estáticos: Autoptimize, Async JavaScript, JS & CSS Script Optimizer, Perfmatters Software: Últimas versiones de Apache, Nginx. Base de datos: Crear índice en wp_options, Index Autoload. WP-Optimize, Clean up Booster, Advanced Database Cleaner, WP-Sweep Entorno: (precarga DNS’s externas) Identificarlas (GTmetrix), precargar en cabecera, mediante función o con Flying Scripts Servidor: WP Super Cache, W3, WP fastest cache... Desactivar WP-Cron, crearlos en tu panel de control de tu proveedor de hosting WordPress+WooCommerce: Código, Perfmatters o Script Dequeuer. Heartbeat: WPO Tweaks Para estas operaciones: WPO Tweaks, WP Rocket de pago, o SG Optimizer gratuito #Monetiza20 @monchomad @SiteGround_ES
  31. 31. Fase 3 y posteriores #Monetiza20 @monchomad @SiteGround_ES
  32. 32. #Monetiza20 @monchomad @SiteGround_ES Fase 3 y posteriores - Microcaché - Fullpage caché condicional por cookie - Server Push - Query caché - Enrutado dinámico - ... Source: @fpuenteonline
  33. 33. Extras #Monetiza20 @monchomad @SiteGround_ES
  34. 34. Extras - Escoge un proveedor de hosting especializado en WordPress y WooCommerce y pregunta por las herramientas de optimización incluidas en sus productos - Producto de hosting adecuado, no seas rácano/a - Elimina de tu hosting pruebas, contenido no asociado a tu web. #Monetiza20 @monchomad @SiteGround_ES
  35. 35. Extras - Elimina widgets innecesarios, comentarios y spam, plugins innecesarios, todo lo que no apoye el negocio de tu web, fuera. - Mobile First, pero en serio. Preferencia para PWA - Evita las redirecciones en la medida de lo posible #Monetiza20 @monchomad @SiteGround_ES
  36. 36. Extras - Evita a los cuñados y a los inforñapas - Actualiza todo - Mide todo #Monetiza20 @monchomad @SiteGround_ES
  37. 37. Recursos #Monetiza20 @monchomad @SiteGround_ES
  38. 38. Suite de optimización SG Optimizer: https://es.wordpress.org/plugins/sg-cachepress/ Más de un millón de instalaciones activas #Monetiza20 @monchomad @SiteGround_ES
  39. 39. Plugin de optimización WPO Tweaks: https://es.wordpress.org/plugins/wpo-tweaks/ Del increíble e inigualable Fernando Tellado :-) #Monetiza20 @monchomad @SiteGround_ES
  40. 40. eBooks de SiteGround - Cómo optimizar WordPress https://www.siteground.es/ebook-wordpress - Seguridad WordPress https://www.siteground.es/ebook-seguridad-wordpress - WooCommerce: https://www.siteground.es/ebook-woocommerce #Monetiza20 @monchomad @SiteGround_ES
  41. 41. eBooks de SiteGround Y mucho más en el pie de página de https://siteground.es #Monetiza20 @monchomad @SiteGround_ES
  42. 42. Documentación de WPO Todo lo incluído en la presentación, así como tutoriales paso a paso de cada estrategia puedes encontrarlo en: https://ayudawp.com Sección WPO #Monetiza20 @monchomad @SiteGround_ES
  43. 43. Videos Canal de YouTube de SiteGround España (videos de WPO y mucho más) https://www.youtube.com/c/SitegroundEspana #Monetiza20 @monchomad @SiteGround_ES
  44. 44. @monchomad @SiteGround_ES eBooks de SiteGround Mención especial: el mayor eBook de SEO en español https://www.siteground.es/ebook-posicionamiento-seo
  45. 45. #Posiciona20 @monchomad @SiteGround_ES José Ramón Padrón @monchomad Country Manager Spain at Co-org. Meetup Las Palmas Co-org. WordCamp Gran Canaria WCEU 2021: Global Lead Mentor de WordCamps en LatAm #Monetiza20 @monchomad @SiteGround_ES
  46. 46. ¡GRACIAS! #Monetiza20 @monchomad @SiteGround_ES

×