.htaccess es un archivo de configuración de Apache, que nos permite definir reglas en un directorio. De él puede depender una buena parte del rendimiento de nuestras páginas web.
Dejaré una lista interesante de tips básicos para nuestras páginas Webs. No nos olvidemos que siempre es mejor modificar directamente el fichero httpd.conf, nos puede ayudar a mejorar aun más nuestro rendimiento.
Redirección de WWW a sin WWW
Supongamos que queremos redirigir esta web y dejar el contenido sin www. Por ejemplo, de http://www.marioaraque.com/ a http://marioaraque.com . Para ello debemos poner lo siguiente:
<IfModule mod_rewrite.c>
RewriteCond %{HTTPS} !=on
RewriteCond %{HTTP_HOST} ^www\.(.+)$ [NC]
RewriteRule ^ http://%1%{REQUEST_URI} [R=301,L]
</IfModule>
Redirección sin WWW a WWW
Supongamos que queremos redirigir esta web y dejar el contenido con www. Por ejemplo, de http://marioaraque.com/ a http://www.marioaraque.com . Para ello debemos poner lo siguiente:
<IfModule mod_rewrite.c>
RewriteCond %{HTTPS} !=on
RewriteCond %{HTTP_HOST} !^www\..+$ [NC]
RewriteRule ^ http://www.%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>
Codificación UTF-8
Es muy común tener problemas de codificación en nuestros ficheros. Esto puede darse a un problema de la base de datos o a un problema del servidor. En caso de que esto último sea la causa, las siguientes líneas deben solucionar el problema:
AddDefaultCharset utf-8
AddCharset utf-8 .atom .css .js .json .rss .vtt .xml
Forzar IE a no emularse
Para forzar a IE10 a comportarse como IE10, IE9 a comportarse como IE9 y demás, las líneas de abajo son de mucha ayuda.
<IfModule mod_headers.c>
Header set X-UA-Compatible "IE=edge,chrome=1"
# Sólo queremos añadirlo para páginas HTML, el resto es un desperdicio de ancho de banda
<FilesMatch "\.(appcache|crx|css|eot|gif|htc|ico|jpe?g|js|m4a|m4v|manifest|mp4|oex|oga|ogg|ogv|otf|pdf|png|safariextz|svg|svgz|ttf|vcf|webapp|webm|webp|woff|xml|xpi)$">
Header unset X-UA-Compatible
</FilesMatch>
</IfModule>
Compresión GZIP
GZIP es la manera más rápida de reducir el tamaño del archivo enviado al navegador, mejorando el tiempo de carga. Con las siguientes líneas la activarás en tu web:
# Force compression for mangled headers.
# http://developer.yahoo.com/blogs/ydn/posts/2010/12/pushing-beyond-gzipping
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
</IfModule>
</IfModule> <IfModule mod_filter.c>
AddOutputFilterByType DEFLATE application/atom+xml \
application/javascript \
application/json \
application/rss+xml \
application/vnd.ms-fontobject \
application/x-font-ttf \
application/x-web-app-manifest+json \
application/xhtml+xml \
application/xml \
font/opentype \
image/svg+xml \
image/x-icon \
text/css \
text/html \
text/plain \
text/x-component \
text/xml
</IfModule>
</IfModule>
Caché de archivos
La caché de archivos puede ser inmensamente beneficiosa para la velocidad de una web. Básicamente: Si un usuario visita cinco páginas de nuestra web, no tiene por qué descargar los mismos archivos estáticos (como imágenes, css y javascript) cinco veces. El navegador puede almacenar esos archivos en el sistema para obtenerlos mucho más rápidamente, pero para ello necesita instrucciones del servidor.
<IfModule mod_expires.c>
ExpiresActive on # Por defecto 1 mes de caché
ExpiresDefault "access plus 1 month"
# los manifiestos appcache necesitan solicitarse cada vez, por firefox 3.6 (probablemente no necesario actualmente?
ExpiresByType text/cache-manifest "access plus 0 seconds"
# El HTML nunca debe de ser cacheado
ExpiresByType text/html "access plus 0 seconds"
# Los datos dinámicos tampoco (tal vez podría variar dependiendo de tu aplicación)
ExpiresByType text/xml "access plus 0 seconds"
ExpiresByType application/xml "access plus 0 seconds"
ExpiresByType application/json "access plus 0 seconds"
# Una hora para los feeds (cambiar dependiendo de la fecha de actualización de tu web)
ExpiresByType application/rss+xml "access plus 1 hour"
ExpiresByType application/atom+xml "access plus 1 hour"
# Favicon (Sólo una semana porque el nombre no cambia, luego podría haber cambios y mantenerse el cacheado)
ExpiresByType image/x-icon "access plus 1 week"
# Imágenes, vídeo, audio: 1 mes
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType video/ogg "access plus 1 month"
ExpiresByType audio/ogg "access plus 1 month"
ExpiresByType video/mp4 "access plus 1 month"
ExpiresByType video/webm "access plus 1 month"
# Fuentes web: 1 mes
ExpiresByType application/x-font-ttf "access plus 1 month"
ExpiresByType font/opentype "access plus 1 month"
ExpiresByType application/x-font-woff "access plus 1 month"
ExpiresByType image/svg+xml "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
# CSS y JavaScript: 1 año. Ten en cuenta que si cambias los ficheros deberías usar una query string o un nombre de archivo diferente para evitar que los visitantes reciban archivos cacheados.
ExpiresByType text/css "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"
</IfModule>
# Eliminar E-Tag
# Estamos enviando periodos de caché muy amplios, así que no es necesario que el navegador compruebe mediante E-Tag si el fichero cambió
<IfModule mod_headers.c>
Header unset ETag
</IfModule>
FileETag None