T-Shirts para diseñadores web

REFERENCIAS:designbeep.com

randomtext.me es otro sitio que permite generar textos aleatorios pero, bastante más sofisticado que muchos de los ya existentes ya que no sólo genera los típicos párrafos con Lorem Ipsum sino también otro tipo de textos como listas y títulos en formato HTM. También admite que los textos sean mostrados en formato Gibberish con lo que el resultado no será algo que parece latín sino escritura en idioma inglés:

Crassly and that the nonchalant a empirically energetic one darn this naively overheard flew keenly jaguar porcupine unlike far depending jellyfish goldfinch that red-handedly tortoise where goose much woodpecker hey darn.

Todas esas opciones se van seleccionando y el resultado, puede ser previsualizado usando el botón Generate. Luego, podemos copiarlo o descargarlo como archivo de texto o html y usarlo libremente.

• Vel rhoncus tellus ante lobortis porttitor donec eleifend dui et iaculis dictumst diam luctus
• Ultricies quisque dictum risus dolor sit bibendum rhoncus nostra id viverra sagittis volutpat proin
• Cras accumsan lacus vestibulum eget aliquam accumsan felis gravida pretium consequat mi habitant mi
• Aenean aptent nisi nam taciti amet semper litora varius primis gravida rutrum
• Lectus aptent ante feugiat lobortis lacinia ut volutpat placerat egestas

Para quienes quieran, dispone de un API que genera esos textos y que puede integrarse a cualquier sitio usando este tipo de URL:

http://www.randomtext.me/api/lorem/parametros/
http://www.randomtext.me/api/gibberish/parametros/

donde los parámetros se separan con barras, primero el tipo de elemento (p u ol h1 h2 etc) y su cantidad de y luego el rango de palabras; por ejemplo:

http://www.randomtext.me/api/lorem/ul-5/10-15/

generaría una lista de 5 elementos donde cada item tendría entre 10 y 15 palabras.

http://www.randomtext.me/api/lorem/ul-10/5-10
http://www.randomtext.me/api/gibberish/p-7/30-50/
http://www.randomtext.me/api/lorem/h2/6-10/

pero, como el resultado es una variable en formato Json, requerimos scripts extras o usa librerías como jQuery para interpretar el dato enviado y mostrarlo.

REFERENCIAS:wwwhatsnew.com

FitVids es un pequeño plugin para jQuery que nos permite agregar videos y establecer su tamaño de tal manera que se adapte al espacio disponible, manteniendo su proporción y sin necesidad de tener que calcular nada previamente por lo que basta escribir el código de inserción tal como nos lo dan los distintos servicios y dejar que el script se encargue del resto.

Para usarlo, debemos tener la librería de jQuery agregada antes de </head>:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js' type='text/javascript'/>

Y debajo, agregamos el script jquery.fitvids.js que podemos descargar desde github.

<script type='text/javascript'>
//<![CDATA[
(function( $ ){
  $.fn.fitVids = function() {
    var div = document.createElement("div"), ref = document.getElementsByTagName("base")[0] || document.getElementsByTagName("script")[0];
    div.className = "fit-vids-style";
    div.innerHTML = "<style>.fluid-width-video-wrapper {width:100%;position:relative;padding:0;} .fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}</style>";
    ref.parentNode.insertBefore(div,ref);
    return this.each(function(){
      var selectors = ["iframe[src^='http://player.vimeo.com']", "iframe[src^='http://www.youtube.com']", "iframe[src^='http://www.kickstarter.com']", "object", "embed"];
      var $allVideos = $(this).find(selectors.join(","));
      $allVideos.each(function(){
        var $this = $(this), height = this.tagName == "OBJECT" ? $this.attr('height') : $this.height(), aspectRatio = height / $this.width();
        $this.wrap("<div class='fluid-width-video-wrapper' />").parent(".fluid-width-video-wrapper").css("padding-top", (aspectRatio * 100)+"%");
        $this.removeAttr("height").removeAttr("width");
      });
    });
  }
})( jQuery );
//]]>
</script>

Por último, ejecutamos la función donde sólo deberemos establecer el nombre de la clase CSS que usaremos como contenedor:

<script>
  $(document).ready(function(){ $(".elvideo").fitVids(); });
</script>

¿Cómo lo aplicamos a nuestro sitio? Colocando el IFRAME del video dentro de un DIV con esa clase que hayamos elegido:

<div class="elvideo">
  <iframe width="425" height="349" src="http://www.youtube.com/embed/lzN5fbFlFJs" frameborder="0" allowfullscreen></iframe>
