Google recomienda optimizar las web a móviles y AMP

Juan Cascón Baños
Google recomienda optimizar las web a móviles y AMP

Google recomienda optimizar las web a móviles y AMP



Categorías: Destacada, Internet, Móviles
Etiquetas: , , , , , ,

Google recomienda optimizar las web a móviles. Los móviles están cambiando el mundo y Google lo sabe.

El dinero ahora está en el móvil y quiere que aunque tengas un móvil con poca RAM y procesador , la experiencia sea satisfactoria.

Hoy en día, todos llevamos un smartphone encima y nos comunicamos y buscamos información constantemente. En muchos países, ya hay más smartphones que ordenadores, por lo que disponer de un sitio web optimizado para móviles se ha convertido en un requisito esencial de la presencia online. Es básico para el SEO y el WPO.

Además deberás tener una versión AMP.

Google recomienda optimizar las web a móviles y AMP

Si todavía no has optimizado tu sitio web para móviles, deberías hacerlo. Es probable que la mayor parte de los usuarios que visitan tu sitio web lo hagan desde un dispositivo móvil.

  1. Si no sabes si tu sitio web está optimizado para móviles, haz la Prueba de optimización para móviles ahora mismo.
  2. Si has utilizado un software de gestión de contenido como WordPress para diseñar tu sitio web, consulta nuestra guía para personalizar el software de tu sitio web.
  3. Si no utilizas un software de este tipo, te recomendamos contratar a un desarrollador web. Disponemos de unalista de comprobación sobre los aspectos que debes tener en cuenta al hacerlo.
  4. Si tienes los conocimientos técnicos suficientes para hacerlo tú mismo, consulta nuestra Guía de SEO para móviles.

Si quieres obtener más información sobre las razones por las que deberías crear un sitio web optimizado para móviles, continúa leyendo.

¿Por qué optimizar un sitio web para móviles?

La versión para ordenadores de un sitio web puede ser difícil de ver y de usar desde un dispositivo móvil. En las versiones no optimizadas para móviles, los usuarios deben pellizcar o ampliar el contenido para poder leerlo. Esto es incómodo para los usuarios, que acostumbran a terminar por abandonar el sitio. En cambio, las versiones optimizadas para móviles se pueden leer bien y son fáciles de utilizar.

En EE.UU., el 94% de las personas con smartphones buscan información local desde los teléfonos. Curiosamente, el 77% de las búsquedas en móviles se hacen desde casa o desde el trabajo, donde normalmente hay ordenadores.

Los móviles son fundamentales para tu negocio y lo seguirán siendo, tanto si escribes un blog sobre tu equipo deportivo favorito, como si trabajas en el sitio web del teatro de tu comunidad o si vendes productos a posibles clientes. Por lo tanto, asegúrate de que los visitantes tengan una buena experiencia cuando accedan a tu sitio desde sus dispositivos móviles.

¿Cómo empiezo?

El trabajo necesario para optimizar un sitio web para móviles depende de los recursos del desarrollador, del modelo de negocio y de la experiencia. En el diagrama siguiente puedes ver un ejemplo de cómo se rediseña un sitio para ordenadores para que funcione en móviles:

En una implementación muy básica, hacer la transición de un sitio para ordenadores a un sitio para móviles implica partir de las secciones de contenido actuales del sitio para ordenadores y organizarlas en un patrón de diseño optimizado para móviles.

Para obtener más información sobre la implementación técnica de un sitio web para móviles, tanto si contratas a un desarrollador como si lo haces tú mismo, consulta nuestra documentación en SEO para móviles.

¿Cuánto cuesta crear un sitio para dispositivos móviles?

Depende de la opción que elijas. Te presentamos algunos ejemplos:

La parte positiva es que, si empiezas desde cero, el desarrollador puede utilizar un tema o una plantilla existentes. También puedes reutilizar tu contenido actual, con lo que probablemente ahorres tiempo y dinero.

¿Cuáles son los pasos siguientes?

 

¿AMP es necesario?

El siguiente paso es que debes tener una versión AMP para móviles.

¿Qué es AMP?

AMP es una manera de compilar páginas web para contenido estático de representación rápida. AMP en acción consta de tres partes diferentes:

AMP HTML es HTML con algunas restricciones para lograr un rendimiento confiable, y con algunas extensiones para compilar contenido enriquecido más allá del formato HTML básico. La biblioteca AMP JS garantiza la representación rápida de páginas AMP HTML. El Google AMP Cache (opcional) proporciona las páginas AMP HTML.

 

AMP HTML

AMP HTML es básicamente contenido HTML ampliado con propiedades AMP personalizadas. El archivo en AMP HTML más sencillo tiene el siguiente aspecto:

<!doctype html>
<html ⚡>
 <head>
   <meta charset="utf-8">
   <link rel="canonical" href="hello-world.html">
   <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
   <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
   <script async src="https://cdn.ampproject.org/v0.js"></script>
 </head>
 <body>Hello World!</body>
</html>

