Cómo hacer que su sitio de WordPress sea fácil de imprimir en poco tiempo

¿Su sitio web de WordPress es compatible con la impresora? Si no tiene idea de a qué se refiere esa pregunta, puede que no sea ...

Si bien algunos desarrolladores de temas de WordPress incorporan soporte para contenido fácil de imprimir, la mayoría de las veces ese no es el caso. Y eso significa que si desea que la gente pueda imprimir su contenido de una manera que sea realmente legible, tendrá que tomar las cosas en sus propias manos ... que es de lo que hablaré hoy.

En esta publicación, aprenderá qué hace que un sitio web sea fácil de imprimir, así como cómo puede hacer que su propio sitio web de WordPress sea fácil de imprimir utilizando CSS o un complemento.

¿Qué hace que un sitio web sea fácil de imprimir?

Su sitio web tiene toneladas de elementos que facilitan que las personas naveguen por la totalidad de su sitio. Menús de navegación, hipervínculos internos, barras laterales ... todo eso es bueno para las personas que visitan su sitio en Internet porque les permite encontrar nueva información y moverse entre diferentes páginas.

Pero cuando se trata de imprimir una pieza específica de contenido de su sitio, esos elementos simplemente se interponen en el camino. Piénselo ... la gente no puede hacer clic en su menú de navegación o interactuar con su barra lateral en la página impresa, por lo que hacer que impriman su menú de navegación superior no es especialmente útil cuando leen su contenido en una hoja de papel.

Además, a veces las fuentes y el tamaño de fuente utilizados en su sitio web no se traducen tan bien en las dimensiones de la página impresa.

Y finalmente, mucha gente va a imprimir su contenido en blanco y negro (¡y la tinta de color es cara!), Por lo que siempre es una buena idea adoptar un aspecto más en escala de grises para su contenido para imprimir.

Por esa razón, hacer que su sitio web sea fácil de imprimir implica principalmente:

• Cambiar las fuentes, el tamaño y el espaciado para facilitar la lectura en un tamaño de página normal
• Eliminar elementos extraños como anuncios, navegación y barras laterales que no son útiles en una página impresa
• Amortiguación de colores si usa muchos elementos que no son en blanco y negro

Entonces, ¿cómo puedes hacer eso? Vamos a averiguar…

Cómo hacer que su sitio web sea fácil de imprimir con CSS

En la siguiente sección, le mostraré algunos complementos de WordPress que pueden ayudarlo a hacer que su sitio sea fácil de imprimir sin necesidad de profundizar en ningún CSS. Pero si desea tener un control total sobre el aspecto de la versión de impresora de su sitio, puede usar los selectores de medios para diseñar la versión impresa de su página.

El componente básico de CSS para su contenido fácil de imprimir es este:

 @media print {
/ * Aquí van los estilos específicos de la impresora * /
}

Cualquier estilo CSS que agregue a esta declaración de medios solo afectará la versión impresa de su página.

¿A dónde vas desde ahí? Bueno, es difícil dar una respuesta exacta porque mucho depende de tu preferencia y tema específicos.

Pero, en general, estas son algunas de las cosas que querrá hacer con CSS:

• Use display: none para eliminar elementos como barras laterales, menús de navegación, formularios de búsqueda y cualquier otra cosa que no sea útil en la página impresa.
• Establezca un tamaño de fuente legible. El gráfico Points to Pixels de Reed Design es útil para descubrir cómo los píxeles se relacionan con los tamaños de fuente con los que está familiarizado en programas más fáciles de imprimir como Microsoft Word o Google Docs.
• Utilice una fuente serif para los estilos de su impresora, ya que a la mayoría de las personas les resulta más fácil leer en la página impresa.
• Cambie los colores, especialmente si está usando un color de fondo con mucha tinta. La mayoría de los navegadores tienen un fondo blanco de forma predeterminada en muchas situaciones, pero es bueno asegurarse porque cualquier problema puede significar una tonelada de tinta desperdiciada.

