5.1.1.

29 marzo 2005

El rediseño de Ciudad Internet

Categorí­a

Ignoro hace cuanto que ocurrió el rediseño de Ciudad Internet pero aprovecho para un par de comentarios.

Es curioso como, a pesar de que la idea de portal va (teoricamente) perdiendo efectividad, ciertos errores tan simples se mantienen.

  • Imagenes para reemplazar texto y para colmo sin alt.
  • Código horrible que (como se imaginaran) produce errores en Opera.
  • GIFs animados en las publicidades.
  • Un super escondida linea para los noticias de Clarin (parece que hubieran descubierto el código para hacerlo y lo metieron de prepo para impresionar).
  • DIVitis que produce horror.

Igualmente parece más ordenado de lo que venía siendo e incluso me resulta curiosa la aparición de una visible botonera (la naranja de 3 botones) para diferenciar secciones importantes.

Eso sí, parece que piensan seguir pateando por siempre el modificar páginas internas (como la de páginas personales).

27 marzo 2005

Six Include

Categorí­a

Lo que más me asombró de la provincia vecina a Korea es que los hombres se saludan con un apretón de manos. Pensar el tiempo que me llevó borrar esa costumbre y ahora en un minuto tuve que condicionarme a recordarla.

22 marzo 2005

El hack del guión bajo en Internet Explorer

Categorí­a

Una de las tantas formas de ocultar propiedades de CSS a Internet Explorer es lo que se conoce como hack del guión bajo y consiste en agregar este caractér al comienzo del nombre de una propiedad.

Normalmente el navegador debería ignorar aquellas propiedades que desconoce. Por tanto, el siguiente ejemplo debería ser ignorado.

p {_color: red;}

Mientras el resto de los navegadores toman a _color como una propiedad desconocida, Internet Explorer la reconoce como la conocidad propiedad color.

p {
color: green; /* leido por todos los navegadores */
_color: red; /* Sólo para Internet Explorer */
}

Hay que usar este hack con precaución, porque las reglas de cascada siguen vigentes. Dicho de otra manera, como Internet Explorer leería ambas lineas, una puede redefinir a la otra.

p {
_color: green; /* Sólo Internet Explorer */
color: red; /* Internet Explorer redefine el color */
}

La queja del validador

Si intentan validar una hoja de estilo que incluya este hack, el validador les dirá que no es valido. Técnicamente no es válido si se compara con la lista de propiedades existentes, pero sí es legal porque contaría como extensión propietaria según la especificación CSS2.1.

Vendor-specific extensions

In CSS2.1, identifiers may begin with '-' (dash) or '_' (underscore). Keywords and property names, beginning with -' or '_' are reserved for vendor-specific extensions.

¿Error de Internet Explorer?

Ni tanto. Aunque la conducta de Internet Explorer va claramente contra las reglas.

Rules for handling parsing errors

Unknown properties: User agents must ignore a declaration with an unknown property.

Más bien parece otro de sus metodos para hacer más fácil la vida de los demás al recuperarse de manera tan silenciosa al error del diseñador.

21 marzo 2005

Bug Opera: height con porcentajes y contenedor con padding

Categoría

Cuando una caja tiene definida la propiedad height con un valor en porcentaje, la altura se calcula de manera proporcional al de la caja que la contiene.

#padre {height:500px;}
#hijo {height:100%;} /* 100% del contenedor - 500px */

En Opera 7 y 8 beta 3, si el elemento contenedor tiene definido un padding vertical, el valor de éste afectará el calculo del 100% de la altura de las cajas que contenga. Opera parece calcular la altura del contenedor restandole además los valores verticales de padding.

Agregando un padding al ejemplo anterior:

#padre {height:500px;padding-top:10px;}
#hijo {height:100%;}

Siguiendo el ejemplo, el 100% de la altura para #hijo es el resultado de la resta de la altura de #padre (500px) y su padding (10px). Resultado: el 100% es 490px. Ejemplo 1.

Si la altura de #hijo fuera explicítamente 500px se mostraría bien.

Efecto gracioso: ¿que pasaría si el padding vertical fuera igual a la altura? 500px de altura menos 500px de padding da cero, por lo que ¡el elemento #hijo no tiene altura! Ejemplo 2.

Reportado como bug 165956 aunque seguramente será tomando como duplicado.

19 marzo 2005

Lectomanía a la Federico

Categorí­a

Federico (para que deje de hablar tanto de códigos y errores)