</div>

Tal como está, funcionará con sitios de videos que utilicen un IFRAME como código para compartir videos: YouTube, Vimeo, Kickstarter, etc. Ellos también hablan de blip.tv o Viddler pero, ninguno de esos está contemplado sin embargo, podemos agregarlos si editamos esta línea:

var selectors = ["iframe[src^='http://player.vimeo.com']", "iframe[src^='http://www.youtube.com']", "iframe[src^='http://www.kickstarter.com']", "object", "embed"];

por ejemplo, así agrego blip.tv y elimino kickstarter.com:

var selectors = ["iframe[src^='http://player.vimeo.com']", "iframe[src^='http://www.youtube.com']", "iframe[src^='http://blip.tv']", "object", "embed"];

Condicionar algo significa que en función de cierto dato, ocurrirán ciertas cosas o no. En Blogger, las condiciones están limitadas a que ese dato a evaluar sea alguno a los que ellos nos permiten acceder y no cualquier otro de allí que ciertas ideas no puedan ser aplicadas de manera simple porque carecemos de esa información y por lo tanto, debemos usar JavaScript que es el otro método disponible.

No es lo mismo en absoluto ya que, cuando se condiciona usando las etiquetas propias de Blogger, la página web resultante se crea en función de esas condiciones, si por ejemplo, decidimos que tal parte no forme parte de ella, el código fuente resultante, eso que muestra el navegador, no lo incluirá. Por el contrario, usando JavaScript, sólo podemos "ocultar" cosas pero eso que ocultamos, será parte de la página y se ejecutará aunque no lo veamos.

Partiendo de la idea de colocar una imagen asociada a una etiqueta en la sidebar, Adrián J. Messina preguntaba si era posible que, en lugar de mostrar una imagen, lo que se condicionara fuera un widget o gadget.

Como para hacer eso necesitamos conocer la etiqueta de esa entrada y este dato sólo es accesible dentro del LOOP que muestra los posts, no queda otro remedio que usar JavaScript lo que implica que sólo podremos mostrarlo u ocultarlo pero siempre estará allí así que su contenido será cargado por lo que es aconsejable que sean cosas relativamente livianas.

Hacer esto implica varios pasos. Para empezar, vamos a guardar en alguna variable, el dato que necesitamos; hay que ir a la plantilla y buscar:

<b:includable id='post' var='post'>

Allí, en alguna parte, veremos un código de Blogger que es el que muestra las etiquetas de la entrada y que tiene distintos formatos pero, básicamente, dice algo así:

<b:loop values='data:post.labels' var='label'>
  <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
  <b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>

donde data:label.name es la etiqueta de la entrada; allí es donde deberemos guardar ese dato; por ejemplo:

<b:loop values='data:post.labels' var='label'>
  <script>var etiquetaPOST=&#39;<data:label.name/>&#39;;</script>
  <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
  <b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>

Esto está pensado para entradas donde sólo hay una etiqueta, si son varias, empieza a carecer de sentido y debería pulirse el método, usar arrays o cualquier otro sistema.

Ahora, necesitamos agregar lo widgtes, uno, dos, los que queramos. Lo hacemos como lo hacemos siempre y luego, los buscamos; cualquiera sea siempre tendrá un ID que los identifica:

<b:widget id='XXXXX' locked='false' title='XXXXXXXX' type='XXXX'>
   .......
</b:widget>

Por defecto, los ocultaremos; suponiendo que uno de ellos es un elemento HTML cuyo id es HTML7 y el otro es una lista de enlaces cuyo id es LinkList3, pondremos lo siguiente antes de </head>

<style>
  #HTML7 {display:none;}
  #LinkList3 {display:none;}
</style>

Con esto, ya estamos listos para condicionar la visibilidad de los gadgets y se me ocurre que lo mejor es agregar el script dentro de cada uno de ellos. Suponiendo que el elemento HTML sólo se mostrará cuando la etiqueta sea "Fotos"; haríamos algo así:

<b:widget id='HTML7' locked='false' title='XXXXXXXX' type='HTML'>
<b:includable id='main'>
  <script>
  //<![CDATA[
    if(etiquetaPOST=="fotos") {
    document.getElementById("HTML7").style.display = "block";
    }
  //]]>
  </script>
   .......
</b:includable>
</b:widget>

Esto, sólo es uno de muchos métodos que deberán ser adaptados a cada situación; como dije antes, si las entradas poseen varias etiquetas habría que buscar variantes como usar arrays o variables auxiliares en el LOOP, por ejemplo:

