Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.
CONSULTOR WORDPRESS & CO-FUNDADOR DE RAIOLA NETWORKS
“12 TÉCNICAS WPO PARA OPTIMIZAR
WORDPRESS”
¿QUÉ CONSEGUIMOS APLICAN-
DO TÉCNICAS WPO?
01
MEJORAMOS LA
USABILIDAD Y LA
CONVERSIÓN.
APROVECHA-
MOS MEJOR EL
CRAWL BUDGE...
02
Los usuarios, clientes y visitantes de
una web quieren que la web cargue
rápido.
Si un sitio carga rápido, la experienc...
03
Si Google puede descargar más rápido
nuestro sitio web, podrá rastrear más
páginas en el mismo tiempo.
Cuantas más pági...
04
Con técnicas WPO además de mejorar la veloci-
dad de carga, reducimos el consumo de recur-
sos en el servidor.
Las técn...
12 TÉCNICAS WPO
PARA OPTIMIZAR
WORDPRESS
05
En WordPress podemos implementar un siste-
ma de cache mediante plugins.
Lo más común es implementar un cache de página...
06
En Raiola Networks tenemos 3 plugins de cache favoritos:
IMPLEMENTAR UN CACHE
PARTE 2
2.1 12 TÉCNICAS WPO PARA OPTIMIZA...
07
Al minificar archivos JS y CSS reducimos su tama-
ño y los simplificamos.
Al combinar archivos JS y CSS combinamos vari...
08
Podemos minificar y combinar de forma manual si somos
programadores.
Podemos minificar y combinar de forma automática c...
09
Mediante carga asíncrona podemos hacer que varios elementos o
scripts se carguen al mismo tiempo.
CARGA ASÍNCRONA
Esto ...
10
COMPRESIÓN GZIP O DEFLATE
PARTE 1
2.4 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS
Mediante la compresión GZIP o Deflate co...
11
COMPRESIÓN GZIP O DEFLATE
PARTE 2
2.4 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS
NetFlix ha conseguido ahorrar un
43% de ...
12
El mayor problema de WPO de la mayoría de las webs son las
imágenes sin optimizar.
El 99% de los autores de contenido w...
13
OPTIMIZAR IMÁGENES PARTE 2
2.5 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS
EWWW IMAGE OPTIMIZER O IMAGIFY IMSANITY
EWWW Im...
14
Los servicios de CDN permiten servir los contenidos estáticos des-
de servidores cercanos al visitante geográficamente ...
15
Existen cientos de servicios de CDN, nosotros recomendamos estos:
IMPLEMENTAR UN CDN PARTE 2
CLOUDFLARE KEYCDN CDN77 CL...
16
Esto es un Query String:
DESACTIVAR LOS QUERY
STRINGS
A efectos prácticos reales no aportan nada, pero pueden dificulta...
17
El API Heartbeat permite usar AJAX en Wordpress.
Muchos plugins grandes como WooCommerce y muchos themes
complejos abus...
18
Mediante plugins o mediante una función en el
functions.php podemos desactivar los “pulsos” del
API Heartbeat o aumenta...
19
El cache de navegador ahorra recursos en general, pero sobretodo
ahorra peticiones al servidor.
Mediante el cache de na...
DOMAIN SHARDING O CARGA
PARALELA PARTE 1
2.10 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS
20
Mediante Domain Sharding o Carga...
DOMAIN SHARDING O CARGA
PARALELA PARTE 2
2.10 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS
21
@ALVAROFONTELA | #SEMrushRoom
PHP7 MEJOR QUE PHP5
2.11 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS
22
Una de las mejoras de PHP7 frente a las versiones ant...
HTTP/2 PARTE 1
2.12 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS
23
HTTP/2 ofrece varias mejoras en lo que a WPO se
refiere.
L...
HTTP/2 PARTE 2
2.12 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS
24
HTTP /1.1 HTTP /2
@ALVAROFONTELA | #SEMrushRoom
CONSULTOR WORDPRESS & CO-FUNDADOR DE RAIOLA NETWORKS
#SEMrushRoom
@ALVAROFONTELA
@RAIOLANETWORKS
RAIOLANETWORKS.ES
Próxima SlideShare
Cargando en…5
×

Wpo mejora los tiempos de carga de tu web

Alvaro Fontela

  • Sé el primero en comentar

  • Sé el primero en recomendar esto

