SEO: Exprime tu sitio
web para rankear en
Google.
VÍCTOR M. GUERRERO – VGS TECNOLOGÍAS WEB

SOBRE MI
•
•
•
•
•
•
•
Ingeniero Téc. En Informática de Sistemas.
CEO en VGS tecnologías web.
CEO en The Hackership.
Emprendedor de vocación.
SEO de fortuna.
Formador.
Entusiasta de internet.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 2

LA CONSULTORA
• Agencia especializada en desarrollo web & marketing online.
• Nuestros puntos fuertes:
– Desarrollo web optimizado para dispositivos móviles y
buscadores.
– Posicionamiento en buscadores SEO.
– Marketing online.
– Desarrollo de aplicaciones móviles.
– Servidores web de alto rendimiento.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 3

THE HACKERSHIP
• ¿Qué es THS? Espacio de trabajo enfocado a empresas y
profesionales del sector tecnológico.
• Disponibilidad de hasta 48 puesto de trabajo.
• Catapulta hacia clientes y proyectos de mayor envergadura que
por separado sería imposible alcanzar.
• Instalaciones de última generación.
• Costes muy reducidos.
• http://thehackership.com
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 4

¿EMPEZAMOS?
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 5

CONCEPTO DE RAPIDEZ
“Que se mueve, se hace o
sucede a gran velocidad, muy
deprisa.”
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 6

¿SOMOS RÁPIDOS EN ESPAÑA?
• La verdad es que en España la calidad de los
servidores no es la mejor o bien es muy cara…
• Existe gran cantidad de proveedores que
ofrecen mucho por poco. Hay truco…
• Si tu servidor/proveedor es lento, por mucho
que optimices existirá una barrera física
insalvable, cambia de proveedor.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 7

RECOMENDACIÓN DE PROVEEDORES
• Dos opciones, servidor dedicado alquilado
o servidor propio alojado en CPD.
• Alquilado:
– Dinahosting(€€€)
– Hispaweb(€€)
– OVH(€)
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 8

RECOMENDACIÓN DE PROVEEDORES
• Propio(housing):
– Hispaweb (€€)
– Dinahosting (€€€)
– Colt (€€)
• Recomendación: Escoger el proveedor que
consideríes, pero os recomiendo que la
máquina esté dentro de Interxion.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 9

ALGUNAS VERDADES
• Si el sitio es grande, el tiempo de carga aumentará
independientemente de tu CMS.
• WordPress, de facto, viene mejor preparado para
obtener un rendimiento mayor que otros CMS(esto
no quiere decir que este sea el mejor CMS).
• Escoger la plantilla equivocada puede ser nefasto
para el rendimiento en cualquier CMS.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 10

¿POR QUÉ UN SITIO RÁPIDO?
• El tiempo de carga es directamente
proporcional a la tasa de rebote de los
usuarios.
• A mayor tiempo de carga, mayor tasa de
rebote y por tanto peor CTR.
• No hagas que tus usuarios se “reboten”.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 11

¿POR QUÉ UN SITIO RÁPIDO?
• Aumenta el % de conversiones dentro de
un e-commerce, Ej.: Amazon pierde un 1%
de ventas por cada 100ms de retraso en la
carga.
• Ser rápido significa llegar el primero y es
uno de los factores SEO más importantes
en 2013.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 12

¿PERO QUÉ ES SER RÁPIDO?
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 13

SITIO RÁPIDO
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 14

¿CONVENCIDOS?
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 15

SITIO LENTO
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 16

CONSECUENCIAS DE UN SITIO LENTO
• Un sitio lento consume mayor ancho de
banda y por tanto transferencia. La
transferencia no es gratis.
• Tus usuarios te lo agradecerán con ventas.
• Google no es tonto y premia la velocidad
para ofrecer “lo mejor” a sus usuarios.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 17

¿CONVENCIDOS? POR LA GLORIA…
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 18

FACTORES QUE INTERVIENEN EN EL TIEMPO DE CARGA
•
•
•
•
•
•
Velocidad del servidor.
Tiempo de respuesta DNS.
Tamaño de la página.
Cantidad y tamaño de archivos JS.
Cantidad y tamaño de archivos CSS.
Cantidad y tamaño de imágenes.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 19