Haciendo solo las cuatro cosas anteriores, ya debería tener un sitio web bastante fácil de imprimir. Pero si quieres ir aún más lejos, también puedes implementar tácticas más avanzadas. Por ejemplo, puede utilizar: after para imprimir la URL de cualquier enlace. Esto elimina los medios innecesarios de las publicaciones (como videos, que no son muy útiles en la impresión) y más.

Si desea algunos ejemplos más específicos de estilos CSS fáciles de imprimir en acción, una buena publicación para leer es esta de Smashing Magazine porque abarcan una página de ejemplo completa.

Algunos complementos de WordPress para hacer que su sitio sea fácil de imprimir

Si prefiere no ensuciarse las manos con CSS, puede, como de costumbre, recurrir a un complemento de WordPress para obtener ayuda. Tiene un montón de opciones diferentes, pero aquí hay un par de recomendaciones.

Sin embargo, antes de comenzar, quiero señalar que estos complementos solo funcionan cuando los usuarios hacen clic en el botón dedicado Imprimir esto proporcionado por cada complemento. No afectarán el estilo de la impresora de su sitio si un usuario va directamente a la opción de impresión en su navegador.

Impresión WP

WP-Print es un popular complemento gratuito que le ayuda a crear un sitio de WordPress fácil de imprimir. Además de agregar un botón Print This dedicado, el complemento también le brinda una interfaz fácil de usar. Esto siempre le permite personalizar muchas de las configuraciones que discutí en la sección anterior de CSS.

Tenía curiosidad por ver cómo funciona este complemento con Divi y Divi Builder. Entonces, configuré una publicación de prueba rápida para ver cómo funcionan las cosas. Así es como se ve la versión web de mi publicación de prueba:

Y así es como se ve la versión para imprimir de esa publicación ( recuerde, puede personalizar cómo funcionan las imágenes, mi ejemplo solo usa el predeterminado ):

Una cosa especialmente buena del complemento es que agrega automáticamente citas para los enlaces dentro del contenido. También elimina todas las opciones de navegación.

Solo tenga en cuenta que deberá sentirse cómodo buscando en los archivos de plantilla de su tema para agregar el botón "Imprimir esto" . Es prácticamente un trabajo de copiar y pegar, pero los principiantes pueden encontrarlo un poco confuso.

Precio: Gratis | Más información

Impresión, PDF, correo electrónico por PrintFriendly

Antes de continuar, quiero comenzar con la advertencia principal de este complemento: la versión gratuita tiene publicidad. No es ideal ... pero el complemento en sí es bastante bueno y los anuncios no son especialmente intrusivos.

Si eso no es un factor decisivo, o si está dispuesto a actualizarse a profesional, siga leyendo ...

El complemento de WordPress de PrintFriendly integra el servicio PrintFriendly en su sitio. Este es un servicio genial que, además de eliminar las partes extrañas de su tema de WordPress, también les da a sus usuarios cierto control sobre cómo se ve su página impresa.

Al igual que WP-Print, el complemento le ofrece un botón de impresión. Cuando se hace clic, ese botón abre una ventana de caja de luz. Aquí es donde los usuarios pueden obtener una vista previa de la versión impresa, así como ajustar el tamaño de la imagen y el texto:

No tiene la función de citación de enlaces genial de WP-Print, pero creo que es genial debido al control que ofrece a sus visitantes. Y otra cosa interesante es que también facilita a los lectores compartir o descargar su publicación como PDF o correo electrónico.

Precio: Gratis con soporte publicitario. La versión Pro comienza en $ 4 por mes | Más información

Terminando las cosas

Si bien es cierto que la mayoría de sus visitantes consumirán su contenido en línea, eso no significa que deba ignorar por completo a las personas que desean imprimir su contenido en papel. Crear un sitio web para imprimir es algo que se hace una sola vez. Y una vez que lo tenga en su lugar, los visitantes pueden imprimir su contenido según sea necesario sin dejar de tener una gran experiencia.

Ahora le toca a usted: ¿alguna vez imprime contenido de un sitio web? ¿Qué le gusta y / o no le gusta de la mayoría de las versiones para imprimir de los sitios web?

Imagen en miniatura del artículo de AVIcon / shutterstock.com