Estas son fuentes descargables gratuitas con buena legibilidad y distinción de caracteres, y se pueden usar libremente para fines personales y comerciales.Puede descargar cada fuente desde su enlace respectivo a continuación.
Fuentes serif
Mostrando entradas con la etiqueta Fuente. Mostrar todas las entradas
Mostrando entradas con la etiqueta Fuente. Mostrar todas las entradas
lunes, 13 de marzo de 2023
viernes, 3 de abril de 2020
Tamaño de la fuente del texto
En 2017 se publico la entrada 16 Pixels Font Size: For Body Copy. Anything Less Is A Costly Mistake la cosa continua evolucionando hasta 20 px. La mayoría de los sitios web todavía se encuentran en cualquier lugar en el rango de 15-18 px . Estamos comenzando a ver que algunos sitios adoptan texto de cuerpo más grande de alrededor de 20 píxeles o incluso más en pantallas de escritorio .Te recomiendo leer el articulo Your Body Text Is Too Small donde Christian Miller te lo explica con más detalle.
lunes, 17 de junio de 2019
La fuente del texto y la accesibilidad
Creo que es seguro afirmar que una gran parte de la accesibilidad del sitio web recae en la tipografía, después de todo, la web aún es del 95% tipografía 1 . Los espectadores visitan un sitio web para leer su contenido o simplemente para encontrar información específica que están buscando. Y la mayor parte de esa información y la mayor parte del contenido se comunica a través de texto. Esta es una de las pocas constantes en la web que no ha cambiado con los años. Entonces, ¿cómo nos aseguramos de que todos puedan leer el contenido de nuestro sitio web? Y por todos, me refiero absolutamente a todos . Esto incluye a personas con problemas de visión, trastornos de lectura, ceguera al color.
Los diseñadores y desarrolladores de sitios web a menudo se olvidan de estas personas o inventan excusas como "las personas ciegas no conducen automóviles, por lo que no necesitan comprar uno en nuestro sitio web". Esto fue, literalmente, lo que alguien dijo cuando trabajé para una gran empresa de mercado de automóviles en línea en el Reino Unido . Este es un comentario de mente cerrada, egoísta y repugnante. La web fue creada para todos y es nuestro trabajo hacerla accesible para todos. Estas son algunas de las mejores prácticas de tipografía web accesible.
1. ESTABLEZCA SU TAMAÑO DE FUENTE BASE EN UNIDADES RELATIVAS
¿Qué es el tamaño de fuente base, cómo lo configuramos y cómo lo usamos? Vamos a empezar con el qué . El tamaño de fuente base es simplemente el tamaño de fuente del que se derivarán todos los demás tamaños de fuente. Si usamos correctamente unidades relativas.TAMAÑO DE FUENTE BASE Y ACCESIBILIDAD
¿Por qué es tan importante establecer el tamaño de fuente base en unidades relativas? Tengo que ser honesto, durante mucho tiempo, pensé: ¿para qué sirve configurar el tamaño de fuente base 100%? Más tarde supe que es por una razón simple: el tamaño de fuente predeterminado del navegador . La mejor práctica es establecer el font-sizeen el htmluso de %(o cualquier otra unidad relativa), y a continuación, establecer todos los demás elementos a cualquiera emo remque será en relación con el tamaño del cuerpo.2. COMPRUEBA EL COLOR DE TU TIPO Y SOLO SU CONTRASTE.
Comprobar el contraste de un texto en comparación con su fondo no es suficiente. Muchos diseñadores y desarrolladores web simplemente usan una herramienta para verificar si el contraste de los dos es lo suficientemente alto, pero no es tan simple. También debemos asegurarnos de que el color de nuestro tipo sea lo suficientemente oscuro. Esto significa que la fuente no debería ser demasiado delgada y que deberíamos limitar el suavizado de la fuente solo en ciertos casos.El comprobador de contraste dice que la combinación de este color de fuente y el fondo es perfectamente adecuada. Pero está claro que esto podría causar problemas al leerlo
Así que no solo compruebe el contraste en una herramienta de comprobación de contraste, asegúrese de que el tipo tenga suficiente contraste.
ALTURA DE LA LÍNEA
La altura de línea recomendada para los párrafos de texto suele estar entre 1.3 y 1.7LONGITUD DE LA LÍNEA
Obtener la longitud correcta de las líneas es muy simple, pero lamentablemente, la mayoría de los sitios web aún lo tienen mal. La longitud ideal de una línea de texto es de 45 a 75 caracteres, incluidos los espacios. Cualquier cosa que llegue lejos de ese rango se vuelve difícil de leer. Leer líneas muy largas de texto es agotador para nuestros ojos.
Esto se puede resolver muy fácilmente, aplique una max-width propiedad a los párrafos de su contenido en el sitio web y luego cuente la cantidad de caracteres (incluidos los espacios) .
No use alineación justificada
Ni siquiera debería tener que escribir sobre esto por más tiempo. La justificación del texto en la web da como resultado “ríos de espacios en blanco entre palabras” que tienen un impacto enormemente negativo en la legibilidad.
No alinee los párrafos largos en el centro
El otro problema son los párrafos largos que están alineados en el centro. Cuando tenemos líneas de texto que tienen una longitud desigual y están alineadas en el centro, es extremadamente difícil encontrar el comienzo de la siguiente línea. Nuevamente, coloque trastornos de la visión o de la lectura por encima de eso y se vuelve casi imposible de leer. No alinee los párrafos que tengan más de 2 o 3 líneas de texto.domingo, 4 de febrero de 2018
Comic Sans es de alguna manera la "mejor" tipografía para niños y adultos con dislexia, TDAH , autismo y otras discapacidades.
Un estudio empírico sobre el buen diseño de
fuentes encontró que algunos tipos de sans serif son más fáciles y
rápidos de leer para algunos disléxicos, pero la comprensión se resintio.
Es algo irónico que la fuente estándar, Helvetica,
fuera preferida por los disléxicos sobre dos tipos de letra que se
desarrollaron con el propósito expreso de ser fáciles de leer para los
disléxicos.
Hay que tener en cuenta que las fuentes diseñadas específicamente para dislexia, OpenDyslexic y OpenDyslexic Italic, no condujeron a una mejor legibilidad y de hecho, para un participantes en estudios, causaron mayor dificulta
Comic Neue corrige los defectos de Comic Sans. Descargalo. Úselo cuando tenga alguna razón para usar Comic Sans. Es mucho mejor.
miércoles, 15 de noviembre de 2017
Tamaño del texto en WCAG 2.1
Mirando el los blog de la gente que precisa de la accesibilidad web y esta trabajando para que llegue a la gente, me he encontrado con la entrada de blog de Low Vision Task Force (LVTF) en el hablan de las nuevas pautas WCAG 2.1 referido a la fuente.
Antes de analizar las WCAG 2.1 y la fuente tratan de explicar un antiguo mito diciendo. Fue cierto en la era IE5-6, donde el tamaño del texto era el método principal para hacer que el contenido fuera más grande. Técnicamente todavía evita el tamaño del texto en algunos navegadores (por ejemplo, Internet Explorer)
Es sabido que ahora explorer pasó a Edge.
Pero yendo al asunto de las fuentes y las pautas WCAG 2.1 se dice:
1.4.4 Cambiar el tamaño del texto : a excepción de los leyendas y las imágenes de texto, el texto se puede redimensionar sin tecnología de asistencia hasta en un 200 por ciento sin pérdida de contenido o funcionalidad.(pauta igual en WCAG 2.0 y en 2.1.
- WCAG 2.0
Esto significa que debe poder cambiar el tamaño del contenido (no excluye el zoom) para que el texto sea un 200% más grande. No tiene ningún requisito sobre el desplazamiento horizontal, lo que lo hace bastante inútil en estos días, ya que cada sitio puede ampliarse (el zoom no era común cuando se escribió WCAG 2.0).
Reflujo: el contenido puede presentarse con un ancho equivalente a 320 píxeles CSS sin pérdida de información o funcionalidad, y sin necesidad de desplazarse en dos dimensiones, excepto en las partes del contenido que requieren un diseño bidimensional para su uso o significado.
Con este requisito, las personas deberían poder leer cosas en tamaños más grandes sin tener que desplazarse hacia atrás y hacia adelante, y evitar las cosas que faltan fuera de la pantalla.
Otro nuevo requisito del (borrador) de WCAG 2.1:
Si las tecnologías que se utilizan permiten que el agente de usuario adapte las propiedades de estilo del texto, no se produce ninguna pérdida de contenido o funcionalidad esencial al adaptar todo lo siguiente:
Altura de línea (espaciado de línea) a al menos 1,5 veces el tamaño de fuente;
Espaciar debajo de los párrafos al menos 2 veces el tamaño de la fuente;
Espaciado de letras (seguimiento) a por lo menos 0,12 veces el tamaño de fuente;
Espaciado de palabras a por lo menos 0,16 veces el tamaño de la fuente.
Este requisito permite a las personas anular los estilos con su propia familia de fuentes, altura de línea y espaciado entre letras
Estos tres requisitos juntos significan que las personas deberían poder cambiar el tamaño del contenido de manera más significativa que ahora y anular ciertos aspectos.
Antes de analizar las WCAG 2.1 y la fuente tratan de explicar un antiguo mito diciendo. Fue cierto en la era IE5-6, donde el tamaño del texto era el método principal para hacer que el contenido fuera más grande. Técnicamente todavía evita el tamaño del texto en algunos navegadores (por ejemplo, Internet Explorer)
Es sabido que ahora explorer pasó a Edge.
Pero yendo al asunto de las fuentes y las pautas WCAG 2.1 se dice:
1.4.4 Cambiar el tamaño del texto : a excepción de los leyendas y las imágenes de texto, el texto se puede redimensionar sin tecnología de asistencia hasta en un 200 por ciento sin pérdida de contenido o funcionalidad.(pauta igual en WCAG 2.0 y en 2.1.
- WCAG 2.0
Esto significa que debe poder cambiar el tamaño del contenido (no excluye el zoom) para que el texto sea un 200% más grande. No tiene ningún requisito sobre el desplazamiento horizontal, lo que lo hace bastante inútil en estos días, ya que cada sitio puede ampliarse (el zoom no era común cuando se escribió WCAG 2.0).
Reflujo: el contenido puede presentarse con un ancho equivalente a 320 píxeles CSS sin pérdida de información o funcionalidad, y sin necesidad de desplazarse en dos dimensiones, excepto en las partes del contenido que requieren un diseño bidimensional para su uso o significado.
Con este requisito, las personas deberían poder leer cosas en tamaños más grandes sin tener que desplazarse hacia atrás y hacia adelante, y evitar las cosas que faltan fuera de la pantalla.
Otro nuevo requisito del (borrador) de WCAG 2.1:
Si las tecnologías que se utilizan permiten que el agente de usuario adapte las propiedades de estilo del texto, no se produce ninguna pérdida de contenido o funcionalidad esencial al adaptar todo lo siguiente:
Altura de línea (espaciado de línea) a al menos 1,5 veces el tamaño de fuente;
Espaciar debajo de los párrafos al menos 2 veces el tamaño de la fuente;
Espaciado de letras (seguimiento) a por lo menos 0,12 veces el tamaño de fuente;
Espaciado de palabras a por lo menos 0,16 veces el tamaño de la fuente.
Este requisito permite a las personas anular los estilos con su propia familia de fuentes, altura de línea y espaciado entre letras
Estos tres requisitos juntos significan que las personas deberían poder cambiar el tamaño del contenido de manera más significativa que ahora y anular ciertos aspectos.
viernes, 6 de octubre de 2017
Fuente de escritura Accessible-DfA
Accessible-DfA es una fuente Opentypees
Es gratuita descargada bajo licencia
La fuente Accessible-DfA ha sido diseñada para proporcionar la máxima legibilidad para todos, la puedes descargar en la web de GitHub
Es gratuita descargada bajo licencia
La fuente Accessible-DfA ha sido diseñada para proporcionar la máxima legibilidad para todos, la puedes descargar en la web de GitHub
Suscribirse a:
Entradas (Atom)