Entre los muchos temas de sitios web creados con WordPress, encontramos el periódico tagDiv. Temas avanzados con personalización y optimización ilimitadas.
Yo personalmente uso este tema en todos los sitios web y siempre lo recomiendo por sus excelentes características. Sin embargo, no está optimizado de forma predeterminada. Esta sencilla pero completa guía le mostrará cómo optimizarla por completo.
¿Por qué optimizar los periódicos?
Como todos sabemos, Google está considerando cada vez más la velocidad de carga del sitio web, especialmente en dispositivos móviles. La velocidad de descarga afecta directamente a la experiencia del usuario., Y el SEO de nuestro sitio web.
Si está intentando ver una página desde su teléfono y tarda mucho en cargarse, ¿está esperando o buscando otra página que le brinde la misma información más rápido? Sí, la velocidad es crucial hoy.
¿Qué necesito para optimizar un periódico?
Necesita una copia legal (original) del tema para tener todas las actualizaciones y adiciones (complementos en el tema en sí).
También necesita un alojamiento optimizado y de alta calidad. El alojamiento (alojamiento web) tiene un efecto directo sobre las tasas de carga de nuestras páginas. Hosts incorrectos o mal configurados Es como llevar un saco de 50 kg a la espalda....
A partir de aquí, todo lo que necesita hacer es leer y aplicar los cambios que le recomiendo que lea en su propio sitio web en los próximos 10 a 15 minutos.
Para ver los beneficios de optimizar su sitio web, primero debe comprender cómo funcionan sus páginas ahora.
Puede utilizar las siguientes herramientas de prueba gratuitas para hacer esto:
Sugiero probar todo esto y guardar capturas de pantalla o registrar los resultados (especialmente si está utilizando PageSpeed). Soy confiable). Mucho antes de realizar la optimización.
Utilice los artículos y la página de inicio de su sitio web de prueba para ver los resultados. No eres muy bueno, ¿verdad? Relájate, eso cambiará.
Si desea que un sitio web con WordPress y periódico instalado se optimice con Google PageSpeed Insights, todo lo que tiene que hacer es seguir los sencillos consejos que le muestro a continuación.
Optimización de periódicos paso a paso
Este no es el primer tutorial sobre cómo optimizar esta increíble plantilla de periódico, pero es el primero en mostrar una optimización para mejorar nuestra puntuación en la nueva PageSpeed, incluido Lighthouse.
Entonces, lo primero que debe hacer es seguir todas las sugerencias que el equipo de tagDig nos dio en su guía completa:
Cuando haya completado todos los consejos de la guía, puede seguir aplicando mis nuevos consejos aquí. Yo insisto, En el pasado, era absolutamente necesario seguir la guía de tagDiv.
Haga una copia de seguridad completa de su sitio web
La configuración que vamos a utilizar es 100% segura, pero siempre existe la posibilidad de que algo no vaya tan bien. Así que le recomiendo que realice una copia de seguridad completa de su sitio.
Entonces, si algo sale mal, puede restaurar su sitio en minutos restaurando una copia de seguridad. Pero insisto en que esta configuración es 100% segura (la uso en todos los sitios web).
Utilice la versión adecuada del tema.
Cada versión del tema tiene sus propias ventajas (o desventajas). La versión que estoy usando 10.2 Periódico Porque es fácil de usar. Pero la versión 10.3 ya está disponible y la instalaré en los próximos días, ya que acaba de salir, siempre prefiero esperar al menos 15 días si contiene errores.
Instalar y configurar el complemento de optimización de JS
Usaremos el complemento está libre Esto nos ayudará a mejorar significativamente la optimización del sitio web de nuestro periódico. Este es un complemento "Rápido declive»Se puede encontrar en la biblioteca de complementos de WordPress.
- Ir a la pestaña de complementos
- Hacemos clic en "Agregar nuevoAmable "
- Escribimos el nombre del complemento "Rápido decliveAmable "
- Damos "Instalar"Luego"dar oportunidadAmable "
Ok, ahora hemos instalado el complemento en nuestro sitio, Necesitamos hacer algunos cambios de configuración.Estos son cambios muy simples, así que sigamos adelante.
Ve a la pestaña "melodía "En nuestro panel de administración de WordPress, hacemos clic en"Rápido decliveB ". Se abrirá una nueva ventana en la que tienes que hacer clic en el botón"melodíaUna especie de ".
En las opciones "función“Tenemos que marcar todas las casillas.
En las opciones "Opciones de URLÂ "Para ser notado"Uso obligatorio de URL HTTPSAmable "
En opciones "Parámetros HTMLÂ "Marque la última casilla como" Título de limpieza ".
con"Opciones de fuente“No marcamos nada, todo debe estar vacío.
En las opciones "Fuentes de Google "Elija la primera opción"CSS en línea de fuentes de GoogleAmable "
En las opciones "Fuentes impresionantes "Dejar el campo seleccionado"Combine o incruste fuentes con CSS asombrosoAmable "
En las opciones "Opciones CSS"Casilla de verificación"Mantenga el orden de los archivos CSS","Deshabilitar la impresión de hojas de estilo relacionadas "e"CSS en línea en el pie de páginaK ". Como puede ver en la imagen.
En las opciones "Parámetros de JavaScript ”No haga clic en nada y pase a la siguiente opción.
con"JS con renderizado de bloqueo"Casilla de verificación"Habilite el análisis diferido de archivos JVM JS a nivel mundial" con"Omitir la biblioteca jQuery con retrasoUna especie de ".
Todas las demás opciones, incluido  "Ajustar la velocidad de la página“Los dejamos en blanco y no activamos ningún campo.
ahora guardar cambios Hemos perfeccionado este complemento.
Activar Google Fonts en el tema
Desde Newspaper 10.0 podemos utilizar Google Fonts sin problemas de optimización. Sugiero mantenerlo activo ya que facilita mucho la carga de las fuentes en el diseño.
Para hacer esto, vaya al panel de control del tema del periódico y haga clic en la pestaña "Fuente del tema"Entonces abrimos la opción"Configuración de Google Fonts "y enciende"Utilice fuentes de GoogleZU ". Guardamos los cambios.
Ahora tenemos que elegir una fuente o dos para toda la página web. Personalmente, elegí una fuente (muy común) para todo el tema. Decidí"VerdanaUna especie de ".
Ahora, en el área de Fuentes temáticas del panel Periódico, vaya al "Configuración de fuentes". Elegir una fuente diferente para nuestro sitio web es genial, pero los ralentizará. Vámonos Así que eso a un lado por ahora. De forma predeterminada, todas las partes están en "una fuente»De todas las categorías (títulos, artículos, páginas, etc.).
Sí, podemos editar el tamaño, la altura de la línea, etc. Pero dejamos la fuente predeterminada (fuente predeterminada) al principio.
- Cuando haya terminado todas las optimizaciones Y vea qué tan bien están optimizados sus sitios web. Puede agregar varias fuentes según sea necesario y probar cómo afectan la puntuación de PageSpeed Insights. Normalmente te reducen de 1 a 5 puntos.
Optimizar imágenes para WebP
Existen muchos formatos de imágenes comprimidas, pero Google se esmera en utilizar los formatos más recientes para obtener los mejores resultados.
Agregaremos otro complemento gratuito llamado "Herramienta de optimización de imágenes EWWW“Esto nos permite optimizar fácilmente todas las imágenes de nuestro sitio.
- importante: Si está utilizando el complemento de almacenamiento en caché de LiteSpeed, puede omitir este paso. no hay necesidad de.
Para hacer esto, vaya a "Enchufar",Después de eso "Agregar nuevo“Busque, instale y active el complemento. Este es un complemento en el repositorio de WordPress.
Después de la instalación, vaya a su panel de WordPress y haga clic en "melodía"Luego"Herramienta de optimización de imágenes EWWWUna especie de ".
En las palabras clave "BisicaB "Elegimos las opciones B"Se eliminan todos los metadatos "Entonces en la opción"Nivel de optimización PNG "Seleccionar"Alta calidadUna especie de ".
En las palabras clave "Más precisamente DN"Casilla de verificación"Incluir todos los recursos" con"Comprensión premiumAmable "
Sobre el "progresivo "Ingresamos el valor" 70 "en"Nivel de calidad JPG "Entonces marque la casilla"Incluir carpeta de mediosAmable "
En las palabras clave "ajustar el tamaño" con"voluntad "Dejar todo por defecto (no activado).
En las palabras clave "Versión web"Hemos activado la ventana"JPG / PNG a WebP" con"WebP requeridoAmable "
Ahora guardemos los cambios para que guarden el registro.
Es hora de optimizar todas las imágenes para WebP, así que desde el panel de WordPress vamos a la pestaña "Medios de comunicación en masa"Luego haga clic"Optimización de lotesUna especie de ".
En la ventana que se abre, marque la ventana como "Optimización de fuerza"Luego presionamos el botón"Busque imágenes que no hayan sido optimizadasA ". Tardará unos minutos, luego aparecerá una nueva opción y tendremos que hacer clic en"Iniciar optimizaciónUna especie de ".
Esperaremos unos minutos para optimizar todas las imágenes y luego pasaremos al siguiente consejo de optimización del periódico tagDiv.
Configurar el complemento de almacenamiento en caché
Sí, sé que el primer tutorial de optimización de tagDiv que siguió recomendó el complemento WP Super Cache. O falló, W3 Total Cache. Sin embargo, si desea optimizar su sitio web al 100%, Necesitamos usar un complemento avanzado llamado LiteSpeed Cache....
¿Por qué debería usar este complemento? Es muy simple, es el complemento más completo y poderoso para la optimización y el almacenamiento en caché. Otros complementos pueden ayudarlo a obtener un buen sistema de almacenamiento en caché, pero LiteSPEed Cahce Nos da el mejor sistema de almacenamiento en caché...
Si queremos optimizar completamente nuestros sitios web, esta no es una opción dudosa. Sin embargo, puede utilizar cualquier complemento que desee. Sin embargo, tenga en cuenta que si está utilizando WP Total Cache o WP Super Cache, los resultados de optimización no serán tan buenos.
El complemento LiteSpeed Cache es gratuito, pero si no tiene Litespeed instalado en su servidor (es de pago) no funcionará.En mi opinión, tienes dos opciones:
- Compre una licencia de LiteSpeed e instálela en su servidor o pruebe la versión gratuita
- Instale su sitio web en un servidor de calidad que ya esté usando LiteSpeed para que no tenga que preocuparse por instalarlo.
Si desea probar LiteSpeed en su propio servidor, recuerde que puede instalarlo primero y probarlo durante varios días antes de comprar una licencia (Si solo tiene un sitio, use una licencia gratuita perpetua.). Para que puedas ver todas sus promociones y beneficios. Personalmente, uso un servidor privado y un instalador de licencias y puedo decir que estoy completamente satisfecho (y lo he estado durante varios años).
Si prefiere una opción más económica, le recomiendo que busque un host que tenga instalado LiteSpeed en su sitio web para que no tenga que preocuparse por problemas de licencia. Utilizo Banahosting.com en algunos de mis sitios web Qué Si incluye CPanel y LiteSpeed Esto me ha dado muy buenos resultados (en los rankings de la red). También es muy barato.
Una vez que haya iniciado LiteSpeed en nuestro servidor, instale el complemento "Caché LiteSpeedB ”y actívelo.
Ir a la sección "importar y exportarPARA ". Luego, en la sección"Importar ajustes "Haga clic en el botón" Comprobar ". Seleccionamos este archivo, lo dejo abajo, luego de seleccionar presionamos "ImportarUna especie de ".
LiteSpeed tiene muchas opciones de configuraciónEntonces, en lugar de darle una insignia de media hora que le explica cómo configurar todo, le dejé una copia de la configuración de mi propio sitio web que puede importar y completar.
importante: Si está utilizando LiteSpeed Cache con LiteSpeed instalado en el servidor, El uso del complemento de optimización de imagen (EWWW Image Optimicer) descrito en el paso anterior no es adecuado.Dado que LiteSpeed tiene su propia optimización de imagen estándar, esta función es mucho más poderosa.
Para hacer esto, vaya a LiteSpeed / Image Optimizer / Enviar solicitud de optimización.
Aquí hemos completado completamente la parte de optimización de imagen y caché.
No importa si usa botones de redes sociales en su blog para que los lectores puedan compartir su contenido en sus redes sociales.
Sin embargo, bajo ninguna circunstancia haga clic en el botón "Me gusta".Este tipo de botones añaden código muy pesado y sin comprimir que tiene un gran impacto en los tiempos de carga del sitio web.
En el panel de control del periódico, vaya a "Configuración de publicación"Luego"Comparte esoPARA ". Aquí podemos incluir"Comparte el artículo a continuación"pero Nunca encierres Amable "Artículo inferior como "o"Como artículoUna especie de ".
Eliminar la etiqueta del complemento Div Social Counter
Este es uno de los complementos que el tema tiene que activar durante la instalación, especialmente desde Newspaper 10.0. Sin embargo, no usaremos este complemento (sí, debe eliminar todos los widgets de su hogar u otros sitios web y los me gusta de las redes sociales considerar).
¿Causa principal? Esto es extremadamente perjudicial para la optimización, ya que genera toneladas de enlaces pesados que apuntan a RRSS y, sin duda, ralentiza nuestro sitio web. ¿Crees que cuando digo que no es muy práctico ... pero solo estéticamente agradable, entonces si es dañino entonces por qué es necesario? Desactivar y eliminar.
Activar el complemento tagDiv móvil
Active cualquier otro complemento necesario para que Newspaper funcione, y Instalar el plugin tagDiv Mobile Theme (Opcional en la sección "Plugins" del periódico).
Para lograr un buen puntaje de PageSpeed de Google, es imperativo mantenerlo activo. Si solo queremos usar la versión móvil o el mobile + booster (si tienes muchas publicaciones recomiendo mobile + booster) podemos activarlo a través del periódico / campo temático / tema móvil / opciones.
Eliminar complementos que no usamos / no necesitamos
Luego vaya a la sección Complementos de WordPress Deshabilite y elimine por completo cualquier complemento que no sea estrictamente necesario.Si no está utilizando complementos, desinstálelos por completo.
Los complementos desactivados también consumen Recursos y daños a su sitio web, si no lo está utilizando, no sea el propietario.
Olvídese por completo de los complementos para agregar botones sociales / para compartir, complementos para crear páginas de fans / cuadros similares, complementos de seguridad potentes como Wordfence, complementos para abrir ventanas emergentes, etc. Deje todos estos complementos estéticos a un lado, ya que solo agregarán una gran cantidad de código a su página. Elimínelos por completo, no solo desactívelos...
La importancia del hosting
Es importante tener un servidor web bien optimizado para que todas las optimizaciones de nuestras aplicaciones funcionen como se espera.Cuando tenemos un mal hosting, la optimización de la red es inútil.
Podemos utilizar un VPS optimizado para nuestro sitio web, yo Recomiendo usar LiteSpeed Porque aumenta significativamente la velocidad. Para darle una idea, el mejor servidor web que existe hoy en día es mucho mejor que Apache y se usa como un proxy inverso que Nginx o Nginx.
Utilizo la nubosidad en este sitio porque es muy poderoso, pero cada uno tiene sus propias peculiaridades.
O podemos tener uno también Colocación de la base Para un alojamiento de alta calidad, recomiendo Banahosting ya que probablemente sea la mejor característica (CPanel + LiteSpeed) que he encontrado.
Cómo usar tadDiv Mobile Optimiza tu página de inicio
Al usar Newspaper para optimizar nuestro sitio web y activar el complemento tagDiv Mobile, uno de los principales problemas fue que la página de inicio y las categorías predeterminadas eran estéticamente deficientes.
Afortunadamente Existe una forma muy sencilla de solucionar este problema.Gracias al editor de archivos de Gutenberg (no me gusta nada).
Cuando activamos el complemento "Editor clásico“Al igual que conmigo, lo primero que tenemos que hacer es apagarlo por completo. Luego ve a la sección "Pinas "Nuestro WordPress, luego editamos la página que hemos configurado como"Página de inicioUna especie de ".
Después de haber iniciado sesión en la página de inicio con el editor de Gutenberg, navegamos hacia la derecha y hacemos clic en el símbolo de movimiento. Entre las opciones mostradas veremos  "Activar / desactivar temas móviles"Luego hacemos clic"curriculum vitae ”Se utiliza para guardar cambios.
Después de todo esto, vamos a la sección de complementos y reactivamos nuestro editor clásico (si se inició antes). Vaciamos la caché y nuestra página de inicio ya está funcionando en el "SensibleAlgo así. "Así que funciona perfectamente en el teléfono.
Obviamente, no está optimizado para PageSpeed como Post. Si queremos tener una buena estética, tenemos que pagar un precio determinado.
Puede editar categorías de la misma manera ... Usando categorías personalizadas de "Clud Templates" podemos copiar y pegar su código en una página normal. Por lo tanto, también podemos utilizar esta página como categoría de respuesta en dispositivos móviles.
Solo necesitamos cambiar la categoría real de la página creada en el menú web (recomiendo darles un nombre similar pero diferente para la categoría). Luego, usando las opciones avanzadas de Yoast Seo, en la parte inferior de cada página podemos poner la URL canónica en una categoría para que Google no lo considere contenido duplicado.
Optimice el problema de Adsense en los periódicos
No es un secreto Al usar anuncios de Adsense, cualquier optimización de la página se pierde por completoAdsense agrega mucho tiempo de carga adicional, muchas consultas y mucho código.
Como resultado, cualquier página web bien optimizada que obtenga una excelente puntuación en Google PageSpeed Insights perderá todas las optimizaciones y su puntuación se reducirá drásticamente.
Este problema siempre me ha dado dolor de cabeza, pasé meses pensando en cómo solucionar este problema. No se requiere AdSensePorque esta es una forma de monetización que utilizo en muchos sitios.
Después de mucho trabajo e investigación, finalmente encontré una muy buena solución. Esta es la solución que he usado en este y otros sitios. Es un complemento gratuito llamado Publicidad avanzada, Junto con un complemento titulado "Edición profesional“Permítanos utilizar la carga diferida para los anuncios.
Para evitar que esta guía sea demasiado extensa porque no todos usan Adsense, he creado una guía completa para la optimización de anuncios de una manera muy simple. Puedes verlo desde aquí:
Resultados de páginas optimizadas con este tutorial, incluso con ciertas fuentes (esta no es mi recomendación por defecto).
Eso es todo, espero que esta guía completa para la optimización de periódicos pueda ayudarlo a mejorar sus resultados dramáticamente con el nuevo PageSpeed Insights de Google.
Dediqué mucho tiempo a crear esta guía para compartirla contigo, así que Muchas gracias Cualquier comentario, pregunta o sugerencia de mejora que le gustaría dejar.
Para tu salud
Deja una respuesta