JEL me manda a hacer el meme Lectomanía así que calmaré su morbosa curiosidad. El pequeño problema es que conociendo a los hijos de Cortazar, sólo consideran digno de mención aquello que cuente como literatura (aka entretenimiento) por lo que mirar cada tanto una especificación no contaría como leer.

  1. ¿Cuáles fueron los últimos tres libros que leíste? (sin importar género ni clasificación)
    Los mejores cuentos de ciencia ficción, una recopilación de cuentos de Oscar Wilde y Boquitas pintadas de Manuel Puig, en orden inverso.
  2. ¿Prestados, comprados, robados y/o fotocopiados?
    Regalado, comprado y comprado.
  3. ¿Cuál estás leyendo ahora?
    Ya no leo aquello que consideran libros.
  4. ¿Algún libro en particular que querés leer y hasta ahora no pudiste por cualquier motivo?
    The CSS of Zen Design por ser la novedad pero no tengo tarjeta de crédito y Los siete locos pero me aburrí a la cuarta parte del libro.
  5. ¿Leés e-books? ¿Los imprimís para leerlos?
    Si e-books es una forma de referirse a los formatos propietarios, entonces la respuesta es no. Sumado a que tampoco tengo impresora. Pero llegado el caso, prefiero leer algo impreso antes que en pantalla.
  6. ¿Cuál fue el mejor libro que leíste en tu vida? ¿Y el peor?
    The Buenos Aires Affair de Manuel Puig quizás sea el mejor, pero está fuertemente influenciado por un valor emotivo y otro tanto fetichista. El peor son tres: Don Segundo Sombra en primer lugar, por ser terriblemente denso; Crime never pays, una recopilación de relatos de misterio que hacen leer al 90% de los que estudian inglés en institutos privados; y Zama por tener un final tan pedorro.
  7. ¿A qué siete personas les harás estas preguntas?
    No me interesa hablar de literatura con nadie, así que sólo a Diego como una forma de venganza.
18 marzo 2005

¡Devuelvanme a la vieja web!

Categorí­a

Insultos removidos para una lectura más amena.

Hablando sobre los nuevos propotipos de servicios (en beta) de MSN, Mariano en Start.com feeds a la Microsoft (Denken Über) dice:

encima compatibles o "camino de serlo" con Firefox (eso para los desconfiados)

Luego, en los comentarios:

saber que los tipos le dan soporte a FF en una aplicacion propia es un paso adelante

No, esto no va a ser un palo a Mariano (aunque no incluir body {padding:0px;} podría ser una razón (Sarcasmo)).

¡La web de los '90 ha vuelto! ¿Recuerdan esos locos tiempos en que los sitios hacían maravillas para funcionar en Internet Explorer y Netscape Navigator 4? Incluso había resignados que creaban dos versiones de la misma página, cada una optimizada para cada navegador.

El tiempo pasó y Netscape Navigator empezó a funcionar tan mal que practicamente todos se fueron del brazo de la competencia. ¡Netscape no funciona! ¡Usa Explorer! decían por todos lados. Los creadores de sitios notaron esto y convirtieron la costumbre de usar Netscape en una operación de hemorroides. Ese fue el comienzo de una epoca negra en la web.

Epoca de oro

Pero un día llegó Zeldman con su capa naranja y nos enseñó que podiamos usar CSS para que nuestros sitios se degradaran de una manera en que el usuario siempre pudiera acceder al contenido.

La web fue feliz. Los pequeños sitios y las grandes compañias optimizaban (medianamente) su contenido para lograr una (medianamente) mejorada experiencia para todos sus usuarios. Aunque no había colores ni fuegos artifiales para los navegadores más antiguos, igualmente eran respetados y bienvenidos —aunque lamentablmente advertidos muy amablemente de sus deficiencias.

La familia de código abierto

Entre los navegadores que se sentían comodos con los sitios optimizados según estandares estaba Mozilla. Después de haber estado ocultos en el olvido, los restos de Netscape Navigator habian dado forma a un navegador muy robusto (y pesado). Los nostalgicos usuarios de Netscape pudieron volver a navegar e incluso en mejores condiciones que su competidor Internet Explorer.

Tiempo más tarde Mozilla tuvo un hijo que pasó de pajaro a zorro; un navegador robusto como su padre pero mucho más agil. Los que lo conocieron lo amaron al instante. Entonces salieron a gritar a los cuatros vientos: ¡Internet Explorer apesta! ¡Usa Firefox!.

El patito feo se quedó feo

Las campañas de marketing en favor de Firefox fueron un exito. Hoy el 90% de los usuarios de internet usan Internet Explorer y el 50% usa Firefox —lease lo anterior con tono sarcástico. Y así comenzó la segunda epoca negra de la web.

Si antes el mensaje era La mayoría usa Internet Explorer así que no damos soporte para Netscape Navigator, el mensaje ahora es La mayoría usa Internet Explorer y Firefox así que no damos soporte para otras porquerías.

Ahora que los usuarios de Firefox también son una mayoria —como piqueteros en la web— son (muy) tenidos en cuenta. Pero como era de esperarse tanto poder los corrompió. Se volvieron egocentricos como lo fueron en su momento los usuarios de Internet Explorer, peleando sólo por su tajada del pastel.

¿Alguién todavía se acuerda de los navegadores alternativos? ¿Que pasó con los ideales de libre acceso al contenido? ¿Y con la idea de que Javascript debía mejorar la experiencia del usuario en lugar de limitarla? ¿Que tienen Start.com o Gmail tan especial que sólo admiten a un grupo tan selecto?

Cuando en los comentarios de Start.com feeds a la Microsoft menciono el poco probable soporte para Opera, la respuesta de Mariano, bienintencionada y amable, representa el típico pensamiento (que vengo viendo) del usuario de Firefox: funciona en mi navegador, ¡todo bien!.

Los viejos sitios plagados de tablas quizás se veían desprolijos, pero al menos se podían leer.

Los nuevos sitios, las nuevas tecnologías, los nuevos usuarios (edición bien intencionada: principalmente los que además son desarrolladores, según los comentarios)… ¡Vayansé ya saben donde!

