viernes, 30 de noviembre de 2007

Esquinas redondeadas

Las esquinas redondeadas, como las que se pueden ver en esta misma página, son un estilo visual muy empleado por su vistosidad. Sin embargo, tienen varios problemas de los que me gustaría destacar dos:
  • Se suelen basar en el empleo de imágenes, lo que origina un aumento en el peso de la página (aumenta el tiempo de carga) y origina problemas de mantenimiento (por ejemplo, si se desea cambiar los colores hay que cambiar las imágenes).
  • Al utilizar imágenes puede ocasionar problemas de accesibilidad o, al menos, molestar a los usuarios que empleen un lector de pantallas.
Acabo de encontrar Esquinas redondeadas sin emplear imágenes: sólo CSS y JavaScript. Se trata de una traducción de la página Nifty Corners Cube. Desde estas páginas nos podemos descargar un script en JavaScript que permite tener esquinas redondeadas (y algunas cosas más) sin tener que utilizar imágenes. Y si JavaScript no está disponible, no pasa nada, las esquinas salen cuadradas pero la página se ve bien.


Un ejemplo de página que usa este script:



¿Cómo se consigue? En Nifty Corners: rounded corners without images (la primera versión de este script) se explica el truco.

No hay comentarios: