Tzek Blog de Diseño

Actualización a 13 de julio:

Sí fui a un CAC Telcel en Puebla este viernes 11 de julio. Ya estando ahí, no había magia, como en las fotos vistas de Internet, sino una aburrida cola para mucha gente que estaba ahí viendo sus cosas y problemas con respecto a sus celulares. Al final decidí no esperar tanto porque sí dude en pedir informes sobre la contratación porque 24 meses, ya no me llamaban la atención. Me salí de la cola y sinceramente, ya no me dieron ganas de saber más sobre el iPhone ese día.

Plan 1 de renta mensual del iPhone con Telcel en México:

• $459 pesos (USD 45 aproximadamente).
• 100 MB incluidos.

Redondeando a 500 pesos…

• Si me gasto por codo (ávaro) $50 al 2×1 en el cine, lo más barato, entonces mi renta mensual equivale a ir 10 veces al cine acompañado y echarme casi 20 horas de diversión y unos minutos extras de charla con colegas y cuates.
• Si fuera como en gringolandia (EE.UU.) donde en lugares como starbucks puedo conectarme al iTune store y bajar mis canciones de 10 pesos aproximadamente, cada canción de 4 megas me limitaría a bajar en teoría 25 canciones, pero la neta entre “yu-tube”, “mai-espeis” o qué se yo… digamos que me reservo 5 megas, muy austeramente hablando. El valor promedio de un CD con 15 canciones en México es de 160 pesos (15.5 USD aproximadamente).
• Con 500 pesos compro no se cuantos chocolates-centenarios (de esos que parecen monedas de oro) y puedo tirarlos en el piso, hacer “angelitos” y sentirme “Mc Pato” un rato.
• Esos 500 pesos equivalen a un 70% de moverme en taxi en la ciudad de Puebla.
• Una buena cena, para una ocasión especial, en un lugar tranquilo, no muy “shic” o “naiz”, llega a 500 pesos. Para dos personas, como dije, algo tranquilo, sobretodo en consumir bebidas alcohólicas.
• 500 pesos representa 1/5 de la tarifa básica de la mensualidad de un carro. Interesante perspectiva, si en el futuro he de tener 5 iPhones en tarifa básica y ando en camión, entonces definitivamente algo estaré haciendo mal.
• No con 500 pesos, pero sí con 2 cargas de a 200 pesos máximo al mes, le pongo crédito a mi celular y me los acabo de volada… ¿será un gancho la tarifa 1 del iPhone para compulsivos como yo?

Es claro que existen ciertos tipos de usuarios en la web, según su nivel de experiencia en navegación. Cuando diseñamos para la Web, pensamos mucho “si el usuario principiante hace X, entonces pasará Y”, o “si el usuario avanzado se encuentra en U, entonces podrá irse a V”. Por otro lado una de las premisas del web es nunca asumir que el usuario llegará por tu home o index. Creo que el Google ha hecho esta idea más verdadera que nunca. 

Quiero enfocarme en una situación real en cuanto a los subdominios, pero pero primero un comentario breve con respecto a la selección de dominios: sí es importante cómo “llamar” a nuestra página. 

El caso de www.tzek-design.com es un ejemplo de lo que no debe hacerse. El guión y el manejo de una palabra en inglés, complica las cosas. Ya sé, ya sé… consecuencias de una decisión rápida y no bien pensada. No lo intenten en sus casas si desean tráfico.

Regresando a lo del subdominio y los usuarios. Algo que se nos pasa es pensar que los usuarios, ya sean novatos o expertos, sabrán introducir la URL correctamente en la barra del navegador. Falso; existen usuarios que pueden tener un nivel “decente” de navegación (browsing/surfing) pero no necesariamente se han preocupado por estas cuestiones del dominio.

Una diferencia clara entre uno y otro es la palabra “www”. Por ejemplo http://www.yomero.com/blog puede publicitarse (en banners, impresos, anuncios, etc.) como http://blog.yomero.com o bien, solamente blog.yomero.com.

