¡Optimiza tu WordPress para que vuele! Primeros pasos en WPO (Web Performance Optimization)
0 recomendaciones168 vistas
El documento presenta una guía sobre la optimización del rendimiento en WordPress (WPO), enfatizando la importancia de la velocidad de carga y la experiencia del usuario. Se discuten diversas técnicas y recomendaciones sobre auditoría, consultoría, optimización de imágenes, y selección de hosting, así como la gestión eficiente de plugins y código. El autor también proporciona una lista de herramientas y plugins beneficiosos para llevar a cabo estas optimizaciones.
¡Optimiza tu WordPress para que vuele! Primeros pasos en WPO (Web Performance Optimization)
- 1. Optimiza tu WordPress para que vuele! Primeros pasos en WPO (Web Performance Optimization)
- 2. JuanKa Díaz - jdevelopia.com Desarrollador Front-End (Programador de lo que se ve) en jdevelopia Especializado en WordPress y Joomla! WordPress Tarragona Podcaster en Zona Crítica, Post Type Podcast Desarrollo web y organización de eventos en JoomlaES
- 3. • https://wptarragona.com/ • 2 Meetups mensuales • WordPress&Beers • Meetup - 50% Teoría / 50% Práctica • Tarragona Impulsa & Castell del Paborde WordPress Tarragona
- 4. • https://www.dariobf.com/podcast/ • Podcast sobre diseño y desarrollo web en WordPress • Zona Crítica Postype Podcast
- 5. Disclaimer El contenido de esta presentación representa única y exclusivamente la opinión del presentador, no se pretende sentar cátedra ni redactar un nuevo testamento con mandamientos escritos sobre piedra, simplemente difundir opinión, experiencia y recomendaciones que puedan servir tanto a principiantes, clientes como a desarrolladores. Todas estas opiniones están totalmente abiertas a discusión y debate.
- 6. WordPress.org · CMS = Content Management System · GNU/GPL · Filosofía, Software Libre no es Software Gratis
- 7. WPO (Web Performance Optimization) Conjunto de técnicas para analizar, proponer y desarrollar cambios directamente relacionados con la optimización de la velocidad de carga de una web, así como la experiencia de usuario con esta.
- 9. ¡NO ES WPO! · WordPress Optimization · Instalar 3-4 plugins · Optimizar solamente la home · No valorar conexiones lentas · Alta velocidad de carga con mala UX
- 10. • Percepción de lentitud en la web • SEO • Campañas Adwords • Consumimos demasiados recursos • Competencia ¿Cuándo nos preguntamos sobre WPO?
- 11. para evitar ser un ÑAAS* *Ñapas As A Service RECOMENDACIONES
- 12. • Herramientas: - Gtmetrix - Google Page SpeedInsights - Pingdom • No solo analizar la home • Tiempo en cargar la web: - Web con mucho tráfico: menos de 2 segundos - Web normal: menos de 4 segundos 1.- Auditoría
- 16. • Tiempo en cargar la web: - Web con mucho tráfico: menos de 2 segundos - Web normal: menos de 4 segundos • Peso web: por debajo de 2 megas • Peticiones: por debajo de 50 • Puntuaciones por encima de 70% Recomendaciones
- 17. • Analizar las auditorias • Ordenar la importancia de CADA auditoria • Valorar con responsable del proyecto: • Cambiar diseño/disposición • Cambiar hosting • Analizar dependencias para proponer cambios 2.- Consultoría
- 18. • Optimizar tamaño/peso • Optimizar calidad • Escalado de imágenes • Eliminar información redundante 3.- Optimizar imágenes Plugins recomendados: EWWW Image Optimizer Smush Regenerate Thumbnails
- 20. • Buen hosting = a partir de 120-150€ año • Discos en SSD • PHP7 (5.6 es tecnología de 2014) • HTTP2 • SSL • Valorar hosting cercano a cliente • *Caché • *Respuesta del primer bit 4.- Hosting
- 21. • Evitar misma funcionalidad en varios plugins • 2 líneas de código ≠ plugin • No más de 30 plugins • P3 (Plugin Performance Profiler) 5.- Pluginitis
- 22. • Revisar necesidades de cada página • Revisar la carga de X plugins • Landing Page = Optimización 6.- Carga condicional
- 23. • 2 líneas de código ≠ plugin • Diferenciar entre diseño y funcionalidad • Correcto uso del functions y plugin propio • Diseño y maquetación tb es código, tb se optimiza • Sustituir plugins comerciales por plugin nuestro con mínimas funciones 7.- Optimizar código
- 24. • Recursos estáticos • Minificar = eliminar espacios innecesarios, tabulaciones, saltos de linea, etc… • Se minifica en producción • Orden de carga de estos recursos - JS scripts en el footer - CSS necesario en header y resto en footer. 8.- Minificar HMTL/CSS/JS Plugins recomendados: WP AutOptimize WP Super Minify Recurso Desarrollo Minifcado Font Awesome 4.7.0 37KB 31KB Bootstrap 3.3.7 CSS 143KB 119KB Bootstrap 3.3.7 JS 69KB 37KB jQuery 3.2.0 262KB 85KB
- 25. • Plugins desinstalados • Número de versiones de Posts • Comentarios SPAM • Papelera • Opciones/transients 9.- Optimizar BBDD Plugins recomendados: WP Optimize
- 26. • Especificar cache de navegador • Habilita compresión GZIP • Ahorra ancho de banda • Usar con mucho cuidado en contenido dinámico (página de carrito, páginas de usuario, etc…) • CDN = Content Delivery Network 10.- Caché y CDN Plugins recomendados: WP Super Cache W3 Total Cache WP Rocket Comet Cache
- 27. 1.- Auditoría 2.- Consultoría 3.- Optimizar imágenes 4.- Hosting 5.- Pluginitis 6.- Carga condicional 7.- Optimizar código 8.- Minificar 9.- Optimizar BBDD 10.- Caché y CDN Resumen
- 28. El buen carpintero deja el mueble bien acabado tanto por la parte que se ve como por la que no. Anónimo
- 30. Interesante… cuéntame más… Preguntas! Preguntas!!!