VELOCIDAD DEL SERVIDOR
• Tu página web debería de cargar en menos de 1.5
segundos.
• Utiliza herramientas como http://tools.pingdom.com
o http://gtmetrix.com para medir el tiempo de carga
de tu sitio web, son gratis!
• Solución: busca un proveedor de confianza, con
servidores de alta disponibilidad, ubicados en
España y respuesta inmediata en caso de incidentes.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 20

TIEMPO DE RESPUESTA DNS
• El tiempo de respuesta DNS es el que transcurre entre la
petición de una URL y la respuesta de dónde está albergada la
misma.
• Utilizar proveedores de registro de dominio económicos tiene
sus riesgos, Ej.: recientemente cierta empresa de registro de
dominios dejó tirados a cientos de clientes por que su servicio
DNS dejó de funcionar.
• Solución: busca proveedor español con servidores DNS
nacionales, mejorará tu tiempo de respuesta.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 21

TAMAÑO DE LA PÁGINA
• Depende directamente de nosotros y podemos conseguir
grandes resultados con poco esfuerzo.
• Lo principal para “adelgazar” el tamaño de la página es
la compresión de todo el contenido enviado al usuario.
• Además de comprimir, podemos cachear las peticiones,
de tal menera que en vez de realizar consultas a BBDD
las hacemos sobre disco => mucho más rápidas!!
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 22

HERRAMIENTAS PARA ADELGAZAR JOOMLA!
• JCH Optimize, plugin open source y gratuito. Combina,
minifica y comprime CSS y JS.
• Activar cache del sistema, si el sitio varía poco, establer
tiempos de vida de caché altos. Config. Global > Sistema >
Cache
• Activar compresión Gzip, Config. Global > Servidor >
Compresión Gzip.
• Algunas plantillas disponen de la opción combinar y
minificar integradas.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 23

HERRAMIENTAS PARA ADELGAZAR WORDPRESS
• WP Minify, plugin gratuito que combina,
minifica y comprime CSS y JS.
• Hyper Cache, permite activar la cache del
sistema, gratuito y fácil de configurar.
• W3 total cache, más completo y potente
que el anterior, pero requiere tiempo y
paciencia para configurarlo correctamente.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 24

¿PROBAMOS?
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 25

PÁGINA DE EJEMPLO SIN OPTIMIZAR
•
•
•
•
•
•
•
•
Estado, página inicial, sin optimizar.
Peso inicial, 1.6 MB aprox.
Número de peticiones: 84
Ficheros CSS: 27
Ficheros JS: 11
Imágenes: 29
CMS: Joomla
Tiempo primera carga: 3.71 s
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 26

ACTIVACIÓN GZIP Y CACHE JOOMLA!
•
•
•
•
•
•
•
•
Estado, página inicial, optimizada Gzip + Cache
Peso, 1.6 MB aprox.
Número de peticiones: 84
Ficheros CSS: 27
Ficheros JS: 11
Imágenes: 29
CMS: Joomla
Tiempo primera carga: 3.41 s
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 27

CONCLUSIONES GZIP Y CACHE JOOMLA!
• Activar la cache de Joomla mejora el
tiempo de carga de la página.
• Activar la compresión Gzip de Joomla
apenas supone diferencia.
• Siguiente paso, reducir número de
peticiones para conseguir un “efecto de
renderizado” más rápido en el navegador
del usuario.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 28

MINIFICACIÓN Y COMBINACIÓN JS + CSS JOOMLA!
• Estado, página inicial, Gzip + Cache + min JS + min
CSS.
• Peso, 1.6 MB aprox.
• Número de peticiones: 77
• Ficheros CSS: 27
• Ficheros JS: 7
• Imágenes: 29
• CMS: Joomla
• Tiempo primera carga: 3.16 s
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 29

CONCLUSIONES MIN Y COMBINE JS + CSS JOOMLA!
• Combinar los ficheros del sistema en uno solo
mejora el tiempo de carga puesto que se
reducen el número de peticiones.
• La plantilla de ejemplo genera gran cantidad
de CSS + JS propios.
• Siguiente paso, reducir el número de ficheros
de la plantilla, bien manualmente, bien
mediante utilidad del Framework del tema.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 30

