Mes: junio 2010

Cosas que no hay que hacer al redireccionar una página

En estos últimos tiempos he aprendido dos cosas que no hay que hacer nunca cuando quieres redireccionar una página si no quieres hundirte en la miseria. Cosa 1: Redirecciones 301 a 404 Uno de los fallos más habituales que comentemos cuando hacemos una redirección 301 es que solemos mandar tooodo a la nueva URL, dominio o lo que toque en cada caso… pero no solemos parar a mirar si una página se está redireccionando hacia una que da error, o sea, una que devuelve un código 4xx. ¿Y qué pasa con los buscadores? Pues que como siempre se lían con los 3xx, 4xx y 5xx, por norma general, si haces una redirección a una página de error, esas páginas se acaban añadiendo al índice secundario y se monta … Leer más

Categorías SEO

Un par de trucos para WordPress con .htaccess

Muchas veces queremos hacer cosas en WordPress y buscamos plugins que pueden sobrecargar el sistema de forma absurda, pudiendo hacer mejoras gracias a unas pocas líneas del .htaccess. Reducir spam en comentarios En muchas ocasiones los robots de spam están tan mal hechos que no incluyen ningún tipo de referrer, algo que los usuarios por norma general sí que permiten… así que: RewriteCond %{REQUEST_METHOD} POST RewriteCond %{REQUEST_URI} .wp-comments-post\.php* RewriteCond %{HTTP_REFERER} !.*dominio.com.* [OR] RewriteCond %{HTTP_USER_AGENT} ^$ RewriteRule (.*) ^http://%{REMOTE_ADDR}/$ [R=301,L] Evitar enlaces multimedia externos (hotlinking) Gracias a esto puedes impedir que los sitios que te enlacen y usen tus imágenes reciban un bonito mensaje… RewriteCond %{HTTP_REFERER} !^http://(.+\.)?dominio\.com/ [NC] RewriteCond %{HTTP_REFERER} !^$ RewriteRule .*\.(jpe?g|gif|png)$ nohotlinking.png [L]

WTF – Web Testing Framework

Muchos sabéis que una de las herramientas que últimamente tengo bastante presente es YSlow, y hace unos días que descubrí una ampliación de esta herramienta llamada WTF (Web Testing Framework) que simplemente revisa algunos elementos del código de una página web. Entre los elementos que revisa están: Si se usa el elemento <blink> Si se usa el elemento <marquee> Si se usa el elemento <font> Si no existe el <doctype …> Si se usan imágenes GIF para ajustar el diseño Si se usan enlaces con # o javascript La versión 0.0.1 se lanzó el pasado día 20 y para utilizarla sólo hace falta que ya esté en funcionamiento la herramienta de Yahoo!. A ver si su creador le va añadiendo más elementos que no contempla la herramienta «padre».

Categorías WPO

HTML 5: los «malditos» iframes

Aunque es uno de los elementos que se utilizan todavía, la verdad es que el consumo que provoca en los navegadores es tan alto que si nos paramos a pensar fríamente, no es nada recomendable su uso… aún así, el HTML 5 todavía lo mantiene ya que para algunas cosas sigue siento un elemento valioso (aunque, como digo, yo no lo recomiendo, ni yo ni Google ni Yahoo!…) iframe El elemento iframe básicamente permite integrar lo que se podría decir como una ventana de navegador dentro de otra, o sea, una página dentro de otra, en un espacio definido. De esta forma podemos abrir el contenido de una página propia o externa dentro de una parte de la que actualmente visualizamos. El principal atributo que lo acompaña es … Leer más

Web Performance Optimization, básico en un negocio web

