Por @Alvy

Piracy is a Crime - Título

En TorrentFreak cuentan cómo han podido investigar acerca de la ironía de que la campaña «La piratería es un crimen» usaba una tipografía pirata. Es algo así como decir «Nada enseña mejor sobre propiedad intelectual que violar los derechos de otros discretamente en el proceso» o «Los bits no se roban, los átomos tampoco… las fuentes, bueno, eso ya tal».

El anuncio, emitido en televisión, cines e incluido insaltablemente en muchos DVDs, se hizo famoso –por lo ridículo– como parte de la campaña oficial que se lanzó en 2004, pagada y respaldada por la Motion Picture Association of America (MPAA), la Federation Against Copyright Theft (FACT) del Reino Unido y la Oficina de Propiedad Intelectual de Singapur (IPOS).

En el anuncio se equiparaba descargar una película con robar un coche, robar un bolso o robar un televisor, como si fueran lo mismo y lo primero no estuviera hecho de bits copiables y lo otro de átomos irremplazables. «Robar es ilegal», terminaba diciendo, una frase tan palmaria como obvia, rematado por un «La piratería es un crimen». Bueno, eso es lo que opinaban entonces.

Según se ha contado en diversas ocasiones, la tipografía de esa película parecía ser la FF Confidential, creada por Just Van Rossum in 1992, que se puede licenciar pagando por ella, como muchas otras.

Pero hete aquí que si se mira con lupa, en los archivos que todavía existen de aquella campaña (porque la web desapareció) se puede ver cómo en uno de los PDFs se usa la tipografía XBAND Rough, creada por Catapult Entertainment en 1996… y que resulta ser un «clon pirata» de la FF Confidential.

En otras palabras: en vez de usar la tipografía original usaron una copia «pirata», –si no en toda la campaña al menos en parte de ella– porque desde luego en los metadatos de los PDF aparece con el nombre XBAND Rough.

Esto recuerda un poco a cuando en las salas de cine y otros sitios de proyección (incluso se ha visto en TV) se rompe algo y aparece el VLC con el archivo .MKV de la versión pirata de un material que quizá tengan licenciado –o quizá no– aunque aquí para más inri el vídeo es un anuncio contra la piratería.