Si bien la mayoría de las etiquetas en una página AMP HTML son etiquetas HTML comunes, algunas etiquetas HTML se reemplazan por etiquetas específicas de AMP (consulta también la sección deetiquetas HTML en la especificación de AMP). Estos elementos personalizados, llamados componentes AMP HTML, crean patrones comunes que pueden implementarse con buen rendimiento en forma sencilla.

Por ejemplo, la etiqueta amp-img proporciona soporte completo de srcset, incluso en navegadores que todavía no lo admiten. Obtén más información acerca de cómo crear tu primera página AMP HTML.

AMP JS

La biblioteca AMP JS implementa todas las prácticas recomendadas de rendimiento de AMP, administra la carga de recursos y te proporciona las etiquetas personalizadas que se mencionan arriba para garantizar la representación rápida de tu página.

Una de las optimizaciones más importantes es que transforma en asincrónico todo lo que proviene de recursos externos, de modo que ningún elemento de la página pueda bloquear la representación.

Entre otras técnicas de rendimiento se incluyen la disposición de todos los iframes en espacios seguros, el cálculo previo del diseño de cada elemento de la página antes de que se carguen los recursos y la desactivación de selectores de CSS lentos.

Para obtener más información acerca de las optimizaciones y las limitaciones, lee la especificación de AMP HTML.

Google AMP Cache

El Google AMP Cache es una red de distribución de contenido basada en proxy para la entrega de todos los documentos de AMP válidos. Captura las páginas AMP HTML, las almacena en caché y mejora el rendimiento de estas automáticamente. Al usar el Google AMP Cache, el documento, todos los archivos de JS y todas las imágenes se cargan desde el mismo origen que usa HTTP 2.0 para lograr la máxima eficiencia.

El caché también viene con un sistema de validación integrado que confirma que se garantiza el funcionamiento de la página, y que esta no depende de recursos externos. El sistema de validación ejecuta una serie de aserciones que confirman que el marcado de la página cumple con la especificación de AMP HTML.

Cada página AMP viene con otra versión del validador integrada. Esta versión puede registrar errores de validación directamente en la consola del navegador cuando se representa la página, lo que te permite ver cómo los cambios complejos en tu código podrían afectar el rendimiento y la experiencia del usuario.

Obtén más información acerca de cómo probar tus páginas AMP HTML.

¿Cómo optimizo mi sitio para los dispositivos móviles?

Si sabes con qué software se ha creado tu sitio web, consulta directamente la guía correspondiente:

Si el software de tu sitio web no aparece en la lista o tienes algún comentario que enviarnos, no dudes en rellenar este formulario de Google.

Para empezar, hemos recopilado las siguientes directrices generales:

1. Haz una copia de seguridad de tu sitio antes de modificarlo o actualizarlo.

Recomendamos hacer una copia de seguridad de tu sitio antes de realizar cambios en él. Si no estás seguro de cómo realizar una copia de seguridad de tu sitio, ponte en contacto con tu proveedor de CMS o busca información en la comunidad de Google de ayuda para webmasters.

2. Actualiza tu CMS a la última versión.

En algunos casos, al actualizar a la última versión, se aplicarán automáticamente las mejoras de seguridad necesarias que optimizarán tu sitio para móviles. Si el proceso no empieza automáticamente, inicia la actualización de forma manual para evitar fallos de seguridad. Por ejemplo, Joomla 3 ofrece asistencia para móviles.

3. Si el CMS ofrece temas personalizados, asegúrate de que estén optimizados para móviles de las siguientes formas:

  1. En el panel de administración de tu CMS, puedes ver un tema para tu sitio y buscar en su documentación términos como «móvil» o «adaptable».
  2. Si hay una plantilla de demostración disponible, copia y pega la URL de la plantilla en la herramienta Prueba de optimización para móviles y asegúrate de que esté optimizada para dispositivos móviles.
  3. También puedes aprovechar para comprobar si la plantilla es rápida consultando la sección de velocidad de PageSpeed Insights. Asegúrate de que no haya en dicha sección problemas pendientes de solucionar.

4. Revisa los foros de ayuda de tu CMS para ver qué problemas pueden tener los usuarios con las versiones para móviles de sus sitios

Fuentes:

https://www.ampproject.org/es/learn/about-amp/

https://developers.google.com/webmasters/mobile-sites/

https://developers.google.com/webmasters/mobile-sites/website-software/

Hagas lo que hagas a continuación, elige la siempre la optimización para móviles y AMP es tus proyectos webs. Google recomienda optimizar las web a móviles y AMP para mejorar tu SEO y WPO.

. Leer artículo completo en Frikipandi Google recomienda optimizar las web a móviles y AMP.

Entradas recientes para Google recomienda optimizar las web a móviles y AMP

  1. Una leyenda de Mercedes en la F1 llega a Gran Turismo 7 en su nueva actualización
  2. Microsoft Flight Simulator 2024 ya está disponible
  3. Need for Speed Unbound Vol. 9: Prepare for Lockdown
  4. JUEGA GRATIS A EA SPORTS F1 24 TODO EL FIN DE SEMANA
  5. Canva presenta las tendencias creativas que dominarán la industria del diseño gráfico en 2025
Salir de la versión móvil