Según voy adelantando en esto de mejorar los sitios web, ya no por SEO únicamente, sino pensando en los usuarios, me doy cuenta de la importancia esa de frases como: es que Google va muy rápido. Sí, la verdad es que sí, se agradece muchísimo que un sitio vaya muy muy rápido hoy en día, porque en gran medida es lo que hace que el usuario se sienta a gusto, porque puede navegar casi instantáneamente. Uno de los inversores importantes en Estados Unidos, Fred Wilson, que ha invertido en Twitter, delicious, Etsy o FeedBurner cuando habla del TOP 10 de las aplicaciones web, pone en el número uno la velocidad del sitio: First and foremost, we believe that speed is more than a feature. Speed is the most … Leer más

Dominios sin cookies

Una de las cosas de las que últimamente se habla bastante es de los CDN y los dominios cookie-less y su influencia en el rendimiento de un sitio web. Si bien es cierto que no estoy nada de acuerdo con distribuir una web dinámica por un CDN, ya que eso destrozaría todo el sentido SEO que se le puede llegar a dar, sí que se pueden plantear soluciones para los contenidos estáticos. Una de estas soluciones es el uso de los dominios sin cookies, que básicamente lo que son es sitios donde almacenar información que no permita recibir o enviar cookies. Y es que las imágenes, estilos o javascripts no necesitan, para nada, enviar o recibir cookies ya que no las van a saber interpretar, y quieras que … Leer más

Categorías WPO

Los servidores de Google

Siempre ha habido un montón de información extraña sobre los servidores de Google y cómo se organiza. Desde que estoy metido en el mundo de los centros de datos en Digital Parks he podido ver algunos de los problemas a los que los webmaster normalmente no se enfrentan, como es la electricidad y la refrigeración de las máquinas, o el simple sistema de conectividad de redes… En fin, os dejo con una serie de vídeos interesantes sobre el funcionamiento de los centros de datos y contenedores que usa Google. AMPLIACIÓN: Pero antes, de ver los vídeos, me molaría comentarios sobre una patente que ha registrado gente de Google en la que se especifican cómo deberían ser una serie de servidores bastante más eficaces todavía de los que se … Leer más

La mejor forma de hacer una redirección

Los sitios web van y vienen… y como no queremos perder información ni generar un montón de errores en la red de redes, lo mejor es poder migrar información de un sitio a otro fácilmente. Y como ya comenté una vez, el 302 no es una redirección, sino que lo son el 301 y 307, por lo que si queremos migrar todo lo relacionado a un sitio, deberemos aplicar una de estas, en este caso, la redirección 301. Hay que partir de la base de que las redirecciones en HTML (a pelo) no funcionan, al menos no para lo que nosotros queremos. Esto significa que hacer una redirección con el meta-refresh o a través de JavaScript no sirven para migrar contenidos o pesos, sino que el usuario cambia … Leer más

Migrando de servidor

Seguramente algunos habréis notado que ayer tarde e incluso esta noche el sitio está haciendo un poco el tonto… y es que me ha dado por migrar el servidor web a algo mejor. Con mejor no quiero referirme a que la máquina sea más potente (la verdad, no tengo ni idea de qué tiene) pero sí que me he dedicado a mejorar su configuración, y en vez de usar una máquina con Plesk he pedido una máquina «a pelo». Configurar un servidor web desde cero, con su PHP, con su SQL, todo de forma más o menos distribuida es un tema bastante interesante en cuanto a la escalabilidad que te da. Por ahora estoy en una primera fase, aunque pronto espero hacer crecer la máquina y lo que … Leer más

CSSTidy: optimizar CSS es fácil

Una de las cosas por las que no solemos preocuparnos mucho es por los CSS. Solemos hacer un CSS más o menos bien formado, pero a partir de ahí nos limitamos a subirlo al servidor y poco más. Pero… si os digo que se puede ahorrar hasta un 25% en un CSS, ¿no sería interesante aplicarlo? La idea es que los CSS, al ser un elemento de los que se han de cargar antes que «se pinte» el HTML interesa que sea rápido en descargar. Además, es un elemento que suele estar en todas las páginas, y aunque el navegador suele cachearlo, vale la pena que ocupe poco… Una de las herramientas que podemos implementar directamente en nuestro servidor es el CSSTidy, que tiene unas opciones para PHP … Leer más