Alguien experto toma rápidamente blog.yomero.com, pero un usuario que no se fija en esas cosas sí pone www.blog.yomero.com o bien, http://www.blog.yomero.com, y no siempre tenemos prevista esta situación.

Mi experimento rápido como usuario notavo es tomar los blogs que están en mi blogroll y testearlos….

1. http://www.blog.duopixel.com - Funciona. Aunque se ve muy extraño.
2. http://www.alquimistas.evilnolo.com - Funciona. Y es más, le quita el “www”, lo cual, si el usuario se fija, va mostrándole como teclear el nombre “correcto” para la próxima.
3. http://www.letritas.blogspot.com - Funciona. Igual se ve extraño.
4. http://www.usolab.com/wl - Excepción. A ellos los pongo ahorita porque ponen “wl” en vez de “blog”. ¿Será “wl” por “web-log”? Justo comentando sobre la selección de nombres para los dominios y subdominios. Por cierto, no funciona con wl.usolab.com.
5. http://www.blog.armandososa.com - Funciona. Es el caso contrario de los alquimistas; aquí aparece el “www” por defecto y si lo pones sin el “www”, te lo pone en seguida. ¿Por qué habrá tomado esa decisión Armando Sosa?
6. http://clear.aiga.org - Funciona. Muy bien, de hecho. La liga original que tengo es http://www.aiga.org/content.cfm/clear, por lo que definitivamente emplearía la primera para hacer diseño gráfico.

Dado el post anterior que me dejó reflexionando, sobre cómo aprender a diseñar páginas web, comento con un colega: 

No estoy seguro si comenzar un curso de diseño web deba incluir manejo de tablas. Sino empezar directo con CSS.

Es como aprender a montar bicicleta. Puedes aprender con “rueditas” o sin ellas. Al final es lo mismo, acabas sabiendo como montar bicicleta.

Nota contextual: El “pecsi” tiene que ver con la premisa de que a los diseñadores les cuesta trabajo aprender “código”… Jum. ¿Quién habrá inventado y diseminado esta idea?

Casi me voy de espaldas cuando leí el título que puso Elías en Isopixel: Razones por las que NO hacer un mockup con photoshop para un trabajo web. De la traducción libre que está en blog tomé los siguientes puntos:

1. Photoshop limita completamente el trabajo, no se pueden incluir enlaces, áreas “clicables” o menús. Con el papel pasa lo mismo. Lo ideal es [añadido por mi] primero hacer un planteamiento muy básico sobre el papel [/añadido por mi] y luego pasarlo a CSS/XHTML, donde representaremos lo que se hizo en papel más resto de funciones básicas como navegación, enlaces etc.

• Si estamos hablando de una maqueta o mockup, ya desde el papel y lápiz, es buena herramienta. La idea está en maquetar el sitio, hacer una disposición de los elementos, es el pensar cómo quedarían. Justo cómo ha mencionado un alumno de Javier Cañada dentro del programa Vostok. Lo que sí, viendo una maqueta como prototipo de baja fidelidad, en Photshop es posible concentrarse en los detalles visuales, esto es, enfocarse mucho en la forma. Aunque es tardado, su ventaja podría ser el dar una mayor calidad final en el prototipo a diferencia de tomar lápiz y papel. No hay que olvidar que en el prototipeo lo relevante es obtener, de ser posible, resultados sobre aspectos de usabilidad; ahí el photoshop es un arma de dos filos, es más fácil para este caso optar por lápiz y papel o un wireframe simple. No importa si se puede “cliquear”.

2. Photoshop proporciona muchas herramientas para conseguir detalles y justamente buscamos lo contrario, no queremos dar detalles concretos, solamente lo esencial. El programa nos distraerá en cosas que ahora no tocan hacer.

• Efectivamente, pero justo se repite mi apreciación en el primer punto. ¿Qué tipo de calidad se requiere en el prototipo y con qué propósito se está realizando? Un detalle curioso es que si el proyecto lo amerita, un prototipo simple con CSS no puede competir con uno visualmente más preciso (de preferencia con una versión más simple en papel o wireframe ya evaluada).

