Como en los dos años anteriores, Drew McLellan (allinthehead.com), publicará en el blog 24 Ways, un tip de diseño o desarrollo web ‘para impresionar a los amigos’, durante los primeros 24 días de diciembre.
De consulta obligada para todos los que andamos en estos temas, ya ha publicado el primer artículo sobre cómo manipular la transparencia PNG en Explorer 6.
Ayer hablábamos en el curso acerca de la resolución de las imágenes, y hoy me encuentro con este artículo que creo lo deja mas claro que el agua:
Leído primero en Criterion
Yo no soy amante de Flash, pero cuando veo cosas como las de la lista que sigue, no puedo evitar reconocer que es ideal para campañas publicitarias, sobre todo cuando se combina con gente que tiene ideas… y sabe llevarlas a cabo.
No se los pierdan, cada uno vale la pena.
De paso, unos links sobre las ventajas y desventajas de usar Flash, que los guiarán a saber cuándo y cómo usarlo.
Usabilidad y accesibilidad son conceptos frecuentemente dejados de lado por cuestiones diversas que seguramente sería interesante analizar, pero que no nos justifican cuando hablamos de proyectos web profesionales. Los sitios web que construimos hoy día deberían ser tanto usables como accesibles.
No es una ciencia, sino mas bién la aplicación de una serie de criterios y metodologías al momento de diseñar y construir un sitio. Si las aprendemos, no necesariamente nos costará tiempo o recursos extra.
Les dejo un artículo y un documento PDF sobre el tema, para quienes quieran aprender del asunto:
La Web 2.0 es un concepto del que se habla mucho, y que comprende elementos muy variados como tecnologías, diseño, nuevos servicios, redes sociales, sindicación de contenidos, etc.
Los investigadores Romaní y Kuklinski han estudiado el tema y han escrito un Libro: “PLANETA WEB 2.0.Inteligencia colectiva o medios fast food.“
El libro tiene licencia Creative Commons, y puede descargarse gratuitamente en formato PDF de su sitio oficial. Creo que es una lectura de lo más interesante para quienes quieren ver hacia dónde va la red.
Los capítulos:
Descargar:
Cuando construimos un sitio, muchas veces por cuestiones de diseño queremos poner un marco a algunas imágenes. Cuando me refiero a marco, significa algo más que simplemente un borde con CSS, sino mas bién algo como esto:
El tema es que esto implica utilizar un software de edición de imágenes y ajustar el marco a cada una de las imágenes que utilicemos. Si bien para el diseñador esto no será un problema, al construir sitios dinámicos donde sea el usuario final quien suba las imágenes que el desee para un contenido particular, nos encontramos que probablemente esto sea una tarea técnica que esté mas allá de lo que nuestro cliente sepa y pueda hacer.
A continuación quiero mostrar una simple técnica de superponer una imagen sobre otra, de modo que el marco se monte sobre la otra imagen.
Primero necesitamos la imagen del marco con su interior transparente:
Este es un archivo PNG de 8 bits de profundidad de color, con transparencia de índice. Es decir, es lo mismo que un GIF. Recordemos que Internet Explorer hasta la versión 6 por lo menos, no soporta archivos PNG con canal Alfa, así que es importante que sea transparencia de índice.
Luego, necesitamos la imagen a la que pondremos el marco:
Esta puede ser cualquier imagen. Para el caso, he usado un GIF animado.
Finalmente, lo único que debemos hacer es poner una imagen de fondo de la otra, con CSS:
<img src="mascara.png" width="115" height="100" style="background-image:url(imagen.gif);" alt="texto" />
Lo que nos da el siguiente resultado:
Esto nos permite hacer que la imagen que el usuario suba, cualquiera sea, le sobreimpondremos el marco artístico. Al utilizar background-image, también si queremos podemos llegar a posicionar el fondo en un punto exacto detrás del marco, no necesariamente arriba a la izquierda.
