Leonel Canton (@leonelcanton) Barcamp Guatemala 2010

Optimizando nuestro Sitio

Optimizando Joomla!

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

Optimización

• ¿A qué nos referimos?– Nuestro sitio cargue mas rápido (el objetivo

de hoy)– Search Engine Optimization (SEO), mejor

posicionamiento en los Buscadores (hablemos un poco también)

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

SEO en Joomla!

• Activemos SEF (Search Engine Friendly)

• Contenido adecuado – Según nuestro publico objetivo– Original– Actualizado Constantemente– Paciencia

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

Configurando el SEO

• En la configuración Global, veremos los tres parámetros que necesitamos.– Noten que el segundo posee un signo de precaución

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

Configurando el SEO (resultado individual)

Search Engine Friendly URLs – http://www.adlcweb.com/index.php/guatemala

Use Apache mod_rewrite – http://www.adlcweb.com/index.php?

option=com_sectionex&view=category&id=7&Itemid=79

Add suffix to URLs – Igual que el anterior

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

Configurando el SEO

Search Engine Friendly URLs y Use Apache mod_rewrite – http://www.adlcweb.com/guatemala

Y si agregamos Add suffix to URLs – http://www.adlcweb.com/guatemala.html

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

Apache mod_rewrite

“Welcome to mod_rewrite, the Swiss Army Knife of URL manipulation!”

http://httpd.apache.org/docs/2.1/rewrite/

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

Htaccess

• Archivo de configuración a nivel de directorio• Funciones

– Authorization, authentication – Rewriting URLs– Blocking – Server-side includes.– Directory listing – Customized error responses– MIME types – Cache Control

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

Experiencia del Usuario

• Percepción– Esta en el ojo del Visitante

• Usabilidad

• No siempre el tiempo entre descarga y descarga es lo más importante.

Usabilidad

• ISO 9241: Part 11 "The extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use"

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

Tiempo de Respuesta

• Métricas adecuadas– Yslow– websiteoptimization.com

• Configuración del Servidor

• Creación de la página

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

YSlow

• Analiza las páginas Web y sugiere formas para mejorar su performance en base una serie de reglas

Leonel Canton (@leonelcanton) Flisol Guatemala 2010

Las Mejores Practicas para Optimizar su Sitio Web

http://developer.yahoo.com/performance/rules.html

Content (6)Cookie (2)CSS (6)Images (2)JavaScript (4)Server (5)Mobile (2)

Yslow

• Cada regla, es probada en nuestro sitio y la herramienta le asigna una calificación en punteo, además de una letra.

Nuestro Objetivo

A (90 pts)

Joomla! en localhost

• Wampserver 2.0 (Win XP)• Joomla 1.5.15• Datos de ejemplo

Etag

• Entity tags (ETags) son mecanismos para revisar por una nueva versión del archivo disponible en el cache.

• ¿Configurar o eliminar ETags?– Si no lo va a manejar, es mejor eliminarlo– http://www.websiteoptimization.com/secrets/a

dvanced/configure-etags.html

Yslow (menos Etag)

Compress Components

Configurando Joomla!

Compress Components

CssJsCompress

• Plugin gratuito de joomlatag (http://extensions.joomla.org/extensions/site-management/site-performance/7350)

• Luego de Instalarlo y Nos ayudará a con los css y js que aparecen, sustituyendolos por un archivo comprimido.

CssJsCompress

Expires Headers

• Necesitamos modulo headers de apache

Expires Headers

• Otra forma

Expires Headers

Algunas Referencias

• http://www.slideshare.net/natekoechley/high-performance-web-sites-2008

• http://stackoverflow.com/questions/373725/javascript-compression-via-htaccess

• http://www.askapache.com/htaccess/apache-speed-expires.html