sábado, 28 de febrero de 2009

domingo, 22 de febrero de 2009

42 Revistas Online Gratuitas para Diseñadores

Parece bastante interesante... pero hay que perder mucho tiempo consultándolas una a una para poder o no recomendarlas. :D

URL: http://www.hongkiat.com/blog/42-free-online-magazines-for-designers/

viernes, 20 de febrero de 2009

Posicionamiento de capas con CSS

Un comentario acerca de posicionamiento de capas con CSS.

En primer lugar, hay cuatro tipos de posicionamientos de capas... cinco si contamos el modo heredado.

· Estático: Modo normal de posicionamiento de los elementos. Fluyen con la página.
· Fijo: Permanece en una posición fija en la pantalla, aunque movamos el navegador. (Tipo mosca de televisión)
· Relativo: Respeta su espacio orginal y se desplaza desde el mismo. Es decir. Si pongo un elemento X en la página y lo muevo con deplazamiento relativo, el resto de elementos que lo redean NO se verán afectados por este deplazamiento. (Nota: si se verían afectados por un cambio de tamaño o margen del mismo...)
· Absoluto: Se situa en una posición fija en relación a su punto de referencia. El resto de elementos no se ve afectados (en cuanto a posición) por este. (Nota: si lo mueves y lo pones encima de otras cosas, las tapará...)

Cuestiones a tener en cuenta.

Compatibilidad
Los posicionamientos relativo y absoluto pueden dar problemas en algunos navegadores.

Normalmente el problema está en el IE. El tema está en que si el IE6 daba problemas con algunas cosas y el IE7 es una aberración y el IE8 aún no está termiando... Pues los problemas heredados del IE6 nos afectan todavía.

Actualmente, el uso del IE6 ha bajado ligeramente del 20% en las estadísticas, pero sigue siendo muy alto. Así que no podemos ignorar los problemas.

FAQ

¿Puedo cambiar el punto de referencia de una capa absoluta o es siempre la esquina superior izquierda de la página?
Si. El punto de referencia es la esquina superior izquierda del elemento que contiene a la capa.

¿Como es esto de compatible?
Consultando la tabla siguiente...

URL: http://www.quirksmode.org/compatibility.html

Observamos que no hay compatibilidad del 100% con el tema del posicionamiento. Por otro lado, el Acid Test...

URL: http://en.wikipedia.org/wiki/Acid2

Nos viene a confirmar que el CSS 2 (el que incluye las opciones de posicionamiento) no es completamente compatible.

¿Entonces qué?
La solución viable pasa por hacer las pruebas en los diversos navegadores que consideremos como objetivo viable de nuestras páginas. Y evaluar los resultados. Hay que tener también en cuenta que una mala deficinión del documento HTML puede provocar problemas en la carga de algunas propiedades.

miércoles, 18 de febrero de 2009

Iconos para GUI

Os dejo dos enlaces de iconos para el desarrollo de GUIs (Graphic User Interface).

La primera es la de Mark James y seguro que habéis visto estos iconos en más de una aplicación...

URL: http://www.famfamfam.com

La segunda es esta...

URL: http://www.userinterfaceicons.com/

Alturas porcentuales con CSS

Ayer estuve jugando con CSS para intentar conseguir elementos del 100% de alto en relación a la página. Esto permite situar elementos con centrado vertical de forma segura. Estas especificaciones no funcionan de serie, hay que establecer el CSS correspondiente para que esto funciones. En concreto, hay que darle un valor de 100% de alto a las etiquetas BODY y HTML. ¿Cómo se hace esto?

html, body {
height: 100%
}

A partir de ese momento podemos establecer alturas porcentuales en las capas de la página de forma cómoda.

En cuanto a compatibilidad. Pues la verdad es que no la he revisado exhaustivamente, pero sería interesante hacerme con un banco de pruebas de compatibilidad... ya veremos. :D

Font Conference



You are INSANE! Nobody uses Microsoft Works!!

martes, 17 de febrero de 2009

Generador de animación de carga

En el siguiente enlace se pueden generar archivos GIF animados para los procesos de cargas de algunas aplicaciones. Se pueden utilizar, por ejemplo, para personalizar la carga del Thickbox.

URL: http://www.ajaxload.info/

El Magenta no es un color.

Al menos eso es lo que dicen en este artículo (en inglés)...

URL: http://www.biotele.com/magenta.html

Interesante, sobre todo, por el concepto Qualia:

Los qualia simbolizan el "gap" (hiato) explicativo que existe entre las cualidades subjetivas de nuestra percepción y el sistema físico que llamamos cerebro. Las propiedades de las experiencias sensoriales son, por definición, epistemológicamente no cognoscibles en la ausencia de la experiencia directa de ellas; como resultado, son también incomunicables. La existencia o ausencia de estas propiedades es un tópico calurosamente debatido en la filosofía de la mente contemporánea.

(Extraido de la Wikipedia en castellano).

Información más visual (hay gráficos explicativos) y más clara (en inglés) sobre esto...

URL: http://www.biotele.com/qualia.htm

sábado, 7 de febrero de 2009