17 marzo 2005

Bug IE y Opera: margin-bottom, float y clear

Categoría

Para que no haya tendencias contra un único navegador, el bug en Internet Explorer involucrando margin-bottom, float y una caja no flotante también puede ser adaptado a Opera.

Repitiendo el esquema de tres DIVs, las diferencias son:

  • El segundo DIV puede tener cualquier ancho.
  • El tercer DIV debe tener definida la propiedad clear en la misma dirección en que el anterior elemento está flotando (o simplemente estar definida como both.
#uno {margin-bottom: 10px;}
#dos {float:left;}
#tres {clear:left;}

Pueden verlo funcionando en el ejemplo 1.

De esta forma el bug también se repite en Internet Explorer 5, 5.5 y 6. En Opera aparece en la versión 7.54, 7.23 y 8 beta 2 (por lo seguramente se extiende a todas las versiones 7). Opera 5.12 interpreta bien el ejemplo y seguramente las versiones 6. Por tal, sospecho que este es uno de los nuevos bugs que aparecieron con la reescritura completa del engine que hicieron para la versión 7.

Las soluciones para este bug se basan en evitar que el margen toque el elemento flotante.

Solución para Opera

Opción 1
Agregar un elemento de tipo bloque entre el margen del primer elemento y el elemento flotante. Ejemplo 2.
<div id="uno"> Elemento con margen inferior </div>

<div> <!-- elemento vacio --> </div>

<div id="dos"> Elemento flotante </div>
Opción 2
Encerrar el elemento flotante en un DIV (sin ninguna propiedad definida). Ejemplo 3.
Opción 3
Encerrar al elemento flotante y al siguiente (#dos y #tres) en un DIV (sin ninguna propiedad definida). Ejemplo 4.

Solución para Internet Explorer

Las soluciones que funcionan en Opera deben ser levemente modificadas para funcionar en Internet Explorer. En caso de usar cualquier de ellas, el nuevo DIV tener definida la propiedad height con un valor de 1% o 1px. Tené en cuenta de ocultar esa definición para los demás navegadores. Ejemplo 5, ejemplo 6 y ejemplo 7 respectivamente.

Bug Internet Explorer: margin-bottom, float y una caja no flotante

Categorí­a

Cuando una caja tiene definido un valor para margin-bottom simplemente debería mover el borde limite superior de la siguiente caja flotante un X valor hacía abajo.

Tenemos tres DIVs dentro del BODY:

  1. Al primero sólo se le definió un margin-bottom de 10px.
  2. El segundo está flotando (no importa el lado) y ocupa el 100% del contenedor.
  3. El tercero no tiene ninguna propiedad en partícular.

También puede lograrse definiendo un ancho para el primer y segundo DIV si la suma de ambos es mayor que el ancho del contenedor.

Todo lo anterior en el mismo orden puede traducirse a CSS como:

div#uno {margin-bottom:10px;}
div#dos {float:left;width:100%}  /* el width:100% es sólo para asegurar que ocurra */
div#tres {}

Lo normal sería que la segunda caja (la flotante) se ubique 10px debajo de la primera (por el margin-bottom) y la tercera sea visible justo donde termina la anterior.

Internet Explorer 5, 5.5 y 6 agregan a la caja flotante un margen inferior equivalente al del elemento anterior. En este caso, #dos tiene magicamente definido margin-bottom: 10px. Ejemplo uno.

Agregadas las soluciones para este bug.

Dato anecdotico: Internet Explorer 4 no sufre de este bug.

16 marzo 2005

Petición contra Autolink

Categorí­a

En PetitionOnline.com existe actualmente una petición contra Autolink titulada Google, Let Our Pages Go!. No piden la remoción de esta herramienta sino la posibilidad (oficial) de tener un control sobre los enlaces agregados.

Si Defendiendo a Autolink de Google no los detiene, corran a firmar que todavía hay poca gente convocada.

Por cierto, ¿no resulta ironico ver un AdSense en medio de las firmas?

15 marzo 2005

3 columnas iguales con position: absolute

Categorí­a

Cierta persona me consultó hace poco sobre cómo hacer un esquema de 3 columnas y el problema en particular que tenía usando position: absolute.

Probe con position: absolute y dandole el margen a la izquierda anda bien, sólo que el fondo no se estira junto con el contenido, y queda para la mierda…

Este problema era bastante esperable. Una caja con posicionamiento absoluto es explícitamente desplazada con respecto a su bloque de contención (Posicionamiento absoluto). Dicho de otra manera, la caja que tiene declarado position: absolute deja de existir para su bloque de contención (el que contiene al elemento), por lo que este segundo no está obligado a estirarse para contenerlo. Para colmo viejos trucos como clear: both no funcionan para este tipo de situaciones.

Posiblemente lo que voy a comentar ya aparezca en otro tutorial (en inglés) pero no es mi proposito comentar ésto como una novedad sino como un ejemplo de imaginación y de poder aprovechar los elementos disponibles.

¿Por qué position: absolute en lugar de float?

Todo está en el orden que tienen las secciones (de contenido) en el código. Para una mejor indexación y mejor experiencia cuando las hojas de estilo están desactivas se recomienda incluir primero el contenido más importante del sitio, seguido por aquellos en orden de importancia decreciente.

Supongamos que el proyecto incluye 3 secciones lo bastante largas como para merecer una columna: una que enlace las diferentes secciones del sitio, una segunda con el contenido principal, y una tercera con contenido secundario. Siguiendo los consejos sobre el orden del código, tendríamos lo siguiente:

<div>
 Contenido principal
</div>
<div>
 Contenido secundario
</div>
<div>
 Menú
</div>

La intención es poder ubicar el contenido secundario a la izquierda, el contenido principal en el centro y el menú a la derecha. A los fines de un más fácil seguimiento a los DIV de cada sección se les definirá un id con un valor izquierda, centro y derecha respectivamente.

<div id="centro">

 Contenido principal
</div>
<div id="izquierda">
 Contenido secundario
</div>
<div id="derecha">
 Menú
</div>

Si usaramos float saltarían dos problemas sin solución:

  1. No existe un valor center para poder ubicar el DIV central.
  2. Un elemento flotante se ubica siempre después de los elementos que lo preceden. Aunque el DIV central les hiciera lugar, los DIVs flotantes de los costados no pueden magicamente elevarse para alinearse con éste.

Solución: la libertad de position: absolute.

El secreto mejor guardado de position: absolute

Normalmente una caja es posicionada absolutamente con respecto al elemento BODY en lugar de su bloque contenedor. El truco es que este último esté definido como position: relative. Entonces incluiremos un cuarto DIV que contenga a los otros tres (y permita centrarlos más facilmente).

<div id="contenedor">
 <div id="centro">
  Contenido principal
 </div>
 <div id="izquierda">
  Contenido secundario
 </div>
 <div id="derecha">

  Menú
 </div>
</div>

Definiendo las posiciones con CSS

Por cuestiones de limitacies en el truco, hay que recurrir a un ancho fijo para el elemento contenedor.

#contenedor {
 position:relative;
 width:600px;
 margin:auto;
}

Cada columna tendrá las siguientes medidas:

#centro
300px
#izquierda
200px
#derecha
100px

Para la columna central alcanza con que su ancho no se extienda tanto como para quedar tapada por las siguientes. Definiremos un margen de 200px a la izquierda y de 100px a la derecha para dejar lugar a las siguientes secciones.

#centro {
 width: 300px;
 margin-left: 200px;
 margin-right: 100px;
}