Wpo mejora los tiempos de carga de tu web

  1. 1. CONSULTOR WORDPRESS & CO-FUNDADOR DE RAIOLA NETWORKS “12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS”
  2. 2. ¿QUÉ CONSEGUIMOS APLICAN- DO TÉCNICAS WPO? 01 MEJORAMOS LA USABILIDAD Y LA CONVERSIÓN. APROVECHA- MOS MEJOR EL CRAWL BUDGET ASIGNADO. REDUCIR EL CONSUMO DE RECURSOS DE LA WEB EN EL SERVIDOR. 1.0 ¿QUÉ CONSEGUIMOS APLICANDO TÉCNICAS WPO? @ALVAROFONTELA | #SEMrushRoom
  3. 3. 02 Los usuarios, clientes y visitantes de una web quieren que la web cargue rápido. Si un sitio carga rápido, la experiencia de usuario mejo- rará. Al mejorar la usabilidad y la experiencia de usua- rio conseguiremos aumentar la conversión. ¿QUÉ CONSEGUIMOS APLICAN- DO TÉCNICAS WPO? 1.1 ¿QUÉ CONSEGUIMOS APLICANDO TÉCNICAS WPO? @ALVAROFONTELA | #SEMrushRoom
  4. 4. 03 Si Google puede descargar más rápido nuestro sitio web, podrá rastrear más páginas en el mismo tiempo. Cuantas más páginas sea capaz de rastrear el bot de Google, mejor apro- vecharemos el “presupuesto de ras- treo” o “crawl budget”. APROVECHAR MEJOR EL CRAWL BUDGET 1.2 ¿QUÉ CONSEGUIMOS APLICANDO TÉCNICAS WPO? @ALVAROFONTELA | #SEMrushRoom
  5. 5. 04 Con técnicas WPO además de mejorar la veloci- dad de carga, reducimos el consumo de recur- sos en el servidor. Las técnicas WPO que más ayudan a reducir el consumo de recursos en el servidor son las relacionadas con los sistemas de cache. ¿QUÉ CONSEGUIMOS APLICAN- DO TÉCNICAS WPO? 1.3 ¿QUÉ CONSEGUIMOS APLICANDO TÉCNICAS WPO? @ALVAROFONTELA | #SEMrushRoom
  6. 6. 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS
  7. 7. 05 En WordPress podemos implementar un siste- ma de cache mediante plugins. Lo más común es implementar un cache de página, es decir, que guarda una copia preprocesada de la página. Existen decenas de plugins de cache para WordPress. IMPLEMENTAR UN CACHE PARTE 1 2.1 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  8. 8. 06 En Raiola Networks tenemos 3 plugins de cache favoritos: IMPLEMENTAR UN CACHE PARTE 2 2.1 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS WP ROCKET W3 TOTAL CACHEWP FASTEST CACHE @ALVAROFONTELA | #SEMrushRoom
  9. 9. 07 Al minificar archivos JS y CSS reducimos su tama- ño y los simplificamos. Al combinar archivos JS y CSS combinamos varios archivos JS o varios archivos CSS en uno solo. COMBINAR Y MINIFICAR CSS Y JAVASCRIPT PARTE 1 2.2 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  10. 10. 08 Podemos minificar y combinar de forma manual si somos programadores. Podemos minificar y combinar de forma automática con plugins, aunque no suele ser efectivo. Un buen plugin para minificar y combinar en WordPress es Autoptimize. COMBINAR Y MINIFICAR CSS Y JAVASCRIPT PARTE 2 2.2 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  11. 11. 09 Mediante carga asíncrona podemos hacer que varios elementos o scripts se carguen al mismo tiempo. CARGA ASÍNCRONA Esto elimina muchas esperas innecesarias. 2.3 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  12. 12. 10 COMPRESIÓN GZIP O DEFLATE PARTE 1 2.4 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS Mediante la compresión GZIP o Deflate conse- guimos comprimir los archivos del sitio web con GZIP automáticamente. Podemos activar la compresión GZIP en Apache mediante el .htac- cess o en Nginx haciendo los cambios en los archivos de configura- ción. @ALVAROFONTELA | #SEMrushRoom
  13. 13. 11 COMPRESIÓN GZIP O DEFLATE PARTE 2 2.4 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS NetFlix ha conseguido ahorrar un 43% de ancho de banda y ha me- jorado la velocidad de carga un 25% solo activando la compresión GZIP. Evidentemente, no todos los sitios web tienen el trafico de NetFlix y por lo tanto no se conseguirán los mismos resultados con la compresión GZIP. @ALVAROFONTELA | #SEMrushRoom
  14. 14. 12 El mayor problema de WPO de la mayoría de las webs son las imágenes sin optimizar. El 99% de los autores de contenido web no ajustan las di- mensiones de las imágenes antes de subirlas. Podemos optimizar las imágenes automáticamente al subir- las mediante plugins. OPTIMIZAR IMÁGENES PARTE 1 2.5 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  15. 15. 13 OPTIMIZAR IMÁGENES PARTE 2 2.5 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS EWWW IMAGE OPTIMIZER O IMAGIFY IMSANITY EWWW Image Optimizer o Imagify son dos excelentes alternativas para optimi- zar imágenes automáticamente al subir- las. Imsanity es un plu- gin para Wordpress que puede ajustar los tamaños máximos automáticamente en WordPress. @ALVAROFONTELA | #SEMrushRoom
  16. 16. 14 Los servicios de CDN permiten servir los contenidos estáticos des- de servidores cercanos al visitante geográficamente hablando. En un Internet tan globalizado e internacional, los CDN cobran es- pecial importancia para cualquier proyecto web. Al servir los archivos desde localizaciones geográficas cercanas al visitante, bajan las latencias y la web carga más rápido. IMPLEMENTAR UN CDN PARTE 1 2.6 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  17. 17. 15 Existen cientos de servicios de CDN, nosotros recomendamos estos: IMPLEMENTAR UN CDN PARTE 2 CLOUDFLARE KEYCDN CDN77 CLOUDFRONT 2.6 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  18. 18. 16 Esto es un Query String: DESACTIVAR LOS QUERY STRINGS A efectos prácticos reales no aportan nada, pero pueden dificultar el cacheo de los elementos que cargan con Query Strings. 2.7 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  19. 19. 17 El API Heartbeat permite usar AJAX en Wordpress. Muchos plugins grandes como WooCommerce y muchos themes complejos abusan del API Heartbeat y pueden provocar problemas de rendimiento. El API Heartbeat realiza peticiones cada ciertos segundos al servi- dor. CONTROLAR EL API HEARTBEAT EN WORDPRESS PARTE 1 2.8 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  20. 20. 18 Mediante plugins o mediante una función en el functions.php podemos desactivar los “pulsos” del API Heartbeat o aumentar el periodo de tiempo entre “pulsos”. CONTROLAR EL API HEARTBEAT EN WORDPRESS PARTE 2 2.8 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  21. 21. 19 El cache de navegador ahorra recursos en general, pero sobretodo ahorra peticiones al servidor. Mediante el cache de navegador se guardan archivos en el ordena- dor del visitante al hacer la primera visita para que en las siguien- tes visitas no sea necesario descargar los archivos. Podemos activar el “browser caching” mediante el .htaccess en Apache o en los archivos de configuración de Nginx. ACTIVAR EL CACHE DE NAVEGADOR 2.9 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS @ALVAROFONTELA | #SEMrushRoom
  22. 22. DOMAIN SHARDING O CARGA PARALELA PARTE 1 2.10 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS 20 Mediante Domain Sharding o Carga Paralela po- demos hacer que se carguen varios elementos de la web a la vez. El Domain Sharding también se suele aplicar cuando implementamos un CDN. Podemos configurar la carga paralela en WordPress usando el plugin “Domain Sharding” o con algunos plugins de cache conocidos como W3 Total Cache o WP Rocket @ALVAROFONTELA | #SEMrushRoom
  23. 23. DOMAIN SHARDING O CARGA PARALELA PARTE 2 2.10 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS 21 @ALVAROFONTELA | #SEMrushRoom
  24. 24. PHP7 MEJOR QUE PHP5 2.11 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS 22 Una de las mejoras de PHP7 frente a las versiones anteriores es el rendimiento. PHP7 puede llegar a ofrecer un 300% más de rendimiento que PHP 5.4 PHP 5.4.45 PHP 7.0.0 BENCHMARK DE VERSIONES DE PHP Test math Test stringmanipulation Test loops Test ifelse @ALVAROFONTELA | #SEMrushRoom
  25. 25. HTTP/2 PARTE 1 2.12 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS 23 HTTP/2 ofrece varias mejoras en lo que a WPO se refiere. La mejora principal de WPO de HTTP/2 es la multiplexación.La multipl- exación mejora la carga de páginas con muchas peticiones. HTTP/2 solo funciona con SSL, es decir, con HTTPS @ALVAROFONTELA | #SEMrushRoom
  26. 26. HTTP/2 PARTE 2 2.12 12 TÉCNICAS WPO PARA OPTIMIZAR WORDPRESS 24 HTTP /1.1 HTTP /2 @ALVAROFONTELA | #SEMrushRoom
  27. 27. CONSULTOR WORDPRESS & CO-FUNDADOR DE RAIOLA NETWORKS #SEMrushRoom @ALVAROFONTELA @RAIOLANETWORKS RAIOLANETWORKS.ES

×