<script>
  etiquetaPOST=&#39;<data:label.name/>&#39;;
  if(etiquetaPOST==#39;Fotos#39;) {
    flagFotos = 1;
  } else if (etiquetaPOST==#39;Videos#39;) {
    flagVideos = 1;
  }
</script>

y en el widget colocaríamos:

if(flagFotos==1) {
  document.getElementById("HTML7").style.display = "block";
}

Sea como sea, siempre hay que tener en cuenta que mostrar ese widget oculto es algo que deberá hacerse una vez que se haya creado así que, si la sidebar está a la izquierda y se genera ANTES que los posts, la condición deberá colocarse en otro lado, al final de la plantilla o en el mismo LOOP de los posts, caso contrario, no funcionará porque estaremos evaluando un dato que aún se desconoce.

Claro, todo se resolvería si Blogger nos permitiera acceder a ese dato desde cualquier parte de la plantilla pero, eso es pedirle peras al olmo.

Bitdefender es un conocido anti-virus que incluye versiones gratuitas y no gratuitas, además de otros servicios de seguridad como la posibilidad de scanear la PC online. A esto, se le había sumado un servicio extras llamado Safego que también es gratuito y que nos permiten proteger nuestra cuenta de Facebook.

Tal como dicen en SpamLoco, la aplicación trabaja en segundo plano y no molesta en absoluto.

Ahora, ghacks.net anuncia la llegada de un servicio más para ser agregado a Twitter.

Como en el caso anterior, basta ir a la página darle autorización y listo. Una vez dentro, podremos configurar las alertas, analizar a quienes seguimos y mantenernos razonablemente seguros.

Desde el inicio de los tiempos ... de los de este blog, digo, no desde Adán y Eva, he tenido la costumbre de hacer una entrada cada año, más o menos de manera sistemática, cuando terminaba agosto. Una entrada que pretendía no sé si celebrar o recordar o reafirmar el paso de un nuevo año en la existencia de este blog; un cumpleblog o como quiera llamarse. Algo así como un punto y seguido.

Esta vez, la fecha se pasó. Se pasó porque no tenía ganas, se pasó porque estaba ocupado con otras cosas ... se pasó porque se pasó.

Tampoco la demora ha sido significativa; sólo un par de días desde el 30 de agosto hasta hoy; apenas un instante pero, lo que en la vida es nada más que un suspiro, en la web es mucho pero mucho tiempo. Y cinco años son: una eternidad. Acá, las cosas pasan tan rápido que apenas las vemos desaparecen, lo que hoy es top, mañana es demodé; lo que hoy nos fascina, mañana nos aburre.

Pero el tiempo en la web y el tiempo de un blog no se rigen por los calendarios; los días no tienen 24 horas y los años no tienen 365 días. Acá, todo es efímero y a la vez, todo es infinito. Siempre hay alguien para quien lo viejo es novedad y la novedad siempre tiene algo de viejo. Eso es la web. Un lugar sin tiempos; una red que nos entrecruza, nos comunica y nos distancia pero que a la vez, es el germen de ese nuevo mundo que vendrá, que es inevitable y nos contendrá a todos, con nuestras diferencias.

5Si ahora me pongo a escribir esto es porque de alguna manera me siento obligado. Obligado sin obligación. Obligado porque los blogs son para eso, para dejar salir lo que uno tiene atravesado en al garganta.

Obligado porque un comentario del amigo Jabba me recordaba el aniversario y sus palabras me dejaron asombrado: ¿Dónde está el post del quinto cumpleblog? preguntaba sabiendo que no había ninguno.

Y me quedé pensado ¿cuál es la magia que hace que alguien se acuerde de una fecha como esta? Una fecha que bien podría pasar desapercibida porque no significa demasiado y aún así, sabiendo que es una nimiedad, se acerca desde la distancia y celebra y festeja y deja felicitaciones.

Sí eso no es magia qué alguien me explique qué es la magia.

Magia es eso. Magia es la distancia sin distancias. Magia es la realidad de lo virtual. Magia es cruzar los límites sin culpa ni disculpas. Magia es que un blog persista y se apropie de nuestra vida para multiplicarnos; que nos maneje, nos domine y nos moldee. Magia es eso que no se ve y no debe ser explicado. Qué está o no está. Que es o no es.

Obviamente, no puedo traer orquesta ni champan aunque no es por razones de "ajustes presupuestarios" sino más bien por razones de logística pero, de todas maneras, la imaginación podría llegar a servir para cubrir los faltantes.