Cómo hacer muchas peticiones HTTP simultáneas en PHP

Uno de los problemas que habitualmente nos pueden frenar la carga de un sitio es si leemos mucha información de varios sitios de forma simultánea, como podría ser la lectura de varios feeds. Y es que habitualmente se usa la función file_get_contents() que tiene una cosa: es síncrona, es decir, hay que ejecutarla, esperar a que finalice, y volver a ejecutarla… pero ¿por qué esperar a qué acabe de leer para hacer otra llamada? Para hacerlo podemos utilizar las funciones curl_multi_* que básicamente permiten hacer muchas llamadas cURL en muy poco tiempo. No es del todo asíncrono y en paralelo, pero casi casi se podría considerar como una opción. El tiempo total de estas peticiones será la de la más lenta de todas, de forma que si tenemos … Leer más

Open Standard Media (OSM) Player

Uno de los poyos que siempre me he encontrado a la hora de poner un reproductor de vídeo en la web es que en la mayoría de casos sólo aceptaba vídeos flash (.flv). La cosa es que con el HTML 5 y con jQuery se han montado un reproductor llamado Open Standard Media que tiene muy buena pinta, es código abierto y gratuito. Entre otras cosas, permite el uso de HTML 5, soporta los nuevos elementos audio y video del HTML 5 con los formatos estándar, para el resto de formatos monta un reproductor Flash, se le puede cambiar el diseño de una forma sencilla gracias al uso de ThemeRoller, permite la integraciónd e vídeos de Vimeo y Youtube (simplemente indicando la URL), tiene la opción de listados … Leer más

face.com, la API que detecta caras en fotos

