Diseño web

Martes 14 de Marzo, 2006

¡Ya tengo mi Wacom Graphire4 Classic XL!

Os presento a mi nuevo "juguetito":

Wacom Graphire4 Classic XL

Con ella espero iniciarme en el mundo de las tiras cómicas, el retoque fotográfico de calidad, etc. Vamos, retomar mi hobbie del dibujo o el "pinta y colorea", como dicen en el trabajo.
Parece que un buen compañero para la tableta gráfica puede ser el software Autodesk Sketchbook Pro (anteriormente de la casa Alias, que ha sido adquirida por Autodesk).

Publicado por albertlg a las 14:00h. Permalink | Comentarios Comentarios

Martes 10 de Agosto, 2004

Lista de comprobación de estándares web

He traducido la "checklist" original de A Web Standards Checklist, en MaxDesign.

Antes de empezar, aclaremos conceptos:

  • ¿Qué son los estándares web?

    La expresión 'estándares web' puede significar cosas diferentes según para quién. Para algunos no es otra cosa que construir sitios web sin tablas, para otros se trata de hacerlo usando código válido. De cualquier manera, el concepto es mucho más amplio que esto. Los estándares web podrían ser definidos como:

      La adherencia a los estándares (HTML, XHTML, XML, CSS, XSLT, DOM, MathML, SVG, etc.) y la búsqueda de las mejores prácticas (código válido, código accesible, código semánticamente correcto, URLs amigables para el usuario, etc.).

    En otras palabras:

      Un sitio construido de acuerdo a los estándares de la web debe ser magro, limpio, basado en CSS, accesible, usable y amistoso con los motores de búsqueda.

  • Acerca de la lista

    No se trata de una lista cerrada. Probablemente hay muchos puntos que podrían ser añadidos. Simplemente es un punto de partida. Entre sus usos prácticos, incluye:

    • Demostrar la amplitud de los estándares web.
    • Como una herramienta práctica para los desarrolladores durante la fase de la producción de sitios web.
    • Como una ayuda para los desarrolladores que están interesados en la migración hacia estándares web.

    La lista se divide en 6 categorías:

    • Calidad del código
    • Grado de separación entre el contenido y su presentación
    • Accesibilidad para usuarios
    • Accesibilidad para dispositivos
    • Usabilidad básica
    • Gestión del sitio

La lista de comprobaciones:

  • Calidad del código

    1. ¿Usa el sitio un correcto Doctype?

    2. ¿Usa el sitio un juego de caractéres (charset)?

    3. ¿El sitio utiliza código (X)HTML válido?

    4. ¿El sitio utiliza código CSS válido?

    5. ¿Usa el sitio cortes (hacks) en el código CSS?

    6. ¿Usa el sitio 'clases' o 'ids' innecesarias?

    7. ¿Está el código bien estructurado?

    8. ¿Contiene el sitio algún enlace roto?

    9. ¿Cómo responde el sitio en términos de velocidad y peso de sus páginas?

    10. ¿Tiene el sitio errores de JavaScript?

  • Grado de separación entre el contenido y su presentación

    1. ¿Utiliza el sitio CSS para todos los aspectos de la presentación (tipografía, colores, márgenes, bordes, etc.)?

    2. ¿Están todas las imágenes decorativas dentro del código CSS, o aparecen en el código (X)HTML?

  • Accesibilidad para usuarios

    1. ¿Se utilizan los atributos "alt" para todas las imágenes descriptivas?

    2. ¿El sitio utiliza unidades relativas en lugar de absolutas para el tamaño del texto?

    3. ¿Se rompen algunos aspectos de la disposición si se aumenta el tamaño de fuente?

    4. ¿El sitio utiliza menús de salto visibles?

    5. ¿Usa el sitio formularios accesibles?

    6. ¿Usa el sitio tablas accesibles?

    7. ¿Hay suficientes brillos / contrastes de color?

    8. ¿Está usado el color sólo para la información crítica?

    9. ¿Existe un retraso en la respuesta de los menús desplegables 'dropdown' (para los usuarios con habilidades motoras reducidas)?

    10. ¿Son todos los enlaces descriptivos (para usuarios invidentes)?

  • Accesibilidad para dispositivos

    1. ¿Funciona el sitio aceptablemente en los navegadores modernos y los más viejos?

    2. ¿El contenido es accesible con el CSS desactivado o no soportado?

    3. ¿El contenido es accesible con las imágenes desactivadas o no soportadas?

    4. ¿El sitio funciona en navegadores de texto tales como Lynx?

    5. ¿El sitio funciona bien cuando está imprimido?

    6. ¿El sitio funciona bien en los dispositivos de mano?

    7. ¿El sitio incluye metadatos detallados?

    8. ¿El sitio funciona bien en un rango de los tamaños de la ventana del navegador?

  • Usabilidad básica

    1. ¿Existe una jerarquía visual clara?

    2. ¿Son los niveles del encabezamiento fáciles de distinguir?

    3. ¿El sitio dispone de una navegación fácil entender?

    4. ¿El sitio utiliza una navegación consistente?

    5. ¿Los enlaces están subrayados?

    6. ¿Utiliza el sitio un lenguaje consistente y apropiado?

    7. ¿Dispones de un mapa del sitio y una página de contacto? ¿Son fáciles de encontrar?

    8. Para los sitios grandes, ¿hay una herramienta de búsqueda?

    9. ¿Hay un enlace a la página principal o de entrada en cada página del sitio?

    10. ¿Los enlaces visitados se definen claramente con un color único?

  • Gestión del sitio

    1. ¿El sitio tiene una página de error 404 significativa y de ayuda que funcione a cualquier profundidad en el sitio?

    2. ¿El sitio utiliza URLs amigables?

    3. ¿Tus URLs funcionan sin "www"?

    4. ¿Dispone el sitio de un favicon?

