Hemos aprendido que los mejores sitios web son aquellos que se adaptan a sus usuarios, no al revés. Una de las formas más efectivas de hacerlo es agregando un redimensionador de fuentes que permite a los visitantes ajustar el tamaño del texto a su nivel de comodidad.
La accesibilidad de las fuentes beneficia a todos, desde usuarios con discapacidades visuales hasta personas que leen en diferentes dispositivos o en diversas condiciones de iluminación.
Cuando los visitantes pueden personalizar fácilmente el tamaño del texto, permanecen más tiempo, leen más y es más probable que interactúen con tu contenido y realicen acciones en tu sitio.
En esta guía, te mostraremos exactamente cómo agregar un redimensionador de fuentes a tu sitio de WordPress. Hemos probado varios métodos y plugins para encontrar las opciones más confiables que funcionan con cualquier tema y no ralentizarán tu sitio web.
¿Por qué es importante agregar texto redimensionable a tu sitio web? 🤔
Si el tamaño de fuente es demasiado pequeño en tu sitio web, entonces la gente tendrá dificultades para leer tus artículos y eventualmente abandonará tu sitio.
Una forma fácil de mejorar la legibilidad es ofrecer a los visitantes la opción de redimensionar el texto principal de tu sitio web. Esto permite a los usuarios ajustar el tamaño del texto según su preferencia y pasar más tiempo en tu sitio.
Aunque puedes usar la función de zoom integrada del navegador presionando las teclas ‘CTRL y +’, esto aumenta el tamaño de cada elemento de diseño de WordPress en la página, no solo el texto. Esto puede romper el diseño del sitio web y no ofrecer una buena experiencia de usuario.
Dicho esto, veamos cómo puedes agregar fácilmente texto redimensionable para tus visitantes en WordPress. Puedes usar los enlaces rápidos a continuación para saltar a un método específico:
- Método 1: Agregar redimensionador de fuentes de WordPress con plugin y código
- Método 2: Usar plugin de accesibilidad de WordPress
- Haz que tu sitio de WordPress sea aún más fácil de usar con estos consejos
- Tutorial en video
Método 1: Agregar redimensionador de fuentes de WordPress con plugin y código
Una forma fácil de permitir que los usuarios cambien el tamaño del texto en tu sitio web es usando un plugin redimensionador de fuentes de accesibilidad de WordPress como Accessibility Widget.
Es un plugin gratuito de WordPress que te permite agregar una opción a la barra lateral de tu sitio para cambiar el tamaño del texto. El plugin es ligero y muy fácil de usar.
Nota: El plugin Accessibility Widget no es compatible con la Edición de Sitio Completo ni con temas de bloques, por lo que solo funcionará si usas un tema clásico. Sabrás que estás usando un tema de bloques si falta el personalizador de temas en tu administrador de WordPress.
Lo primero que necesitas hacer es instalar y activar el plugin Accessibility Widget en tu sitio web. Si necesitas ayuda, consulta nuestra guía sobre cómo instalar un plugin de WordPress.
Después de la activación, simplemente ve a Apariencia » Widget desde el panel de administración de WordPress. Luego, puedes hacer clic en el botón '+' y agregar el bloque 'Accessibility Widget' a tu barra lateral.
Después de eso, puedes ingresar un título para el widget, como 'Cambiar tamaño de texto' o 'Redimensionar texto'.
A continuación, necesitas seleccionar qué elementos HTML o clases CSS se verán afectados por el widget. Las opciones predeterminadas son body, paragraph, list items y table cells. Estas opciones deberían funcionar para la mayoría de los sitios web.
El widget permite hasta cuatro opciones de redimensionamiento. Las opciones predeterminadas son 90%, 100%, 110% y 120%. Puedes aumentar o disminuir los tamaños de fuente ingresando las cifras en el campo 'Establecer a estos tamaños'.
La última configuración del widget es el texto del controlador, y este es el texto que verán los usuarios. Puedes mantener los porcentajes predeterminados para el tamaño del texto o usar una letra para mostrar diferentes tamaños de fuente.
Una vez que hayas terminado, simplemente haz clic en el botón 'Actualizar' para guardar la configuración de tu widget.
Ahora puedes visitar tu sitio web para ver el widget en acción. Así es como debería aparecer el widget en la barra lateral de tu sitio web:
Si sientes que el texto del controlador no es muy visible, puedes cambiarlo usando CSS.
Para hacer esto, simplemente ve a tu administrador de WordPress y selecciona Apariencia » Personalizar.
Ahora deberías ver algunas opciones para personalizar tu tema clásico.
Aquí, selecciona 'CSS adicional'.
Ahora, puedes agregar código CSS a estilizar el widget.
Aquí está lo que agregamos:
.widget_accesstxt a {
border: 2px solid #000;
padding: 2px;
font-weight: bold;
}
Este CSS agregará un borde alrededor del texto del controlador, lo pondrá en negrita y agregará un poco de relleno. Una vez que estés satisfecho con la apariencia del widget, simplemente haz clic en 'Publicar'.
Para más detalles, por favor consulta nuestra guía sobre cómo agregar CSS personalizado en WordPress.
Método 2: Usar plugin de accesibilidad de WordPress
Otra forma fácil de permitir que los usuarios cambien el tamaño del texto en tu sitio web es usando WP Accessibility. Este plugin te permite agregar una barra de herramientas a tu sitio para cambiar el tamaño del texto, sin importar el tema que estés usando.
Lo primero que necesitas hacer es instalar y activar el plugin WP Accessibility en tu sitio web. Puedes ver nuestra guía sobre cómo instalar un plugin de WordPress si necesitas ayuda.
Tras la activación, simplemente ve a la página WP Accessibility desde el panel de administración de WordPress.
En la sección 'Barra de herramientas de accesibilidad', haz clic en la opción 'Habilitar barra de herramientas de accesibilidad' y selecciona 'Tamaño de fuente'. Esto agregará un redimensionador de fuente a la barra de herramientas.
Si es necesario, también puedes habilitar las opciones de Contraste y Escala de grises.
Adicionalmente, puedes cambiar el tamaño de fuente del contenido al hacer clic en la barra de herramientas. También puedes simplemente seleccionar 'Tamaño predeterminado' en el menú desplegable si no estás seguro de qué elegir.
Aparte de eso, recomendamos habilitar la opción 'Usar hoja de estilos alternativa para el tamaño de fuente'. Cuando esta opción está habilitada, los usuarios pueden cambiar fácilmente entre los tamaños de fuente predeterminados y una versión más grande y legible del texto.
Siéntete libre de habilitar otras configuraciones en el plugin.
Una vez hecho, simplemente haz clic en el botón 'Actualizar configuración de la barra de herramientas'.
¡Eso es todo!
Aquí se ve nuestra barra de herramientas de redimensionamiento de fuente en el front-end:
Para más información, puedes leer nuestra guía sobre cómo mejorar la accesibilidad de tu sitio de WordPress.
Haz que tu sitio de WordPress sea aún más fácil de usar con estos consejos
¿Quieres hacer tu sitio más fácil de usar y que se vea genial? Consulta estas guías útiles:
- Cómo agregar navegación por teclado con teclas de flecha en WordPress – Facilita que las personas se muevan por tu sitio.
- Cómo personalizar los colores en tu sitio web de WordPress – Elige los colores adecuados para que tu sitio se vea bien y sea fácil de leer.
- Cómo agregar una animación de precarga a WordPress (paso a paso) – Agrega una pantalla de carga genial a tu sitio.
- Cómo agregar fácilmente el modo oscuro a tu sitio web de WordPress – Permite a los usuarios cambiar a un tema más oscuro si lo prefieren.
- Formas de crear un sitio web de WordPress compatible con dispositivos móviles – Asegúrate de que tu sitio funcione bien en teléfonos y tabletas.
- Cómo obtener comentarios sobre el diseño de tu sitio web en WordPress (paso a paso) – Aprende a preguntar a las personas qué piensan sobre el diseño de tu sitio.
- Cómo resaltar texto en WordPress (Guía para principiantes) – Aprende a hacer que las palabras importantes destaquen en tus páginas.
Tutorial en video
Esperamos que este artículo te haya ayudado a agregar texto redimensionable a tu sitio de WordPress. También puedes consultar nuestras selecciones expertas de los mejores constructores de páginas de arrastrar y soltar para WordPress y nuestra guía completa sobre actualizaciones de temas de WordPress.
Si te gustó este artículo, suscríbete a nuestro canal de YouTube para obtener tutoriales en video de WordPress. También puedes encontrarnos en Twitter y Facebook.
Mrteesurez
El segundo método es el que elijo para agregar el redimensionador de texto. Tengo un sitio web donde publico contenido educativo de manera ordenada. Encontré que esto es útil para los usuarios de mi sitio, ya que algunos podrían tener problemas de visión borrosa o necesitar ver el texto con más claridad, por lo que el redimensionamiento les será útil.
Shushanna
Hola, gracias por la increíble publicación. Me pregunto si tu sitio no tiene una barra lateral, ¿es posible colocar el widget en otro lugar, por ejemplo, encima de la navegación?
Soporte de WPBeginner
¡Puedes colocarlo en las áreas de widgets de tu tema si tu tema tiene áreas de widgets disponibles!
Administrador
Jasper
Instalé el widget pero no tengo el cuadro de texto "Set Controller" por lo que en el sitio web se muestra el %s.
¿Alguna sugerencia? Gracias
Ivo
Hola, seguí las instrucciones del video pero no pasa nada. Por favor, ayúdenme.
En realidad, quiero que el sitio de mi novia sea ampliable al abrirse en dispositivos móviles. Por favor, sugieran algo...
Saludos,
Ivo
Eric Paquette
¿es posible hacer que la A A A sea más grande?
Wrenling
¡Este widget es INCREÍBLE, muchas gracias!
Tengo curiosidad, lo agregué a mi blog y es EXACTAMENTE lo que quería, pero solo afecta a la página principal del blog; si haces clic en una publicación individual, el widget desaparece. ¿Puedes decirme cómo arreglar esto?
Soporte de WPBeginner
Probablemente tu tema de WordPress usa barras laterales diferentes para la página principal y las publicaciones individuales.
Administrador