3. La fuente de un sitio forma parte imprescindible y es muy probable que necesites cambiarla varias veces. Photoshop hace más complicado este proceso: abrir el .psd, seleccionar la fuente del lugar concreto que queremos cambiar, cambiarla, exportar a .png .jpg para poder enseñar los cambios a, por ejemplo, un cliente etc. Además de queen photoshop las letras NUNCA se comportan igual que en la web, a pesar de darle la misma fuente con las mismas características en el programa se ve de una forma y en la web de otra [añadido por mi] (nunca entendí porque pasa esto) [/añadido por mi].

• Con respecto a la fuente, es claro que no todos los textos pueden ser arbitrarios, esto es, utilizar la fuente que quiera y luego pasarlo a imagen. Vale para ciertos encabezados y es obvio que hay que tomar en cuenta qué tanta sustitución con imagen habrá de hacerse en los textos y por qué sería conveniente tomar este tipo de decisiones. Para los textos “comunes”, esas cosas no se pueden probar mejor que con texto “en vivo”, que se está viendo en el browser y eso sí tiene que hacerse con CSS (referente a familia tipográfica, puntaje, interlineado y variantes).

4. Photoshop se enfoca en la producción y no en la productividad. En este primer paso se busca conseguir los puntos esenciales para crear un sitio accesible, claro etc. Luego nos preocuparemos de darle un aspecto “bonito”.

• Eso no lo voy a negar. Si se maqueta en photoshop, cuestiones accesibilidad, navegación y usabilidad tienen que tenerse en la cabeza “en segundo plano” (como en cómputo, un proceso corriendo ahí atrás) mientras se diseña. Esto implica que no importa tanto la herramienta (photoshop o lápiz de papel) sino la integración de los conocimientos sobre diseño visual, diseño web, diseño de información, arquitectura de información, accesibilidad y usabilidad. Insisto, ¿para qué va a servir el prototipo o maqueta en cuestión?

5. Perderemos tiempo en pasar el mockup de photoshop a css/html.

• Otra gran verdad. Llego a una conclusión rápida que este es un vicio, el cual tengo y esto casi seguro que tienen muchos que empezaron con esto de la web en los 90s cuando el ensamble de las interfaces venía en forma de tablas. Lo que creo que este punto puede ser evidente dependiendo de tu forma de “aprender web”; si desde el principio rompes con la maquetación en photoshop y te acostumbras a hacer “drafts” a partir de una lógica-de-ensamble vía CSS/HTML, entonces tu perspectiva/proceso sobre cómo ir diseñando, definitivamente cambia. La estructura mental para esta tarea cambia. Al comenzar a hacer la “integración” que menciono arriba con una maqueta hecha en photoshop, los tropiezos te enseñan a discernir cuáles áreas “no deben o tienen por qué tocarse”. Pero sí es interesante ver como el cambio en el paradigma de diseño web en cosas que a gente más reciente en estos rollos (post-liberación-de-las-tablas) hace que tengan soluciones creativas que pueden pasar por obvias para ellos.

6. Con html/css podremos seguir un flujo de trabajo mucho más productivo: Hacemos el cambio, guardamos y refrescamos.

• Esto está relacionado con el punto anterior. En ese sentido, estoy de acuerdo. Aunque una vez pasada la migración de photoshop, esas áreas “intocables” tienen que trabajarse siempre como se plantea en este punto.

7. Photoshop es poco práctico, aunque lo manejes desde hace mucho tiempo, es complicado hacer las cosas de forma simple.

• Si es el caso de un prototipo visualmente complejo, es tardado, pero no creo que ese sea el punto general de estos siete, sino identificar quién implica a quién, si photoshop luego CSS/XHTML o primero CSS/XHTML luego CSS. Sí son dos formas de pensar/diseñar diferentes. Y también hay que recordar el contexto, el usuario y el cliente. Mis comentarios van enfocados a sitios web “usables” por no decir cuasiplanos visualmente, no tanto a esos “interactivos” ganadores de premios y llenos de factores de diseño emocional y metáforas navegacionales rebuscadas. De una u otra forma, concuerdo en que hay que obtener un equilibrio.