Y entonces, acá estamos. Cumpliendo con las tradiciones auto-impuestas y sonriendo un poco. Feliz porque a uno lo recuerdan. Triste por lo que se ha perdido. Melancólico, ilusionado, todo al mismo tiempo, igual que frente a cualquier aniversario donde uno se para frente al espejo y se dice a si mismo:

Cinco años ... pensar que yo era tan joven!!!!!!!!!!!

Desde que Google cambió el algoritmo que establece la forma en que se muestran los resultados en su buscador, se ha producido un revolución en muchos sitios ya que eso ha significado que sus páginas aparezcan en posiciones menos privilegiadas y por lo tanto, la cantidad de visitas se ha reducido de manera significativa, con caídas que muchas veces, superan el 50%.

Este nuevo sistema, llamado Google Panda, hace tiempo que ya estaba en funcionamiento pero sólo en idioma inglés; sin embargo, a partir del 12 de agosto, se ha extendido a todos los idiomas.

La explicación de Google, siempre excitado con la imagen que le devuelve su propio espejo, es que quieren ofrecer mejores resultados cuando alguien busca algún tipo de información y privilegiar los contenidos originales sobre las copias pero ... el resultado final es más que dudoso. Google Panda dice premiar a sitios con contenido original, integrado a redes sociales y poca publicidad; Google Panda dice penalizar el contenido copiado, los artículos con escasa información pero esta imagen hurtada del Foro de SpamLoco lo desmiente; tal como se ve, el artículo original no es el primero sino ¡el séptimo!

Seguramente, algo similar nos debe estar pasando a cualquiera de nosotros; no hablo de personas que deben mantener un blog ya que tal vez, no han sido afectados sino de personas que usan el buscador y sin duda, habrán notado que los resultados que se muestran tienden a ser ... raros.

La verdad, las recomendaciones de Google para construir sitios de alta calidad son ... incalificables; como todos los consejos genéricos, son abstractos, discutibles y, en lo personal, van a contrapelo de lo que yo entiendo que debería ser internet. Hablan de "importancia", de "autoridad" pero ¿quién define la importancia o establece la autoridad? Hablan mucho de "originalidad" y si fuera sarcástico, me preguntaría: ¿Google eliminará de sus resultados las alevosas copias que ellos mismos hacen de otros servicios?

Algo que dicen es clarito: "Por supuesto, no vamos a develar los auténticos indicadores que usamos para la clasificación en nuestros algoritmos porque no queremos que nadie juegue con los resultados de las búsquedas" lo que traducido al español significa que, al no ser públicas, al carecer de controles independientes, son reglas tan arbitrarias como ellos quieran y simplemente, nos piden que confiemos en su bondad, su sabiduría y su buena fe cosa que, obviamente, cualquier sociedad civilizada debería repudiar; no porque uno dude (yo dudo) sino porque en ciertos casos, no solo se debe ser sino también parecer y la no regulación de cualquier tipo de monopolio sólo lleva al desastre.

Un reciente artículo de Ayuda Wordperss intenta ayudar a entender los problemas prácticos o por lo menos, hecha algo de luz sobre lo que es y lo que debería ser. Dice: "parece ser que está valorando de manera excesiva el ratio de rebote, el tiempo de permanencia en el sitio y la marca del sitio", de allí que frente a cualquier búsqueda, suelen verse muchos resultados de Wikipedia, YouTube, ¡¡¡Taringa!!!! o sitios "grandes" en detrimento de sitios "pequeños". No sería extraño, es el resultado lógico de la concentración

¿Qué puede hacerse si un sitio se ve afectado por esta "mejora"? Insultar, rezar, pero, también se pueden tener en cuanta algunas ideas expresadas en el articulo al que me refería y que trataré de resumir en lo que considero que puede ser aplicado de modo genérico, sin importar el servicio o tipo de sitio que uno tenga:

• crear contenido original, indicar las fuente y evitar las copias
• evitar los artículos cortos que aporten poco más allá de un enlace a la fuente original
• usar siempre texto alternativo (ALT) para las imágenes
• incitar a la lectura completa de las entradas
• añadir contenido que fomente la permanencia en el sitio
• facilita que los lectores compartan las entradas en redes sociales
• eliminar la publicidad excesiva
• revisar los enlaces rotos
• fomentar el debate en los comentarios siempre que estos sean relevantes
• reducir la cantidad de categorías o etiquetas
• evitar que se indexen las páginas secundarias, Archivos, Etiquetas, Búsquedas, etc.

REFERENCIAS:Recopilación de artículos sobre Google Panda para aprender más