Solucionar problemas de JavaScript relacionados con la Búsqueda
Con esta guía, podrás identificar y solucionar problemas de JavaScript que quizá impidan que tus páginas o parte del contenido de páginas con JavaScript se muestren en la Búsqueda de Google. Aunque el robot de Google puede ejecutar JavaScript, debes tener en cuenta ciertas diferencias y limitaciones al diseñar tus páginas y aplicaciones para adaptarlas a la forma en que los rastreadores acceden a tu contenido y lo renderizan.
El robot de Google está diseñado para tener un funcionamiento ejemplar en la Web. Aunque su principal prioridad es rastrear contenido, también procura que, al hacerlo, los usuarios que visiten el contenido al mismo tiempo no tengan una mala experiencia. El robot de Google, junto con su componente de servicio de renderizado web (WRS), está constantemente analizando e identificando los recursos que no aportan nada al contenido esencial de las páginas para después elegir si los omite. Por ejemplo, es el caso de las solicitudes de informes, de errores y otras similares, que no se utilizan o son innecesarias para extraer el contenido esencial de la página.
Si crees que hay algún problema con JavaScript que quizá impida que tus páginas o parte del contenido de páginas con JavaScript aparezcan en la Búsqueda de Google, sigue los pasos que se indican a continuación.
Comprueba cómo se rastrea y renderiza una URL en Google con la prueba de optimización para móviles o la herramienta de inspección de URLs de Search Console. En el enlace "Más información" que aparece en la tarjeta de veredicto de la página que hayas probado, se muestran los recursos que se han cargado, el resultado y las excepciones de la consola de JavaScript, y el DOM renderizado, entre otros datos.
También te recomendamos que registres y audites los errores de JavaScript que se encuentren tanto los usuarios como el robot de Google al visitar tu sitio web; de este modo, podrás identificar posibles problemas que puedan afectar a la forma en que se renderiza el contenido.
Ejemplo
A continuación se muestra un ejemplo de cómo se registran los errores de JavaScript en el controlador global onerror.
window.addEventListener('error', function(e) {
var errorText = [
e.message,
'URL: ' + e.filename,
'Line: ' + e.lineno + ', Column: ' + e.colno,
'Stack: ' + (e.error && e.error.stack || '(no stack trace)')
].join('\n');
// Example: log errors as visual output into the host page.
// Note: you probably don’t want to show such errors to users, or
// have the errors get indexed by Googlebot; however, it may
// be a useful feature while actively debugging the page.
var DOM_ID = 'rendering-debug-pre';
if (!document.getElementById(DOM_ID)) {
var log = document.createElement('pre');
log.id = DOM_ID;
log.style.whiteSpace = 'pre-wrap';
log.textContent = errorText;
if (!document.body) document.body = document.createElement('body');
document.body.insertBefore(log, document.body.firstChild);
} else {
document.getElementById(DOM_ID).textContent += '\n\n' + errorText;
}
// Example: log the error to remote service.
// Note: you can log errors to a remote service, to understand
// and monitor the types of errors encountered by regular users,
// Googlebot, and other crawlers.
var client = new XMLHttpRequest();
client.open('POST', 'https://example.com/logError');
client.setRequestHeader('Content-Type', 'text/plain;charset=UTF-8');
client.send(errorText);
});
No publiques contenido que dependa de datos anteriores.
Asegúrate de que tu aplicación utilice la detección de funciones con todas las API importantes que necesite y de que proporcione una alternativa o un polyfill cuando corresponda.
Comprueba que tus componentes web estén optimizados para la búsqueda:
Encapsula y oculta información sobre la implementación con shadow DOM.
Incluye tu contenido en light DOM siempre que puedas.