jueves, 5 de febrero de 2009

Otro ejemplo de curriculum creativo

Simple y funcional. Claro. Aunque quizá poco explicito... Incluye la información básica.

URL: http://www.flickr.com/photos/7372907@N07/3191558047/sizes/o/

miércoles, 4 de febrero de 2009

Los 50 "mejores" sitios de 2008

La página Crazyleafdesign.com ha colgado una noticia con una selección de las 50 mejores páginas de 2008.

No acabo de estar de acuerdo con los screenshots de algunas de ellas, ya que en algunos casos parece que una bonita ilustración sea lo que define una página web. Pero habría que ver los tiempos de carga y demás. Es como con lo de los curriculums que vimos hace tiempo. No vale todo en todos los contextos. Aún así, aunque algunas de ellas no sean realmente "buenas páginas web", siguen siendo bonitas. :D

URL: http://www.crazyleafdesign.com/blog/most-beautiful-websites-of-2008/

domingo, 1 de febrero de 2009

Creación automáticas de páginas web

De todos es sabido que, cuando algún tipo de actividad presenta la más mínima dificultad, es tendencia del ser humano el buscar el camino más fácil y rápido para conseguirla.

No tendríamos que pensar demasiado para saber que cuando una persona quiere "hacer páginas web", el camino más corto y práctico es el del estudio de la tecnología y la constante aplicación de la misma. Pero claro, muchas veces alguien no quiere "hacer páginas web", sino hacer una página web.

No entro ahora en los problemas del tipo "contratar a un diseñador/desarrollador" es caro. Ni tampoco voy a hablar de si es necesario que el "diseñador/desarrollador" haya obtenido sus conocimientos por la via del estudio reglado y la práctica profesional, al margen de tener o no un papelito oficial que lo ratifique. Mi problema actual es mucho más sencillo.

He visto una página web en la que se leía "cree su página web sin conocimientos técnicos". Y la verdad es que no puedo estar más en desacuerdo. Si bien, mi ya conocida y radical opinión en contra de que los documentos HTML que incluyen como único contenidos un archivo SWF sean considerados eso que la gente llama "página web en Flash", no puedo aplicar el mismo razonamiento en este caso. Puesto que una página web que utiliza HTML, CSS, PHP y MySQL no puede ser negada como tal. No vamos a negar que el resultado sea una página web. Pero por donde no paso es porque por el proceso de abrir una página como esta que estás leyendo, un blog mediante un asistente, una persona haya creado una página web. No señor. Una persona habrá abierto y configurado un blog mediante un servicio de internet. Pero no habrá creado una página web. Ni aquí, ni en wordpress, ni en my space, ni en ningún otro sitio de características similares.

Es más, cuando alguien utiliza las opciones de configuración para personalizar el entorno hasta límites que hagan que este tipo de páginas no parezcan en absoluto lo que inicialmente eran, seguire en mis 13. Lo que se está haciendo es personalizar/configurar una página web.

Y encima, para hacerlo efectivamente, para mantener compatibilidad con el máximo de equipos, para que los tamaños sean adecuados, para insertar las imágenes en los formatos adecuados, para modificar los estilos... Para llegar al punto en el que la barrera entre el personalizador/configurador y el creador sean sólo aspectos técnicos del servicio dinámico (el motor de publicación y las bases de datos) es necesario tener conocimientos técnicos.

Así que eso de "cree su página web sin conocimientos técnicos" es realmente una de esas verdades imprecisas (por no decir mentiras...) y sujetas a la interpretación del profano que nos llevan a situaciones de desprestigio de los profesionales.

Utilidades para crear galerías web

Dos utilidades para crear galerías web.

El primero es el famoso, no por su nombre sino por lo común de su uso, ThickBox. Este permite hacer click en una imagen (normalmente un previo...) para cargar otra (normalemente una versión mayor de la misma... ) al máximo tamaño posible (sin exceder el tamaño de la imagen destino) en función del tamaño de la ventana de visualización. Notar que el redimensionado es dinámico sólo en el momento de hacer click. Una vez cargada la imagen grande, variar el tamaño de la ventana no varia el tamaño de la imagen. Este es su uso más frecuente, pero además permite generar bloques que compartan un navegador (siguiente/anterior) e incluir, además de imágenes, contenido HTML o incluso iFrames en el visor.

URL: http://jquery.com/demo/thickbox/

El otro es más limitado, pero visualmente mucho más jugoso. Se trata del TiltViewer, que mediante javascript (para lanzar y configurar) y Flash (motor del sistema) permite crear galerías tridimensionales (cojamos el último término con pinzas...) navegables de ilustraciones anotadas en su parte posterior. Además, podemos hacer que las imágenes estén enlazadas con un destino.

URL: http://www.airtightinteractive.com/projects/tiltviewer/

Diseños basados en tipografía.

En esta web (que añado a la lista de enlaces), han publicado 27 diseños que tienen en común el uso de recursos tipográficos como base del mismo. Muy interesante.

URL: http://www.weirdresources.com/2009/01/30/27-wonderful-typographic-posters-for-inspiration/