CSS print, página optimizada para la impresión

post - - leave a reply - share

Hace poco tiempo hablábamos del código optimizado para diseñar e-mails y newsletter, ahora le toca el turno al formato de impresión.

Por cierto, entre tantas versiones (pantalla, e-mail, impresión) cabe recordar eso de “una web única” tan promulgado por la W3C. Bueno, lo que si es cierto es que las ventajas de los estándares web permiten una mejor adaptación al dispositivo o medio final y esto conlleva un ahorro de trabajo enorme.

Vamos al ataque con el CSS optimizado para la impresión.

Read more

Inconsistencia en el diseño web

post - - leave a reply - share

Los sitios web deberían de ser coherentes con su diseño e identidad. Es bueno que el diseño siga una guía de estilo y no varié esos patrones de una página a otra. Probablemente la home sea la única página “con licencia” para variar un poco la navegación y organización de los contenidos, pero nunca debería romper con la guía de estilo adoptada.

Read more

Enlaces redundantes sin valor semántico

post - - 1 reply - share

Basta ya de los “haz clic aquí”, los “más información” y aún peor “[+]”.

Si el titular esta bien destacado como enlace, o el área de contenido ya cumple esta función ¿por qué caer en la redundancia de añadir al final del resumen un “más información” cuando hay una secuencia de entradas?.

Atendiendo a la accesibilidad podemos comprobar como lo más usual es que una persona con un lector de pantalla vaya saltando de enlace a enlace, desgranando así todo el contenido del sitio web y profundizando en aquellos enlaces que le interesan.

La web ha evolucionado mucho desde sus inicios, sin embargo los enlaces siguen siendo el pilar fundamental, por ello es crucial usarlos de forma acertada.

Imaginemos la navegación con un lector de pantalla en la que saltamos de enlace a enlace y solo obtenemos de forma repetitiva un “haz clic aquí” (sin más valor semántico).

Lo dicho, analicemos los casos y desterremos esa vieja moda.

Iconos como enlaces

post - - leave a reply - share

Los iconos juegan un papel muy beneficioso para el usuario puesto que son altamente descriptivos y ayudan rápidamente al reconocimiento de la acción. Pero también pueden ser un arma de doble filo, tal cual se ha comentado en Reconocer o memorizar en un sitio web.

En este post pretendo explicar como diseñar iconos que funcionen como enlaces, teniendo en cuenta 4 objetivos:

Read more

Scripts y enlaces

post - - leave a reply - share

El titulo de este post hace referencia a una premisa bastante antigua y conocida en el mundo de la accesibilidad web. Desafortunadamente y a día de hoy los scripts siguen vivitos y coleando incrustados en los atributos href de cientos de enlaces.

Siguiendo la tónica anterior voy a seguir incorporando ejemplos reales donde mi intención no es más que la ilustración y crítica constructiva, que por cierto, siempre será bienvenida…

Read more

Indicar vínculos visitados

post - - leave a reply - share

Resulta extraño comprobar como una gran cantidad de sitios web no señalizan los vínculos visitados a través de un color diferente u otros formatos.

Una de las primeras directrices de usabilidad es precisamente indicar dónde se encuentra el usuario, dónde ha estado y adónde puede ir.

Los propios navegadores gestionan todo esto por medio de su historial de navegación en cache. Y los que nos dedicamos a la web podemos hacer uso de la pseudo clase a:visited de CSS.

Read more