MINIFICACIÓN Y COMBINACIÓN JS + CSS THEME
• Estado, página inicial, Gzip + Cache + min JS + CSS
=> Joomla & min JS + CSS theme.
• Peso, 1.6 MB aprox.
• Número de peticiones: 44
• Ficheros CSS: 2
• Ficheros JS: 7
• Imágenes: 22
• CMS: Joomla
• Tiempo primera carga: 4.04 s !!!!
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 31

CONCLUSIONES MIN Y COMBINE JS + CSS THEMA
• Aplicar doble combinación y minifación de
ficheros junto con la compresión del tema
más la del propio Joomla tiene efectos
debastadores sobre el rendimiento, ya que
existen colisiones entre lo sistemas.
• Siguiente paso, trabajar a mano los
ficheros.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 32

¿Y SI LO HACEMOS A MANO?
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 33

SMALLER APP: MINIFICA Y COMBINA JS + CSS
• Herramienta manual que
permite minificar y combinar
tanto archivos JS como CSS. Muy
útil.
• Inicialmente teníamos 27
archivos CSS, tras el trabajo
manual de combinación los
hemos reducido a tan solo 5.
• Objetivo en sitio real: cargar un
solo fichero CSS para el sitio.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 34

IMAGEOPTIM: OPTIMIZADOR DE IMÁGENES JPG Y PNG
• Herramienta muy útil y
gratuita para optimizar el
peso de los archivos PNG y
JPG sin perder calidad.
• Herramienta open source y
gratuita.
• Realmente buena con
imágenes PNG.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 35

JPEGMINI: OPTIMIZADOR DE IMÁGENES JPG
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 36

JPEGMINI: OPTIMIZADOR DE IMÁGENES JPG
• Hemos conseguido reducir un 340% el tamaño
de la imagen original sin pérdida visual.
• 300KB de peso en internet supone pasar de
cargar lento a rápido.
• JPEGmini tiene unas tasas de compresión muy
altas.
• Herramienta altamente recomendada.
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 37

RESULTADOS
• Se han minificado y combinado todos los
ficheros que genera la plantilla a mano
mediante la aplicación Smaller APP.
• Se han reducido todas las imágenes PNG
mediante ImageOptim.
• Se han reducido todas las imágenes JPG
mediante JPGEmini
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 38

OBJETIVO CONSEGUIDO!
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 39

OBJETIVO CONSEGUIDO!
• Hemos reducido el número de peticiones 84 a
44.
• Hemos reducido el peso de la página web en
un 25% sin haber trabajado la plantilla a
fondo.
• Hemos reducido el tiempo de carga de >3.5 a
<< 1 seg!!
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 40

TABLA COMPARATIVA
Inicial
Reducción 1 Reducción 2 Reducción 3
Manual
Nº Peticiones
84
77
77
44
44
Ficheros CSS
27
27
27
2
5
Ficheros JS
11
7
7
7
8
Nº Imágenes
29
29
29
22
29
Peso en MB
1.6 MB
1.6 MB
1.6 MB
1.6 MB
1.2 MB
Tiempo carga
3.71 seg
3.41 seg
3.16 seg
4.04 seg
726 ms
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 41

EL TITO MATT… ;)
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 42

¿SE PUEDE ENGAÑAR A GOOGLE?
SI
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 43

¿ALGUIEN ME DEJA UN UA?
¿Algún voluntario en la sala que
nos preste su identificador de
Analytics para un experimiento?
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 44

¿ALGUIEN ME DEJA UN UA?
¿NADIE?
si alguien nos lo deja nos reiremos de esta diapo ;)
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 45

SIN CÁMARAS POR FAVOR
Esto es solo para vosotros por
haber venido, no lo difundaís
en Internet.
GRACIAS
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 46

MORALEJA
Nunca le dejes a un SEO
una cuenta de Analitycs,
perfil de Google+, blog…
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 47

FIN
GRACIAS
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 48

¿PREGUNTAS?
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 49

SEGURO QUE TE PODEMOS AYUDAR
VGS tecnologías web
www.vgsystems.es
contacto@vgsystems.es
976 472 539
Vía Hispanidad 13, 50.009, Zaragoza
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 50

¿ME AYUDAS?
Si te ha gustado, ¿por qué no pones
un link o haces una mención?
www.vgsystems.es
@vm_guerrero & @vgs_zaragoza
GRACIAS
VGS tecnologías web – Víctor M. Guerrero - @vm_guerrero
X BetaBeers Zaragoza – 2013 51