Y como pequeño homenaje aquí va la versión humor extremo del anuncio en cuestión, versión I.T. Crowd (Los informáticos donde no solo roban bolsos y coches sino también bebés, cascos de policía en los que luego cagarse, para enviárselos a sus viudas… Para robarlos de nuevo, más que nada por las consecuencias.

Relacionado:

Compartir en Flipboard Publicar
PUBLICIDAD


Por @Alvy

Text-wrap: pretty y otras técnicas CSS para hacer más bonito el texto de las páginas web

Hace poco una anotación sobre los subrayados me recordó poderosamente la evolución de la justificación del texto, esa técnica centenaria que actúa como un acordeón con las palabras y los espacios que hay entre ellas – a veces incluso con el interletraje– alineando a la vez a izquierda y derecha.

Ahora la mismísima Jen Simmons (desde hace algunos años trabajando para Apple) ha explicado los cambios más recientes que se están incorporado en el navegador Safari en artículo titulado Better typography with text-wrap pretty. El caso es que text-wrap: pretty; es una característica del CSS que ya existía en Chrome, Edge y Opera, aunque el cómo se aplicaba varía un poco de unos a otros navegadores.

Una historia justificada

Originalmente los libros se componían con tipos de metal, así que justificar el texto a ambos lados, aunque resultaba elegante, era tedioso y delicado. Se usaban unas varillas especiales para ello. Los periódicos, de hecho, usaban una combinación de texto en bandera (alineado a la izquierda) y justificado, según las secciones o la relevancia de la sección.

Con la llegada de las máquinas de escribir la cosa no cambió mucho; la mayoría de las tipografías que se usaban (ej. Courier) eran monoespaciadas, de modo que añadir espacios para que todo quedara justificado en su columna requería calcular mentalmente por anticipado (una vez pulsada una tecla no había vuelta atrás). Las primeras máquinas electrónicas con pantalla, normalmente de una línea, cambiaron esto un poco porque podían realizar una justificación bien calculada.

A todo esto los guiones para dividir palabras andaban por ahí. Normalmente eran una buena solución, pero hay que reconocer que muy elegantes no eran, porque tampoco coincidían siempre con el final de las líneas en cada columna. Con las impresoras y los primeros ordenadores esto mejoró un poco cuando muchos programas de tratamiento de textos empezaron a ser capaces de incluir reglas y diccionarios de división de palabras en puntos clave. Todo era más elegante y sencillo.

Justificar los textos se volvió tan normal que en muchos programas, como Word, era el valor por omisión. Eso sí, si se usaba mal, con texto demasiado grande o columnas muy estrechas podían quedar ríos de blancos, perfectamente visibles al mirar la página de lejos. Uno de los más notables: el texto de inicio de Star Wars.

Pero hete aquí que llegaron los navegadores web y el HTML. Sin diccionarios de división de palabras y con tamaños de columnas variables según manipularas la ventana, aquello era… una aberración tipográfica. Así que la Web nació «alineada a la izquierda» por simplicidad. De ahí aquello de el texto justificado no está justificado en la Web. Me gusta cómo lo definieron su uso: «… un intento de parecer serio y autoritario».

En las siguientes versiones del HTML y el CSS apareció el align="justify" para conseguir el efecto de justificado, así como mayores controles tipográficos. También surgieron hyphens: auto; y algún otro. Hasta que llegó Text-wrap: para embellecer el resultado.

El resultado es que algunas páginas web justifican el texto y otras no. A mí me gusta más sin justificar. Aun así, hay muchas maneras de decidir cómo dividir las palabras al final de las líneas para que todo quede más bonito, y eso es justamente lo que trabaja text-wrap.

Text-wrap: una forma de arreglar el desaguisado

La idea del Grupo de Trabajo CSS para Text-wrap: era que cada navegador se las apañara para hacer más bonito el resultado, gestionando la división de palabras, espaciado y palabras sueltas, demasiado largas o demasiado cortas, como buenamente pudiera.

El resultado busca:

  • Igualar la variación del ancho de las líneas.
  • Evitar los ríos de blanco.
  • Evitar las huérfanas (palabras sueltas al final de párrafo).
  • Priorizar las formas de dividir las palabras.
  • Aprovechar la división por guiones de las sílabas.
  • Aprovechar oportunidades de justificar.
  • Evitar demasiados guiones consecutivos.

El caso es que ahora existen todas estas opciones (que además se pueden combinar con otros valores globales y CSS relacionado, como el de los guiones:

text-wrap: wrap;
text-wrap: nowrap;
text-wrap: balance;
text-wrap: pretty;
text-wrap: stable;

La principal diferencia entre wrap y balance es que balance busca equilibrar las líneas y entre balance y pretty que pretty usa más técnicas y el resultado suele ser mejor. La diferencia se pude ver en esta demo, donde se pueden activar y desactivar los guiones, la justificación y el text-wrap: pretty.

Como curiosidad, decir que en Microsiervos tradicionalmente usábamos un CSS para los titulares (H1) sin guiones, pero desde hace meses cambiamos a text-wrap: balance; probablemente empezaremos a probar en breve con text-wrap: pretty; para que se vean más bonitos y se puedan leer mejor tanto en el escritorio como en los móviles.

Compartir en Flipboard Publicar
PUBLICIDAD


Por @Alvy

Con una narración con música de fondo un tanto psicodélica* aquí se explica cómo generar algunos efectos de vídeo mediante cámaras, proyectores, espejos y retardos. Al comienzo se describe cómo funciona un poco la cosa –y se puede apreciar lo artesanal del proceso y los «instrumentos»– y a partir del minuto 4:00 comienza lo divertido.

Todo un mundo de espirales, bucles dentro de bucles, fractales analógicos de alta definición y recreaciones que parecen galaxias, células, moléculas de ADN, árboles, insectos, tentáculos y lo que puedas flipar imaginariamente o si vas inspirado por alguna «sustancia».

La lista de efectos que se ven es larga, pero entre ellos están:

  • Captura de imagen residual
  • Bucle de retroalimentación (feedback) simple
  • Degradación progresiva de la imagen
  • Prolongación de la imagen mediante retardo
  • Bucle de retroalimentación con mezcla de imágenes
  • Retroalimentación cruzada entre dos monitores
  • Incremento de brillo causando inestabilidad extrema
  • Efectos fractales espontáneos
  • Transformaciones psicodélicas / caleidoscópicas
  • «Desmaterialización» de la imagen

El invento tiene el encanto de los chismes analógicos y el «fabríquelo usted mismo», los mandos de ruedecillas y los reflejos, y ¡todo sin ordenador! El autor se lo ha dedicado a Douglas Hofstadter, uno de mis autores favoritos y amo y señor de las autorreferencias.

Relacionado:

Compartir en Flipboard Publicar
PUBLICIDAD


Por @Alvy

De squircles y cuadrados redondeados

Liz y Kasturi examinaron la cuestión de los squircles y los cuadradados redondeados, un pequeño gran matiz de diseño que hace que estas formas geométricas se vean mejor y resulten más agradables a simple vista. Ya me sorprendió saber que squircle no tiene una traducción directa más allá de «cuadrado redondeado». Pero también que detrás haya tanta fórmula geométrica y curiosidades.

Las definiciones en la Wikipedia dicen que un squircle es «una forma intermedia entre un cuadrado y un círculo» y más allá todo depende de si se definen como una superelipse, la fórmula del squircle de Fernández-Guasti (que proviene de la óptica) el cuadrado redondeado o el círculo truncado.

Una forma interesante de entender la diferencia es superponer y restar las superficies de una y otra figura; la leve cantidad que no se solapa es la clave de su agradable redondez.

Entre sus usos como formas cotidianas están el aspecto de los iconos e interfaz de iOS, de algunas rotondas, platos, esferas de relojes, velocímetros e indicadores de coche y cosas así. Dicen que psicológicamente captamos más rápido las formas rendondedas suaves que las abruptas y picudas, así que quizá por eso resultan tan gozosos como visualmente placenteros.

Relacionado:

Compartir en Flipboard Publicar
PUBLICIDAD