Publicado por albertlg a las 20:30h. Permalink | Comentarios Comentarios

Sábado 31 de Julio, 2004

Las 'normas' de la creatividad en el diseño web

He encontrado (vía meyerweb.com) un interesante estudio realizado por François Briatte. En él analiza 10 sitios web (quizá un ámbito demasiado pequeño y de temáticas similares: weblogs de diseño web) mediante una encuesta comparativa respecto a 25 puntos diferentes.

Accede a la comparativa


La conclusión (o mejor subtítulo): “El 75% del diseño web es normativa, el resto son meros colores e imágenes”.

Publicado por albertlg a las 18:59h. Permalink | Comentarios Comentarios

Miércoles 02 de Junio, 2004

Lorem ipsum...

Todos conocíamos el recurso lipsum.com (o no).

Ahora he encontrado una versión "mejorada", con más opciones: lorem-ipsum.info.
Quizá la más destacable (de las nuevas opciones que nos ofrece este recurso), sea la posibilidad de cambiar el charset.

Publicado por albertlg a las 8:10h. Permalink | Comentarios Comentarios

Sábado 15 de Mayo, 2004

Libros de estilo

Un recurso imprescindible: WebStyleGuide.com

Publicado por albertlg a las 11:42h. Permalink | Comentarios Comentarios

Martes 13 de Abril, 2004

Diseño

Una filosofía que comparto:

Design constructs a visual language for the purpose of communication. It organizes and gives form to a message in a way that adds value and meaning. It functions to organize, clarify, persuade, and add drama to an otherwise overlooked idea.

Design plays a primary role in the interpretation of a message. It creates the crucial persistent impression. It encourages examination and generates interest. Accessible, understandable information and beauty of form can engage observers and arrest their attention.

A confusing, poorly designed message will miss its target almost every time. In a world where information flows abundantly, our minds have developed filters to sift through the overflow of useless data. While design must appeal to the aesthetic, it must not stand in the way of delivery, cause complications, or introduce stumbling blocks. Rather, the presence of design should simplify and facilitate our everyday life, enable us to accomplish our tasks more effectively, and remind us to enjoy them along the way.”

Douglas Bowman, stopdesign.com



Creo (también) que la presencia del diseño debería simplificar y facilitar nuestra vida diaria.

“Cualquiera puede convertir lo simple en complicado.
La creatividad es convertir lo complicado en simple.”


Charles Mingus



Definición que da la Real Academia Española...


S/C.

Publicado por albertlg a las 14:10h. Permalink | Comentarios Comentarios