Y la razón por la que casi me voy de espaldas, es porque, usualmente tengo que “concretar visualmente” una maqueta en photoshop, justo como estoy diseñando algo de web en estos días. Aunque, admito que en momentos de frustración, sobre todo por el trabajo “talachero” de pasar de PSD al ensamble CSS/XHTML donde a veces suele suceder que no queda justo como “habías pensado”. Un debate interesante el asunto.

PD. Ya está el foro de discusión en Isopixel al respecto.

Actualización.

CyberGus nos comparte también su opinión sobre este tema, con comentarios bien enfocados. 

Directo desde Ateneu Popular, Guepmascle, nos ofrece una cheat sheet o chuleta de conceptos básicos de CSS. Recomendable cuando se está empezando con esto de los CSS.

Acceder en: 
http://www.ateneupopular.com/2008/05/22/chuleta-css-conceptos-basicos

Felicidades a Seth, de los Alquimistas del Diseño, por el Blogmic Anual 2008. Más de 250 bloggers que fueron apareciendo por escenarios desde el 27 de Diciembre de 2007 hasta este 15 de Abril. Uff… buen de chamba.

Gracias a Seth por dejarme participar… estoy en la sección de Blogs & Beers… ¿mito o realidad? Jejejeje…

¿Y cuál fue mi rollo?

Pues el asunto del símbolo de Tzek Infodiseño e Interacción. Que si es flor o una estrella y reírme de mi mismo. De verdad que me han comentado en persona al respecto…. Y como digo: es un muñequito gordito que está saltando con sus brazos gorditos y sus pies gorditos… that simple. 

Todo esto tiene que ver con algo que había escrito sobre el logotipo y su diseño. De ahí la frase con la que aparezco en el blogmic anual 2008….

Por cierto… ese del Blog P007 que dijo “Escribí algo profundo: subsuelo” la neta si me dió risa, soy un simple.

Se abre la convocatoria para la recepción de trabajos en el taller de HCI en México. Participan, computólogos e ingenieros (en cómputo o sistemas), diseñadores, psicólogos, etnógrafos y cualquier profesionista relacionado con el estudio de los usuarios y su interacción con dispositivos/interfaces computacionales. 

El taller será dentro del Encuentro Mexicano de Computación 2008, uno de los congresos más importantes de cómputo en México. Los trabajos aceptados serán publicados en las memorias de dicho congreso bajo la edición de la IEEE. La sede será la Universidad Autónoma de Baja California, Campus Mexicali.

La ventaja de participar como diseñador es el cruzar la frontera entre lo clásico, el enfoque de cómputo y sistemas, por lo actual, los estudios cualitativos (y la investigación secundaria en general) que inciden en el conocimiento general de la disciplina y la creación de productos (de diseño) innovadores.

Hay tres modalidades para participar

• Poster. Una página.
• Ponencia corta. 2 a 4 páginas.
• Ponencia extendida. 5 a 8 páginas.

La fecha límite para el envío de trabajos es el 30 de mayo del presente.

• Descargar convocatoria en PDF (48 KB).

Para la gente de las disciplinas proyectuales es una gran oportunidad para involucrarse con la comunidad científica y tener una publicación oficial, lo cual curricularmente es muy bueno; además del enfoque fresco que pueden aportar.

Mayor información en el sitio oficial del taller: www.mexihc.org.

Vía Nudonation está esta aplicación web para crear mapas de sitio llamado WriteMaps.

Me latió mucho que puedes poner notas por cada elemento en el mapa.  

Prefacio.

Mi primer post: ya hace un año que escribí sobre cómo me asombró el cambio en la conducta social de nuestra generación gracias a la tecnología. El año pasado fue interesante: la consolidación del facebook y el twitter como nichos sociales en la web 2.0, el lanzamiento del iPod Touch y la Zune, del iPhone y el Kindle de Amazon… Tzek Blog de Diseño cumple un año (increíble) y fuera de ser el nazi blogger con mis alumnos (jajaja… no en serio, gracias a mis alumnos por leerme), agradezco a todos los que se toman el tiempo de leer esto y me ofrecen feedback, a los bloggers/lectores de blog con los que he podido tener contacto (virtual/presencial) y dejarme aprender sobre este medio. Así que me celebro este acontecimiento con el siguiente post:

En agosto del año pasado, ante la llegada del iPhone, no pude dejar de cuestionarme sobre el diseño que viene. He jugado con 2 iPhones (prestados, claro) y varias veces con un iPod Touch. Actualmente estoy convencido que estos dos aparatitos, por la interacción con la pantalla táctil y la monstruosidad mercadológica, sí influirán en el diseño de las interfaces para móviles e incluso ser el punto de partida para la interacción con productos de cómputo ubicuo (así como el iPod marcó a todos los demás MP3 Players).

El nacimiento de una web 2.iPhone.

La web 2.0 ya nos dijo: aquí puedes ser tú, no quién te han enseñado a ser.. ¡vamos! socializa, comparte, presume, re-defínete, exprésate. Hay todo un cúmulo de aplicaciones web que te lo permiten –y en voz baja– así como todo un grupo de interesados en el poder de lucrar con toda la información que gratuitamente amablemente nos brindas.La web 2.iPhone nos dirá: Toma tu iPhone y si no tienes lana, toma tu iPod Touch, sacúdelo, “estírale” a la pantalla, desliza tus dedos… aprovecha todo esto para acceder a tu mundo web donde sea y cuando sea…

• ¿Necesitas poner algo nuevo en el facebook? ¡Arrástralo!
• ¿Quieres poner/hacer un twit nuevo? ¡Prueba este convertidor voz-texto directo del iPhone!
• ¿Tienes a ese amor lejos el día de tu cumple? ¡Ah! Entonces a más tardar en la noche manda el album iPhone orgullosamente decorado por mi Scrapbook for iPhone de Flickr.

En México, quizá no todos tengan un celular que pueda navegar la web, pero en la calle, muchas personas tienen un iPod, ya sea un shuffle, un video o ahora un touch. Una vez que venía en un vuelo con escala en Monterrey, lleno de gente joven, muchos de ellos traían el iPod para entretenerse mientras llegabamos… ¿Qué va a pasar cuando estén dispuestos a navegar para socializar, exponerse o jugar mientras esperan cerca de un hot spot en el aeropuerto? ¿Qué tipo de producto de diseño seducirá a esta audiencia del aparatito en mano?

El símil Nextel.

El otro día me estaban convenciendo platicando de por qué comprar un Nextel (este radio popular entre los universitarios y hombres de negocios). Donde sí estuve de acuerdo es que tener un Nextel podría, si no tener más ingresos por proyectos, ponerme en contacto con más personas para discutir sobre algo en que pueda apoyar con mis servicios de diseñador. Un punto interesante en el discurso de venta fue “el que te llame de un Nextel, es porque es alguien de negocios y que probablemente pueda pagar una buena tarifa…”

Lo que pasa con el iPhone/iPod es que tendrás toda la ventaja multimediática para “jalar” a un cliente, empezando por lo más simple: el portafolio. Si muchos de los clientes a los que aspiran tienen un iPhone/iPod, que rico que puedan navegar cómodamente tu portafolio. De entrada esto tiene implicaciones directas en el diseño visual: es claro que la arquitectura de información, el diseño de información y el diseño de interacción se ven afectados si piensas que te navegarán desde uno de estos artefactos.

Arriba está una foto de mi portafolio en un iPod.

Las ventajas:

• El navegador si no es Safari al menos si es una versión light de éste. Super… ya no lidiar con las broncas de Internet Explorer. Además:
  • Se pueden leer PDFs.
  • Soporta AJAX.

Desventajas:

• No toca flash… aunque mi trabajo no está hecho en flash, no pude checar portafolios que lo emplean.

Lo que debí hacer como adecuación al iPhone/iPod:

• Emplear ems como medida para la tipografía, no pixeles. Aunque lo anterior es una buena práctica, uno puede “esquivarla” teniendo en cuenta la resolución esperada de los usuarios, pero en el iPhone/iPod se evidencía como un error porque te “ajusta” el tamaño del texto para leerlo en pantalla pequeña si no se le da un puntaje fijo en pixeles.
• Los botones deben tener un tamaño adecuado a la yema de los dedos. Yo puse dos imágenes para navegar, lo cual NO es cómodo sin hacer zoom a la pantalla.
• Uff… saber cómo explotar la interacción con el iPhone/iPod (estirar, girar, doble “dedazo”, empujar) para producir elementos de interfaz.

El caso de Amazon.

¡Alto! Amazon tiene una versión beta de su sitio para iPhone/iPod con ciertas peculiaridades:

• El layout para la interfaz es líquido. Los anchos en la caja de búsqueda y el tamaño de los combos y botones varian dependiendo si estás navegando el iPhone/iPod vertical u horizontalmente.
• La arquitectura de amazon es mucho más simple. Con la pantalla pequeña se demuestra que la búsqueda es la base de la experiencia en amazon… la navegación fue sumamente simplificada y manada hasta abajo en la pantalla de inicio.
• El diseño de información resalta por su óptima aplicación en los elementos de la interfaz.
• ¡Increíble! Bloquea la interacción básica del iPhone/iPod. Por ejemplo: el zoom causado por “estirar” la pantalla con los dedos y también el “doble dedazo” para el zoom sobre objetos. La analogía sería “emplear pixeles en vez de ems” para el puntaje tipografíco… un claro ejemplo de controlar cualquier cosa rara que el usuario pueda hacer.

Juegos y Diseño.

Esta genial que puedas jugar en el iPhone/iPod. Las generaciones actuales de estudiantes de diseño están muy enfocadas a la animación y videojuegos, en parte por la influencia del ánime y manga. No es dificil aceptar que los futuros diseñadores al crecer con este tipo de artefactos se verán interesados en el desarrollo de videojuegos y lo cual traerá como consecuencia el re-enfoque de la participación de un diseñador, la cual se inclina a lo multidisciplinario y/o transdisciplinario.

El rediseño de widgets para una pantalla pequeña.

En el amazon noté cómo está rediseñado un combo, ahora simulando un tambor que da vueltas en vez de una lista que cae como sucede en una pantalla grande. Sin embargo, cosas como los radio-button siguen igual y eso resulta poco usable para manipular con los dedos.

No es difícil de vaticinar que los diseñadores buscarán nuevas formas de representar los widgets para ser usados con las yemas de los dedos. Será muy interesante de ir descubriendo cómo se va a ir cubrindiendo esta necesidad con el tiempo.

¿Conclusiones?

• Si se repite la historia del iPod con el iPhone y el iPod touch entonces el diseño de interfaces para móviles con navegador para la web e interfaz de pantalla táctil será una realidad a la cual los diseñadores se enfrentarán y encontrán nuevas soluciones diseñísticas las necesidades sociales y de comunicación que ha inculcado el desarrollo de la web 2.0.
• El arquitecto de información podría encontrar la forma metodológica y experimental de mapear la organización navegacional y de contenido de una “pantalla normal” a un “dispositivo móvil” de forma que la experiencia de usuario no se degrade (en la medida de lo posible).
• El diseñador de información tiene la posibilidad de explotar sus conocimientos sobre organización visual (y quizá multimediática en general) para comunicar en forma usable “lo más en lo menos”, esto es, la mayor información en el espacio reducido de pantalla.
• El flash o alguna herramienta similar, aunque parezca que muere, por cuestiones de mercadotecnia y convenios comerciales, sin duda sería empleada por diseñadores, pero no en forma tan “artística” al comenzar esta travesía con la carencia de éste (el flash). Es decir, si ahora “no hay” y creas todo un esquema de interacción que te lleve a soluciones creativas en contraste con las actuales (bajo el empleo de flash), entonces cuando se permita usarlo de nuevo, otro enfoque podría ser altamente tomado en cuenta… Por ejemplo, para el desarrollo de nuevos widgets que sean cómodos para los dedos y adecuados a la pantalla pequeña.
• ¿El medio es el mensaje?