Ahora ubicaremos absolumente las dos columnas siguientes:

#izquierda {
 width: 200px;
 position: absolute;
 top:0px;
 left:0px;
}

#derecha {
 width:100px;
 position:absolute;
 top:0px;
 right:500px;
}

El esquema para este momento debería verse igual que el ejemplo 1.

Finalmente la solución: Aplicando un fondo

Para lograr el efecto de columnas igual habrá que usar una imagen de fondo. Crearemos una de 600px de ancho por 1px de alto coloreada según lo que se vé en el ejemplo 1 —100px desde la izquierda de color #CC0, 200px desde la derecha de color #0CC y el resto en el centro de color #0C0. Imagen de fondo.

El problema es a qué elemento aplicarle este fondo. Una solución sería aplicarla al DIV contenedor que tiene la obligación de extenderse tanto como sea necesario para contener a la columna central. El problema es que la columna central siempre debería ser más larga que sus adyacentes. Solución descartada por no ser infalible.

El truco es simple: el fondo aplicado al elemento body se extenderá siempre hasta contener todos los elementos de la página. Aplicaremos la imagen de la siguiente forma:

body {
 background-image:url(fondo.gif);
 background-position:top center; /* para que se muestre centrada como la columna contenedora */
 background-repeat: repeat-y; /* sólo debe repetirse verticalmente */
}

Pueden ver el ejemplo 2.

Aplicando una cabecera y un pie de página

Aplicar una cabecera es una tarea muy fácil. El DIV contenedor nunca fue removido de su lugar, por lo que sigue estando afectado por los elementos que lo rodean. Si hay un elemento de tipo bloque antes del DIV contenedor, éste último se ubicará debajo sin mayores complicaciones.

<div id="cabecera">

 <h1>Título de la página</h1>
</div>
<div id="contenedor">
 (las tres columnas irían aquí)
</div>

Es recomendable especificar un fondo a la cabecera para que tape el fondo de 3 columnas. Ejemplo 3.

El asunto del pie de página no es tan sencillo. El DIV contenedor crece con la columa central, no con los elementos posicionados absolutamente, por lo que se vuelve imposible (con CSS) controlar que el pie de página se ubique justo debajo de todas las columnas. Una solución sería ubicarlo también absolutamente en el borde inferior de la página pero habría que controlar muy minuciosamente su altura para que no tape el contenido de las demás. La solución más segura es crear otra caja con las mismas propiedades que la columna central, pero ni así sería suficiente. Ejemplo 4.

Conclusión

Pues no debería haber mayor problema entre navegadores. El único que se quejaría sería Internet Explorer 5 pero por problemas ajenos a este tutorial.

Pequeño descargo: quienes conocen demasiado de CSS notarán un pequeño desliz en el código pero dada la simpleza de la intención y la compatibilidad los ejemplos propuestos son suficientes.

13 marzo 2005

Propiedades por defecto de los elementos en HTML

Categorí­a

Para que no digan que DIV tiene un margin o padding definido por defecto, pueden leer el Apéndice A: Una hoja de estilo de ejemplo para HTML 4.0. Igualmente cuidado al leerla porque se les escapó un error bastante serio.

ADDRESS,
BLOCKQUOTE, 
BODY, DD, DIV, 
DL, DT, 
FIELDSET, FORM,
FRAME, FRAMESET,
H1, H2, H3, H4, 
H5, H6, IFRAME, 
NOFRAMES, 
OBJECT, OL, P, 
UL, APPLET, 
CENTER, DIR, 
HR, MENU, PRE   { display: block }

Esa definición está mal. Todos esos elementos deberían estár definidos como display: block. Sí, ya lo reporte. Ya corrigieron el error. El post refleja el cambio.

También pueden leer la versión en inglés en Appendix A: A sample style sheet for HTML 4.0.

Como bien aclara al principio, los desarrollares de los navegadores no están obligados a respetar estos valores a rajatabla, por lo que se da el caso de Firefox prefiriendo padding para el elemento UL y el antes mencionado junto con Internet Explorer eligiendo margin para BODY. Nota para susceptibles: nada de lo anterior intentó ser agresivo.

12 marzo 2005

La importancia de los elementos en HTML

Categorí­a

En El mito de la semántica en la web comentaba como con CSS uno podría recurrir a puros elementos SPAN y aplicarles estilos para hacerlos actuar como otros elementos y engañar a diferentes usuarios. Aunque al final reconozco la importancia que tienen los elementos ya reconocidos, quizás terminó siendo algo confuso (ver los comentarios del post), por lo que incluyo ahora la recomendación que aparece en las especificaciones de CSS 2.1 (en inglés) que explican más resumidamente lo que yo divague.

CSS le otorga tanto poder al atributo class, que los autores podrían conceptualmente diseñar su propio lenguaje del documento basados en elementos con casi ninguna presentación asociada (tales como DIV y SPAN en HTML) y asignando información acerca del estilo a través del atributo class. Los autores deben evitar esta práctica ya que los elementos estructurales de un lenguaje de documento comúnmente tienen significados aceptados y reconocidos mientras que las clases definidas por el autor no pueden tenerlos.

Extraido de Selectores de clases.

11 marzo 2005

Soporte de labels en Gmail

Categorí­a

Mi error, mi error. Esto pasa por no hacer suficientes pruebas. Resulta que contrariamente a lo que yo había dicho (ver Gmail se acordó de los pobres), Gmail soporta la función de labels y filtros en la interfase basic HTML.

Lo que no deja claro el anuncio oficial es que en la versión reducica es imposible crearlas pero eso no quita que siguen funcionando normalmente. O sea que es cuestion de usar el otro navegador para los temas de configuración.

Por cierto, es una pena que no exista una interoperabilidad entre los servicios de correo y los programas para su manejo para que el correo pueda ser filtrado (localmente) según la etiqueta.

También por cierto, gracias a Peste que sin que se diera cuenta me hizo dar cuenta (Sarcasmo).

09 marzo 2005

Los tags de Technorati (y la folcsonomía en general) son sobrevaluados

Categorí­a

Aunque el post gira sobre los servicios de Technorati, ciertos puntos pueden ser extendidos a otros servicios de internet que se basan en la folcsonomía (como del.icio.us en partícular).

Introducción

Extraido de la definición de folcsonomía en la Wikipedia:

… categorización colaborativa por medio de etiquetas simples en un espacio de nombres plano.

O sea que es la gente ordena dentro de categorías creadas por ella misma. Aplicado al ámbito de internet sería clasificar los recursos, como posts en el caso de los blogs o fotos en caso de Flickr, aplicandoles etiquetas para que servicios automatizados puedan reunirlos dentro de una misma categoría. De esta forma, cuando un usuario investiga la categoría Madonna en Technorati encontraría los documentos más recientes relacionados con la cantante.

Finalizada la introducción, pasaré felizmente a la queja.

El atríbuto abusado

Pobre del atríbuto rel. Pensado para explicar las relaciones entre documentos, terminó haciendose conocido por el valor alternate para enlazar los archivos de suscripción, Google lo encontró indefenso a la hora de usarlo para el infame no-follow y ahora lo rematan con el valor tag. Personalmente hubiera usado chapter para las categorías de un blog y que luego de ahí Technorati las extrajera. O quizás otro atríbuto que explique que uno está enlazando otro documento que funciona como repositorio. Es más, empiezo a sospechar que debería ser rev en realidad.

Igualmente rel no es el punto de este post.

Tocayos

La maravilla (inserte aquí algunas estrellitas) de este nuevo metodo de categorización es que es construido desde el suelo hacia arriba por nosotros, no por una máquina o por 3 moderadores poco imparciales (cita: La necesidad de usar tags para las categorías). Reformulado lo anterior sería que los mismos usuarios que generaron el contenido son los que clasifican sus recursos (en lugar de un programa automatizado que debe hacer suposiciones aka cualquier buscador). Aparentemente quién imaginó este método y lo vió como una utopía no recordó un detalle importante: la gente es tonta (en el sentido de su rechazo a la idea de pensar demasiado) y necesita ser controlada.