Aún no sé la utilidad de esta herramienta, pero como pronto, me ha parecido genial algo así… quizá podría servir para que al subir una foto a una red social el sistema pueda llegar a etiquetar a alguien de forma automática. Y es que face.com ha abierto su API a desarrolladores, y la verdad es que para ser abierto y gratuito, tiene buena pinta y da cierta información… Lo bueno de este sitio es que tienen varios ejemplos interesantes para varios lenguajes de programación e incluso integración con facebook y twitter. La idea es que con una simple petición a través de la librería en PHP, como podría ser: $face->faces_detect(‘http://farm3.static.flickr.com/2566/3896283279_0209be7a67.jpg’); o una petición vía REST: http://api.face.com/faces/detect.xml?api_key=4b4b4c6d54c37&api_secret=&urls=http://farm3.static.flickr.com/2566/3896283279_0209be7a67.jpg Se puede obtener un código tal que así: <?xml version=»1.0″ encoding=»utf-8″?>  <response> … Leer más

Lector de discos duros SATA externo

Hace unos días que me puse a hacer un poco de limpieza de «elementos tecnológicos» en casa (oseasé, a tirar mierdas de placas, cables y demás porquería que se acumula) y hablando con Ana de Traxtore me comentó que tenían una cosilla que me podría ser útil para los discos externos. Y es que cuando empiezas a tener 5 discos por ahí sueltos, y luego empiezas a desmontar cajas de esas con discos USB y demás, y te apalancas con 8 discos, se hace la cosa ingestionable. Así que finalmente acabé comprándome un disco duro de 2TB para poder quitarme el resto de en medio sumado a un adaptador Sharkoon SATA Quickport Pro. Hay varias versiones de este «gadget», unas con acceso IDE, otras para dos discos… Lo … Leer más

font dragr: prueba tus fuentes sólo arrastrándolas

Aunque hago un parón en cuanto a publicar de HTML 5, he encontrado esta herramienta, web o como queramos llamarlo que tiene su gracia, sobretodo si te dedicas a maquetar o eres diseñador. El sitio se llama font dragr y básicamente es una página en la que arrastrando un fichero de tipo de letra -truetype (ttf), opentype (otf), scalable vector graphics (svg) o Web Open Font Format (WOFF)- te actualizará los textos de la página con esa fuente. Además, el contenido original de la página es editable, por lo que puedes poner un texto de ejemplo y así ver cómo quedaría directamente en el navegador web. Otro detalle que ya avisan es que lo de arrastrar sólo funciona con in Firefox 3.6, que es, en estos momentos, el … Leer más

HTML 5: formularios, el elemento 2.0 (parte 2)

Hace unos días explicaba principalmente el elemento input de los formularios en HTML 5 y hoy toca el resto de elementos. Y es que no es moco de pavo todo lo que hay. fieldset Este elemento se utiliza para agrupar varios elementos de un formulario… si un formulario tiene varios «bloques» o contenidos distintos, se deberían agrupar con este elemento. Si se le indica el atributo disabled entonces los elementos contenidos en él también lo están. También se le puede indicar el atributo form que hace referencia al formulario padre, y el atributo name, para acceder externamente con un nombre único. legend Si se le quiere poner una cabecera descriptiva a cada uno de los fieldset, el legend es el elemento que debemos utilizar. Con este texto podremos … Leer más

HTML 5: formularios, el elemento 2.0 (parte 1)

Si hay un elemento que ha evolucionado enormemente con respecto a las versiones anteriores sin duda es el de los formularios. Y es que en estos últimos 10 años de ha construido lo que se llama web 2.0 (también conocido como yo ya había visto eBay en el 98 y era una web 1.0, así que alguien me está tomando el pelo). En fin, no quiero discutir sobre cómo se llaman las cosas en internet, porque la gente las llama como le da la gana. Aunque sí que es cierto que hay algo que no se puede obviar, y es que el hecho de que los sitios web sean más interactivos con el usuarios ha hecho que las necesidades de diferencias y complementar algunos elementos y atributos crezcan. … Leer más

Formas de validar un correo electrónico

Una de las cosas que habitualmente es necesario hacer es validar cuentas de correo. Hay muchas cosas a hacer, pero una de las primeras es saber si la cuenta de correo está «bien formada». Un artículo muy interesante sobre distintas formas de verificar cuentas, basadas en una serie de expresiones que sí han de validar, y otras que no han de hacerlo. La expresión que en principio se ajusta más a todas las posibilidades es la siguiente: /^([\w\!\#$\%\&\’\*\+\-\/\=\?\^\`{\|\}\~]+\.)*[\w\!\#$\%\&\’\*\+\-\/\=\?\^\`{\|\}\~]+@((((([a-z0-9]{1}[a-z0-9\-]{0,62}[a-z0-9]{1})|[a-z])\.)+[a-z]{2,6})|(\d{1,3}\.){3}\d{1,3}(\:\d{1,5})?)$/i Con esto tendríamos un código similar a este: <?php $texto = «prueba@ejemplo.com»; $expresion = «/^([\w\!\#$\%\&\’\*\+\-\/\=\?\^\`{\|\}\~]+\.)*[\w\!\#$\%\&\’\*\+\-\/\=\?\^\`{\|\}\~]+@((((([a-z0-9]{1}[a-z0-9\-]{0,62}[a-z0-9]{1})|[a-z])\.)+[a-z]{2,6})|(\d{1,3}\.){3}\d{1,3}(\:\d{1,5})?)$/i»; preg_match($expresion , $texto , $encuentros); print_r($encuentros); ?> De todas formas, quizá habría que hacer otra cosa, que es verificar si realmente la cuenta existe… y es que una cosa es que la cuenta de correo … Leer más

Categorías PHP

CSS Reset para HTML 5

Llevo varios días intentando encontrar un CSS Reset pero para HTML 5. Hasta ahora usaba el de Yahoo! YUI, pero incluso la versión 3 no da soporte a las nuevas etiquetas. Por eso me he decidido a revisar un poco los elementos que hay hasta ahora e intentar ofrecer una primera versión del CSS Reset para HTML 5. html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,hr,iframe,embed,object,legend{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup,a,small,q,time,samp,kbd,sup,sub,mark,col,colgroup,tbody,thead,tfoot,tr,td,th,label,input,button,textarea,select,optgroup,option,label,output{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;font-variant:normal;}i{font-style:italic;}b{font-weight:bold;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:»;}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select{*font-size:100%;}header,article,section,aside,footer,nav,hgroup,address,figure,figcaption,video,audio,legend,datalist,optgroup,details,summary,command,menu{display:block;margin:0;padding:0;} Se puede descargar el CSS Reset para HTML 5. NOTA: Que conste que es una propuesta personal, basándome en la mayoría de los elementos que propone el HTML 5. ACTUALIZACIÓN: Me han pasado este de Rich Clark.

El código 204 No Content

Hace un tiempo estuve hablando del protocolo HTTP/1.1 y su relación con el SEO. Haciendo un poco de revisión de aquel artículo me quedé con la duda de uno de los códigos: el 204 No Content. Al principio me había parecido verlo en algún sitio que permitía hacer alguna redirección, cosa que no tenía mucho sentido, pero «se quedó ahí». Ahora he estado investigando un poco más del tema y he acabado entendiendo el porqué de este código. Si revisamos lo que dice el estándar, veremos algo más de luz: 204 No Content The server has fulfilled the request but does not need to return an entity-body, and might want to return updated metainformation. The response MAY include new or updated metainformation in the form of entity-headers, which … Leer más

Google MayDay y Google Caffeine

La semana pasada cuando fui al EventoSEO, me paré unos minutos a hablar con Albert y me preguntó que cómo llevaba lo del MayDay. Tuve que preguntarle hasta 3 veces que de qué me estaba hablando… y es que estas últimas semanas he estado bastante desconectado en cuanto a lo que «se habla de SEO» por ahí… Para los que no lo sepan, el Google MayDay es un algo que se produjo en Google a principios del mes de mayo pero que ha afectado de forma masiva a partir de la segunda semana del mes… Os voy a dar mi punto de vista de cómo están yendo las cosas… pero para eso he de remontarme a 1997, cuando dos estudiantes de… en fin, que cuando se lanzó Google … Leer más

Categorías SEO

HTML 5: las tablas… ¿de multiplicar?

Y aquí un día más para seguir hablando de HTML 5. Por cierto he creado una sección especial en la que he recopilado todas las entradas sobre ello. En esta ocasión toca hablar de las tablas, y es que, aunque las tablas han sido un elemento que parecía que iba a desaparecer, no es así aunque sí que se le quiere dar un uso muy concreto. Y es que las tablas representan información en una o más dimensiones que se pueden representar en forma de tabla (qué frase más retroalimentada…). Lo que sí queda muy escrito es que las tablas no pueden ser parte del layout de un sitio web. table Las table son un elemento muy interesante ya que disponen de muchos subelementos, y son un contenedor … Leer más

Cómo Ligar en Internet: mi nuevo libro

Ahora no recuerdo exactamente cuándo fue, pero más o menos a mediados de noviembre del año pasado recibí un correo de Anaya Multimedia en el que me comentaban si estaba interesado en escribir un libro que se llamaría algo como Cómo Ligar en Internet. Al principio la verdad es que me quedé sorprendido… no tenía nada claro sobre qué podría ir el libro, pero después de unas cuantas conversaciones con Susana, finalmente decidí que me embarcaría en escribirlo. El libro saldrá el próximo lunes 7 de junio en muchas librerías, como Casa del Libro, El Corte Inglés o Fnac, aunque también se podrá comprar directamente desde la página que he habilitado. Además, en el sitio hay un breve resumen de los distintos sitios que he analizado en el … Leer más