Muchas gracias por su apoyo. Saludos a todos y espero poder continuar con el blog otro rato más.

Saludos.

Tzek.

De lo último que he tenido de chamba está darle formato a una guía para los usuarios de bibliotecas y centros de información llamada “¿Respetas los derechos de autor?” tanto para impresión como para pantalla.

 La parte impresa.

Primero me tocó darle forma a la versión impresa… el diseño editorial había que enfocarlo más en la forma conveniente que en una reestructuración del contenido (el texto y cómo estaba organizado). De ahí que se tomara una paleta viva/vibrante con tonalidades naranja-amarillo-rojo-fucsia. Esto con el fin de dar origen a una mano (la identidad, el autor) impregnada del derecho de autor (el copyright)… Una idea muy simple quizá, pero quería probar que tan bien podría quedar… claro que a la bolita “copyright” número 50, yo ya estaba hasta la mauser… supongo que debe haber una forma óptima para hacerla.

 Luego había que cubrir este rollo de lo no cuadrado, lo llamativo para los jóvenes usuarios; ergo, poner cosas “chuecas” (uta.. que creativisisisimo wey). Y eso dió pie un tetráptico (mucho espacio, mucho lujo) implicado en gran parte porque las dos guías en sí son diagramas de flujo por lo que requerían de un buen tamaño para leerse con facilidad.

 Y ya. En teoría, pronto encontrará su guía de derechos de autor en su tiendita de la esquina o en su biblioteca más cercana (claro, mientras esté dentro de la sociedad de cooperación interbibliotecaria Amigos).

La parte web o mejor dicho, cómo IE puede fastidiarte tus diseños. 

Una desventaja de trabajar en Mac es que se te olvida (si no usas Firefox) que existe IE y otros exploradores además del Safari. Por cierto, ¿por qué los usuarios de Windows no usan Safari en vez de ponerle un skin a su FireFox?

Bueno, soy culpable… admito que debo tener más en cuenta a mis usuarios (con IE 6 y 7). Así que ya no puedo decirme más “luego lo ajusto a IE 6 y 7 y ya está” porque no es tan simple. 

Aunque la versión web de la guía la quise hacer simple, quería que tenga un punch visual (ya saben: colorcitos, sombras y cosas flotando).  Pero claro, IE me dió un lapo en la cabeza cuando quise poner PNGs a 24 bits flotando unos sobre otros y más si haces un remplazo de texto por imagenes. El IE, con su problema de flotamiento, “mueve” las cosas si aplicas el filtro a un PNG de 24 bits  y por ende, se te desactivan bloques que funcionarían como vínculos (da la sensación de que se “bloquean” los “botones”).

Hablando de 24 bits, me ganó la ignorancia porque hasta el momento no me “junciona” aplicarle bien el filtro para la transparencia desde la etiqueta IMG… así que la “manita” del header (ver imagen de abajo) no tuve más remedio que ponerla como fondo de un DIV hueco.

Al final cedí y puse el menú como una lista simple. Si usas Safari verás el sombreado del texto vía CSS, pero hasta ahí.

Asumiendo el perfil de usuario, preferí colocar botones de imágenes en forma directa para descargar los diagramas de flujo; también activé vínculos en las imágenes.

Otra vez experimenté lo desesperante que puede ser IE, y no sólo el 6 por no aceptar PNGs de 24 bits, sino también el 7… Al final, como se dice por aquí, Microsoft “tiene el sarten por el mano”. En este caso, muchos de los usuarios verían esta guía bajo IE 6 (sí!!!, la versión 6!!!). Lo que me dejó pensando es si usar algo “menos imagen” y “más estándar actual” en lo futuro que haga de web. 

Si el IE no tuviera estas broncas (puesto que FireFox y Safari se ven prácticamente igual), no puede quitarse la cosquillita exploratoria de los PNGs con transparencia y los DIVs flotando y encimándose por doquier… pero ni pecs… el usuario es primero.