Voy a poner un simple ejemplo de como una persona promedio es peligrosa. Suponiendo un sujeto X que escribe un artículo sobre el navegador Opera, lo más probable (aparentemente) es que lo termine etiquetando simplemente como Opera. Suponiendo un sujeto Y que escribe sobre Cecilia Bartolli, lo más probable es que (entre otras categorias), termine etiquetando su artículo como Opera. Podés revisar la categoría Opera en Technorati para apreciar como se mezclan los contenidos. Otros casos son los de bug que reune tanto a los insectos como a los errores de programa como cookies que practicamente ignora lo referente a las cookies como archivos.

La necesidad de control

El mejor ejemplo de darle poder al pueblo sin que el poder los termine matando es la Wikipedia. Cuando un contenido no es el apropiado, se lo borra. Cuando dos nombres para distintos temas se superponen, se crean distintas entradas. En la Wikipedia existen entradas diferenciadas para la ópera como expresión artística y el navegador Opera.

Entonces aunque uno tiene el poder de contribuir, no llega a ser un poder absoluto al estar moderado en el fondo por los símpaticos 3 moderadores poco imparciales.

Demasiado especifico

Curiosamente diferentes intentos de encontrar categorías formadas por dos palabras no dieron resultados. De ahí se desprende que el usuario promedio tiene una marcada tendencia a simplificar (y a generalizar como comentaré más adelante).

Para evitar la contraproducente —contraproducente contra el concepto de folcsonomía— opción de la moderación, imaginemos que la gente nota el problema de los tocayos. ¿Es más adecuado una categoría llamada Opera Browser, Opera_Browser, Opera-Browser ó Browser Opera (por no mencionar Opera UA)?

Metelo ahí

Personaje 1
¡Agregaste un artículo en la categoria de CSS! ¿De qué se trata?
Personaje 2
Ni idea. Ví que decia CSS un par de veces así que lo metí ahí.

Esto se vuelve un problema frecuente (y no sólo por ser categorías importantes). La gente mete cualquier cosa en cualquier lado. Hace poco revisando la categoría CSS en Technorati encontré un enlace a un post de alguién que se limitaba a decir que había rediseñado su blog. Es valido decir que existe una relación pero es exagerado reconocerla como un aporte al tema.

Otro caso de recursos que son extremedamente generalizados son los posts personales. ¿Qué puede terminar cayendo en esa categoría? Los posts de los blogs que se dedican a llevar registro de la vida cotidiana del autor probablemente no, porque justamente estos blogs crean varias categorías específicas para lo que otros generalizarían como personal. ¿Que hay del resto? En un caso, la categoría personal podría contener principalmente posts que cuenten pequeñas anecdotas fáciles de entender. En otro blog que quizás tiene una temática muy específica (por ejemplo Uberbin con las empresas y la tecnología) un post personal podría ser una crítica al gobierno por contener una visión muy subjetiva del tema. En un tercer blog podría ser una cita de un poema que sólo tiene sentido para quien lo citó.

Ayudando a meter basura

O dandole poder a todos. Wordpress ¿desde su versión 1.5? agrega a los enlaces de las categorías el valor tag para que los posts sean indexados por Technorati. Ésto seguramente está provocando la aparición de varias categorías que en realidad son la misma o categorías que casi no merecen ser categorías.

Para el primer caso podemos imaginar como ejemplo un blog que reune poesías en una categoría llamada mis hermosas poesías y que terminará con sus posts totalmente desconectados de la categoría poesía (medianamente) más apropiada. Y no, la opción de categorías relacionadas no es la solución.

El segundo caso se podría aplicar a los metaposts (posts que hablan del blog). Tomemos el caso de Lewenhaupt (sin animo de ofender, señor). JEL, su autor, reune sus metaposts en una categoría títulada como su blog. Esto lleva a que Technorati haya creado una categoría especifica para eso. Es como querer enterarse de lo superficial evitando a toda costa el contenido del blog. Alguien podrá decir que la ventaja de esto es que aplicado a otras categorías, el usuario visitante puede filtrar aquellos posts que no son de su interes, pero por un lado, para eso se crearon las categorías y si el interes viene de tener un archivo de suscripción para la categoría específica, éste debería ser una función de los propios manejadores de contenido —CMS para los amigos— y no depender de un tercero que terminaría corriendo mayor riesgo de saturarse.

¿Nos conocemos de antes?

Durante un tiempo estuve suscripto a la categoría CSS de del.icio.us. Practicamente todos los días alguien enlazaba al CSS Zen Garden. ¡Se necesita un control ahí! Si del.icio.us se toma la molestía de almacenar indefinidamente los diferentes enlaces es para que puedan ser investigados. O quizás es todo un plan para hacernos recordar algo mediante la técnica del hartazgo.

Siguiendo con del.icio.us, el otro problema (que algunos vieron como algo interesante) es la posibilidad de titular los enlaces aportados y ver qué considera cada persona como el título más apropiado. Por ejemplo, al agregar un recurso sobre operadores lógicos a la categoría algebra, ¿cuál es la utilidad de que alguien muy inspirado lo titule como esa cosa por la que me bocharon en la facultad?

La regla de los cinco minutos

En ALT1040 se dá está conversación en los comentarios del post La necesidad de usar tags para las categorías.

