Contenido
- 1Prevenir el hotlinking
- 2Poner una barra al final de la url
- 3Redireccionar dispositivos móviles
- 4Forzar la descarga de extensiones específicas
- 5Embeber una fuente de una web externa en Firefox
- 6Incrementa la velocidad de tu web con este cacheo para .htaccess
- 7Redirige diferentes formatos a un feed único
- 8Configura tu web para los vídeos de HTML5
- 9Log de errores de PHP
- 10Ejecuta PHP dentro de archivos de Javascript
Todos sabemos que el archivo .htaccess de Apache es el corazón de tu servidor web y lleva el timón sobre cómo tu sitio web reaccionará a diferentes acciones realizadas por tus visitantes. Es por lo importante de optimizarlo y empezar aplicando acciones con los snippets que te traemos a continuación.
Todos los snippets que encuentres más abajo deben ser pegados en tu fichero .htaccess, que debe estar localizado en el directorio raíz de tu servidor Apache.
Atención. Realiza una copia de seguridad de tu archivo .htaccess antes de llevar a cabo algún cambio.
Prevenir el hotlinking
El hotlinking (el acto de enlazar y utilizar imágenes de otros sitios webs) es, desafortunadamente, un práctica común que puede afectar negativamente a tu ancho de banda. Es útil snippet redirigirá todas las imágenes enlazadas por webs de terceros a una imagen específica, definida en la línea 6
[su_note note_color=»#dadada» text_color=»#f2f2f2″]
RewriteEngine On #Replace ?mysite.com/ with your blog url RewriteCond %{HTTP_REFERER} !^http://(.+.)?mysite.com/ [NC] RewriteCond %{HTTP_REFERER} !^$ #Replace /images/nohotlink.jpg with your "don't hotlink" image url RewriteRule .*.(jpe?g|gif|bmp|png)$ /images/nohotlink.jpg [L]
[/su_note]
Poner una barra al final de la url
Muchos de mis clientes me han pedido que aparezca siempre la barra diagonal al final de todas sus URL. Parece ser que es muy bueno para el SEO. El siguiente snippet agregará siempre una barra diagonal en las URL de tu sitio web.
[su_note note_color=»#dadada» text_color=»#f2f2f2″]
<IfModule mod_rewrite.c> RewriteCond %{REQUEST_URI} /+[^.]+$ RewriteRule ^(.+[^/])$ %{REQUEST_URI}/ [R=301,L] </IfModule>
[/su_note]
Redireccionar dispositivos móviles
Si tu sitio web aún no cuenta con un diseño responsive aún, puede ser muy útil el redirigir a aquellos usuarios que te visiten desde un dispositivo móvil a una versión específica para móviles de tu sitio web
[su_note note_color=»#dadada» text_color=»#f2f2f2″]
RewriteEngine On RewriteCond %{REQUEST_URI} !^/m/.*$ RewriteCond %{HTTP_ACCEPT} "text/vnd.wap.wml|application/vnd.wap.xhtml+xml" [NC,OR] RewriteCond %{HTTP_USER_AGENT} "acs|alav|alca|amoi|audi|aste|avan|benq|bird|blac|blaz|brew|cell|cldc|cmd-" [NC,OR] RewriteCond %{HTTP_USER_AGENT} "dang|doco|eric|hipt|inno|ipaq|java|jigs|kddi|keji|leno|lg-c|lg-d|lg-g|lge-" [NC,OR] RewriteCond %{HTTP_USER_AGENT} "maui|maxo|midp|mits|mmef|mobi|mot-|moto|mwbp|nec-|newt|noki|opwv" [NC,OR] RewriteCond %{HTTP_USER_AGENT} "palm|pana|pant|pdxg|phil|play|pluc|port|prox|qtek|qwap|sage|sams|sany" [NC,OR] RewriteCond %{HTTP_USER_AGENT} "sch-|sec-|send|seri|sgh-|shar|sie-|siem|smal|smar|sony|sph-|symb|t-mo" [NC,OR] RewriteCond %{HTTP_USER_AGENT} "teli|tim-|tosh|tsm-|upg1|upsi|vk-v|voda|w3cs|wap-|wapa|wapi" [NC,OR] RewriteCond %{HTTP_USER_AGENT} "wapp|wapr|webc|winw|winw|xda|xda-" [NC,OR] RewriteCond %{HTTP_USER_AGENT} "up.browser|up.link|windowssce|iemobile|mini|mmp" [NC,OR] RewriteCond %{HTTP_USER_AGENT} "symbian|midp|wap|phone|pocket|mobile|pda|psp" [NC] #------------- The line below excludes the iPad RewriteCond %{HTTP_USER_AGENT} !^.*iPad.*$ #------------- RewriteCond %{HTTP_USER_AGENT} !macintosh [NC] #*SEE NOTE BELOW RewriteRule ^(.*)$ /m/ [L,R=302]
[/su_note]
Forzar la descarga de extensiones específicas
Imagina que por razones X necesitas forzar la descarga de una extensión en concreto, como pueden ser los MP3 o los XLS. Estos snippets prevendrán que el navegador del visitante pueda leer el archivo y forzará la descarga por defecto.
[su_note note_color=»#dadada» text_color=»#f2f2f2″]
<Files *.xls> ForceType application/octet-stream Header set Content-Disposition attachment </Files> <Files *.eps> ForceType application/octet-stream Header set Content-Disposition attachment </Files> [/su_note]
Embeber una fuente de una web externa en Firefox
Cuando embebemos una fuente, Firefox no nos permite embeberla desde un sitio web externo. Utilizando este snippet para .htaccess que puedes ver más abajo, puedes obviar esta limitación.
[su_note note_color=»#dadada» text_color=»#f2f2f2″]
<FilesMatch ".(ttf|otf|eot|woff)$"> <IfModule mod_headers.c> Header set Access-Control-Allow-Origin "http://yourdomain.com" </IfModule> </FilesMatch>
[/su_note]
Incrementa la velocidad de tu web con este cacheo para .htaccess
Este es, probablemente, el snippet más útil de toda la lista. Utilizando este simple cacheo de .htaccess, puedes mejorar drásticamente la velocidad de tu sitio web. ¡Un snippet que siempre debes tener a mano en tu caja de herramientas!
[su_note note_color=»#dadada» text_color=»#f2f2f2″]
# 1 AÑO <FilesMatch ".(ico|pdf|flv)$"> Header set Cache-Control "max-age=29030400, public" </FilesMatch> # 1 SEMANA <FilesMatch ".(jpg|jpeg|png|gif|swf)$"> Header set Cache-Control "max-age=604800, public" </FilesMatch> # 2 DIAS <FilesMatch ".(xml|txt|css|js)$"> Header set Cache-Control "max-age=172800, proxy-revalidate" </FilesMatch> # 1 MIN <FilesMatch ".(html|htm|php)$"> Header set Cache-Control "max-age=60, private, proxy-revalidate" </FilesMatch> [/su_note]
Redirige diferentes formatos a un feed único
Hace años, existían diferentes formatos de feed como RSS, Atom o Rdf. En estos días, RSS es definitivamente el más utilizado. Este snippet te permite redirigir todos los formatos de feeds a un único feed. Este snippet puede ser utilizado tal cual también en WordPress
[su_note note_color=»#dadada» text_color=»#f2f2f2″]
<IfModule mod_alias.c> RedirectMatch 301 /feed/(atom|rdf|rss|rss2)/?$ http://example.com/feed/ RedirectMatch 301 /comments/feed/(atom|rdf|rss|rss2)/?$ http://example.com/comments/feed/ </IfModule>
[/su_note]
Configura tu web para los vídeos de HTML5
HTML5 cuenta con un montón de emocionantes opciones para el mundo del desarrollo web. Entre sus interesantes características está la capacidad de reproducir vídeos sin necesidad de utilizar Flash. Sin embargo, tienes que configurar el servidor para que funcione correctamente con los últimos estándares de vídeo HTML5. Este snippet te ayudará definitivamente.
[su_note note_color=»#dadada» text_color=»#f2f2f2″]
RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{REQUEST_URI} !=/favicon.ico AddType video/ogg .ogv AddType video/ogg .ogg AddType video/mp4 .mp4 AddType video/webm .webm AddType application/x-shockwave-flash swf
[/su_note]
Log de errores de PHP
En lugar de mostrar errores de PHP en tu sitio web (sobre todo para prevenir a los piratas) este snippet registrará en un archivo .log todos los errores, al mismo tiempo que los oculta a los visitantes.
[su_note note_color=»#dadada» text_color=»#f2f2f2″]
# display no errs to user php_flag display_startup_errors off php_flag display_errors off php_flag html_errors off # log to file php_flag log_errors on php_value error_log /location/to/php_error.log
[/su_note]
Ejecuta PHP dentro de archivos de Javascript
A la hora de programar en JavaScript, puede ser muy útil utilizar PHP dentro de los archivos .js, por ejemplo, para recuperar datos de una base de datos. Aquí tienes un snippet que permite el uso de PHP dentro de archivos JS.
[su_note note_color=»#dadada» text_color=»#f2f2f2″]
AddType application/x-httpd-php .js AddHandler x-httpd-php5 .js <FilesMatch ".(js|php)$"> SetHandler application/x-httpd-php </FilesMatch>
[/su_note]
Sobre el Autor:
Alberto Chávez, es un ingeniero web y de software apasionado por simplificar la tecnología y hacerla accesible. Con una década de experiencia, Alberto comparte tendencias, consejos y análisis tecnológicos en este blog. Además, asesora a empresas en soluciones personalizadas. ¡Acompaña a Alberto en este viaje tecnológico!