Alberto (visitante)
Los keywords (agregado por Federico: <meta name="keywords" content="…">) dejaron de tener utilidad, por el abuso que se hizo de ellos por páginas de todo tipo. ¿Que tienen de diferente los tags para que no acaben igual?
Si con las keys se hace spam a lo bestia y por eso no sirven, cuando los tags se empiecen a conocer un poco más y salgan del mundo blog, ¿no serán usados abusivamente?
Eduardo Arcos Barredo (autor del artículo)
El mismo problema se proponía con sistemas fuertemente dependientes en el aspecto social, por ejemplo Wikipedia; la solución es sencilla: somos muchos. Si hay 20, 30, 40, o 50 usuarios con 20 o 30 fotos cada una, lo más probable es que las imágenes basura lleguen a aparecer unos 5 minutos, entre la cantidad de usuarios que estan posteando fotos todo el día más el hecho que puedes reportar fotos en Flickr (y lo hace muy bien), más la misma gente observando el contenido puesto por la gente, esto no aparecería más que 5 minutos.

En la categoría CSS me cruce con dos posts totalmente huecos (posts de pruba más específicamente que había sido públicados hace 11 horas.

Aún siendo benevolente, y suponiendo que esos artículos aparezcan sólo durante un par de horas, el daño es inevitable. Hay una diferencia importante entre del.icio.us y Technorati; el primero almacena los contenidos por tiempo indefinido, mientras que en el segundo un recurso se mantiene promocionado mientras no haya otro más nuevo. Siendo así en el caso de Technorati, un buen (o excelente) recurso puede ser victima de los que meten posts en cualquier lado.

Una posibilidad para salvarse de tan trágico destino es mantenerse revisando la categoría con regularidad (usando una suscripción a los archivos de sindicación) pero eso no quita que uno termina siendo avisado incluso de aquello que es irrelevante.

Descubriendo la bomba atómica

Perdonemos a aquellos que arman lio con los nombres de las categorías. Son simples inexpertos que no buscan lastimar a nadie. Salvo cuando al trillado post de ¡modifique mi template! lo terminan metiendo concientemente en todas las categorías que se les ocurren.

En la captura anterior puede verse como alguien (por no quemar a nadie) categorizó su post en

  • General
  • Desarrollo Web
  • XHTML
  • CSS
  • PHP
  • Muy Personal
  • WTH???
  • Internet
  • Bitacora Interna

¿Muy personal y XHTML al mismo tiempo? ¿Acaso algúna porción de código que sólo tiene sentido para él?

Bitácora interna

Aunque hay que reconocerle que me dió una buena idea. ¿Que les parece algunas categorías en Technorati para este blog que se llamen 511-CSS, 511-HTML, 511-Personal y 511-Internet? De esa forma, quien no quiera revanarse el cerebro entendiendo sobre algún tema específico sólo tendría que suscribirse a la categoría específica. Por supuesto que ésto se aplica a los pobres que usamos Blogger, no a los geeks que pueden instalarse un Wordpress y que deberían tener esa función de fabrica.

Search is dead

Una de las ventajas que escuche sobre este sistema encontrar sitios que no aparecen al inicio de la lista que da una consulta con la misma palabra en Google (cita de Tagging: Una "deliciosa" manera de navegar la web (1)). Pero si necesito información sobre los (múltiples) bugs de IE, ¿donde busco? ¿IE, Internet Explorer, Internet Explorer Bugs o Internet Explorer Bug? Puede ser interesante cuando un grupo se pone de acuerdo en una etiqueta. Volviendo a un ejemplo anterior, las posibilidades de encontrar recursos sobre la cantante Maddonna fuera de la categoría homónima son bajos, pero cuando necesitas información muy específica, el límite de 32 palabras de de Google son de gran utilidad.

Conclusión

Antes que nada, ¿me parece o Technorati no ofrece suscripciones para cada etiqueta?

Es interesante desde un punto de vista sociólogico ver como distintas personas catalogan de manera a veces muy dispares el mismo recurso (suponiendo que el grupo estudiado sea sincero) pero no creo que tenga demasiada utilidad para quien busca mantenerse informado. Si se trata de conseguir información de calidad, siempre existe la posibilidad de que alguien haga un week log o un blog scouting del tema de nuestro interes.

Sobre el poder de la gente y la falta de control, solo puedo responder con una frase: Pegame y categoriza mis posts.

Enlaces relacionados con el tema en Tags & folksonomies: etiquetas semánticas y taxonomías sociales.

08 marzo 2005

Maldito día de la mujer

Categoría

A vos, que me pegaste un codazo para sentarte antes que nadie en el micro.

A vos, que cuando yo cedí el asiento para discapacitados, te fuiste a sentar corriendo como la loca desesperada que sos.

A vos, que histeriqueas en lugar de decir las cosas de frente.

A vos, que no te calienta nada más que salirte con la tuya.

Que te pensas que podés colarte en la fila sólo porque tenes las tetas más hinchadas que yo.

Federico para representante de los misoginos. Con razón me hice puto.

05 marzo 2005

GMail se acordó de los pobres

Categoría

¿Problemas con Opera 8 beta y Gmail? Lean al final.

Finalmente, despues de muchas discusiones (no posteadas) sobre cuanto odiaba el abuso de Javascript en Gmail, los muchachos crearon una versión usando puro HTML que funciona en navegadores que no soportan las avanzadas tecnologias.

Al ingresar a la interfase de correo, un llamativo cartel nos anuncia que deberíamos usar otro navegador para obtener lo mejor del servicio.

Según la versión oficial (Where have all the features gone?), la versión basic HTML carece de:

  • Filter creation
  • Settings
  • Spell checker
  • Keyboard shortcuts
  • Address auto-complete

¿Filter creation y Settings no disponibles? ¡Parece un chiste! Ambas son páginas para configurar el servicio; ¿qué tanto les costaba habilitar un par de formularios? Como si la idea de filtros fuera una novedad.

Una de las razones por las que se podía defender la decisión de Gmail de abusar de Javascript era el ahorro en pedidos al servidor, lo que también influye sobre la velocidad de la interfase. Pero para ser sincero, en mi Opera 7.54 todo funciona a una velocidad respetable e incluso mejor. ¿Por qué mejor? ¡Simple! Yo recuperé algo que ustedes perdieron: el botón para retrodecer una página y la posibilidad de abrir enlaces en una nueva ventana. Que mal esta gente. ¿Qué diría Nielsen si se enterara?

Por cierto, aunque no lo aclaran, también parece que se perdió la posibilidad de seleccionar los mensajes (¿alguna explicación convincente?). También habría que avisarles que se olvidaron de sacar el cartelito de labels, bastante molesto ahora que no están disponibles. La función labels se mantuvó en esta interfase (ver Soporte de labels en Gmail).

Aún con todo lo malo, Gmail tiende a caerse menos que Hotmail, por lo que tendré que considerar seriamente cambiar el servidor de correo.

Haciendo pruebas

  • Opera con Javascript desactivado perfecto. En principio aparece un mensaje informando que se necesita Javascript para un mejor servicio y finalmente incluye un enlace a la versión basic HTML.
  • La segunda prueba más bizarra: Netscape 4.8 funciona perfectamente también. La interfase se conserva bastante bien — no me imagino el trabajo que les habrá costado hacer funcionar algo en este horrible navegador, aunque con el abuso de tablas que es el código, no me extraña que funcione. La única diferencia con el caso de Opera es que uno es directamente redirigido a la versión basic HTML sin advertencias previas.
  • La prueba de fuego, Lynx: ¡funciona! ¿Lamentablemente? ingresar es todo un desfile de cookies y el orden elegido elegido para los enlaces… la interfase apesta. Se degrada muy mal y se convierte en todo un trabajo alcanzar la opción que uno necesita e incluso encontrarla primero.

Gmail parece estar haciendo algun tipo de filtrado según nombre de navegadores (browser sniffing) y manda a Opera 8 beta 3 a la interfase basic HTML a pesar que de la avanzada funcionaría perfectamente. La solución es ingresar usando esta URL: http://gmail.google.com/gmail?nocheckbrowser.

03 marzo 2005

Defendiendo a Autolink de Google

Categorí­a

Más alla de los roces que tengo con los servicios de Google, esta vez me toca hablar bien de la última incorporación a la Google toolbar (beta 3) conocida como Autolink.

Para los que no lo conocen (¿quedará alguién?), la función de Autolink es convertir ciertas frases y palabras en enlaces. De momento, según Zeldman en Protect your site from Google’s new toolbar, Autolink convierte las direcciones en EEUU en enlaces al servicio de Google Maps y los números de ISBN de los libros en enlaces a Amazon.

Como era de esperarse la reacción general de quienes generan contenido para internet fue de desprecio total, sobre todo por haber reavivado al fantasma de las Smart Tags que en su momento Microsoft incluyó en la beta de IE6.

La principal razón para el rechazo es que sin planearlo, un sitio puede terminar generando tráfico para otro, como en el caso de la tienda de libros Barnes & Noble cuyos números de ISBN se convertían en enlaces a Amazon. También se iza la bandera de la propiedad intelectual, acusando a Google de modificar contenido protegido por copyright.

Si la idea de que alguien te modifique la página te aterra, hay dos soluciones fáciles:

La parte de la defensa se puede resumir a una frase: ¡tu contenido es mio! Aunque no haya tenido que pagar por él, lo que estoy viendo en mi pantalla es una copia a la que, si quiero, debería poder cambiar su diseño, directamente borrarla con algo como body {content:"Esto apesta";} o agregarle un link de manera automatizada. ¿Acaso creen que si veo el título de un libro no voy a salir a buscar información sobre el mismo? Evitando que la Google Toolbar agregue un enlace como sugerencia, sólo están haciendome tardar un paso más hacía lo que busco?

¿Derechos de autor? ¡Tonterías! Como mucho tengo prohibido distribuir la versión modíficada, pero mientras la página esté almacenada en el cache de mi disco, tengo libertad sobre ella.

¿Molesto porque Google puede llegar a sacar beneficios económicos? Podrías cobrar para acceder a la información (y aún así, luego Google Toolbar y yo nos encargaríamos de modificarla).

La única contra que este sistema puede tener es que los enlaces patrocinados no sean claramente distinguibles de los que autor original agrego. Al fin y al cabo que el autor tiene una reputación que mantener, y un enlace a uno servicio que uno defenestra puede resultar contradictorio.

Powered by Blogger