JavaScript ha transformat la manera com construïm llocs web. Frameworks com React, Vue i Angular permeten crear experiències interactives que fa deu anys eren impensables. Però aquella sofisticació té un cost ocult: si Google no pot renderitzar el vostre JavaScript, el vostre contingut és invisible per a la cerca orgànica.
El problema no és que Google no suporti JavaScript — sí que ho fa. El problema és com el processa, els recursos que necessita i les fallades silencioses que poden deixar pàgines senceres fora de l’índex sense que rebeu cap alerta. Si el vostre lloc depèn de JavaScript per mostrar contingut crític, heu d’entendre exactament què pot anar malament i com prevenir-ho.
Per què JavaScript pot ser un problema per al SEO
Un lloc HTML tradicional lliura contingut llest per llegir a la primera resposta del servidor. Googlebot el rep, el processa i l’indexa. Amb JavaScript, el flux canvia: el servidor lliura un document HTML quasi buit (normalment un <div id="root">) i el navegador executa JavaScript per construir el contingut visible.
Aquest model funciona bé per als usuaris amb navegadors moderns. Però per a Googlebot implica un pas addicional de renderització que consumeix recursos, introdueix retards i pot fallar de maneres difícils de detectar. Qualsevol problema tècnic SEO que afecti el rastreig s’amplifica quan hi ha JavaScript de per mig.
Els llocs construïts com Single Page Applications (SPA) són els més afectats. En gestionar la navegació amb JavaScript en lloc d’URL tradicionals, poden generar problemes de routing, de càrrega de contingut i de meta tags dinàmics que afecten directament la indexació.
Com renderitza Google el JavaScript: el procés de dues onades
Googlebot no renderitza JavaScript en temps real com faria un navegador. Fa servir un procés de dues onades clarament diferenciades:
Primera onada: rastreig de l’HTML estàtic. Googlebot descarrega l’HTML que retorna el servidor i processa el seu contingut. Si la vostra pàgina lliura HTML complet (SSR o SSG), el contingut s’indexa aquí. Si lliura un shell buit amb JavaScript, Googlebot registra que cal renderitzar la pàgina i l’envia a una cua.
Segona onada: renderització JavaScript. Les pàgines que necessiten renderització entren en una cua que comparteix recursos amb milions d’altres llocs. Google fa servir una versió de Chromium (el motor darrere de Chrome) per executar el JavaScript i obtenir el DOM final. Aquesta cua pot processar-se en minuts, hores, dies o setmanes depenent de la càrrega del sistema.
El problema real és la latència de la segona onada. Mentre el vostre contingut espera a la cua de renderització, no està indexat. Si publiqueu contingut urgent o competitiu, aquells dies de retard us poden costar posicions que un competidor amb SSR ja ha capturat.
Els 5 problemes de JavaScript SEO més freqüents
Contingut invisible a l’HTML inicial
Si el vostre <title>, <meta description>, <h1> o el cos principal del contingut sols existeixen després d’executar JavaScript, depeneu completament de la segona onada de renderització. Qualsevol fallada en la renderització significa que aquelles etiquetes mai no arriben a Google.
Errors de JavaScript que bloquegen la renderització
Un error de JavaScript que passa desapercebut en el desenvolupament pot bloquejar completament la renderització a Googlebot. API del navegador no suportades, dependències externes que fallen i errors de CORS són culpables freqüents. Googlebot no torna a intentar pàgines que fallen en la renderització.
Lazy loading agressiu que oculta contingut
El lazy loading és una tècnica legítima de rendiment, però quan s’aplica a contingut que es troba per sobre del fold o a elements essencials per al SEO, Googlebot pot no activar el desplaçament necessari per carregar aquell contingut. Gestionar el crawl budget esdevé crític quan part de les pàgines rastreades no lliuren contingut útil.
Meta tags dinàmics mal implementats
Canviar el <title> i <meta description> amb JavaScript després de la càrrega és un patró habitual en SPAs. El problema: si Google processa la pàgina en la primera onada i troba el títol genèric del shell HTML en lloc del títol específic de la pàgina, aquell títol genèric és el que pot aparèixer als resultats de cerca.
Routing basat en hash (#) o pushState mal configurat
Les URL amb hash (example.com/#/productes) no son rastreables per Google. El fragment hash s’ignora a les sol·licituds HTTP. Les URL amb pushState (example.com/productes) sí que son rastreables, però requereixen que el servidor retorni contingut vàlid per a cada ruta, no sols per a l’arrel.
Com diagnosticar si Google veu el vostre contingut JavaScript
El diagnòstic requereix comparar el que Google veu amb el que l’usuari veu:
Inspecció d’URL a Google Search Console. L’eina més directa. Introduïu qualsevol URL, sol·liciteu la prova de la URL publicada i examineu la captura de pantalla de l’HTML renderitzat. Si veieu un shell buit o contingut incomplet, Google no està renderitzant correctament el vostre JavaScript.
Cerqueu a Google amb site:elvostredomini.com. Si les pàgines apareixen amb títols genèrics, descripcions buides o fragments sense sentit, és un senyal clar que la renderització JavaScript està fallant.
Informe de cobertura a Search Console. Busqueu errors del tipus «la pàgina no és apta per a resultats enriquits» o «URL rastreada però no indexada». Aquests senyals poden indicar que Googlebot rastreja la pàgina però no aconsegueix renderitzar contingut útil.
Chrome DevTools amb JavaScript desactivat. Desactiveu JavaScript a DevTools (Settings > Debugger > Disable JavaScript) i torneu a carregar la vostra pàgina. El que veieu és aproximadament el que Googlebot obté en la primera onada. Si la pàgina és en blanc, teniu un problema.
Screaming Frog en mode JavaScript. Configureu Screaming Frog per rastrejar amb renderització JavaScript activada i compareu-ho amb un rastreig sense JavaScript. Les diferències en títols, H1 i contingut us indicaran exactament de quin aspecte depèn de la renderització.
Solucions: SSR, pre-renderització, hidratació progressiva
Server-Side Rendering (SSR)
El servidor executa el JavaScript i lliura HTML complet a la primera resposta. Googlebot rep contingut llest per indexar sense necessitat de renderització addicional. Frameworks com Next.js (React), Nuxt (Vue) i SvelteKit (Svelte) implementen SSR de forma nativa.
El cost és que cada sol·licitud requereix processament al servidor, la qual cosa pot augmentar el TTFB si el servidor no està ben dimensionat. Però per al SEO, és la solució més robusta.
Generació estàtica (SSG)
L’HTML es genera en el moment de la construcció, no en cada sol·licitud. El resultat són fitxers HTML estàtics que es serveixen des d’un CDN amb temps de resposta mínims. Astro, Next.js i Hugo són exemples de generadors estàtics.
SSG és ideal per a contingut que no canvia amb cada visita: blocs, pàgines de producte, pàgines d’aterratge. Combina el benefici SEO de l’HTML complet amb la velocitat dels fitxers estàtics.
Hidratació progressiva (Islands Architecture)
La hidratació progressiva lliura HTML estàtic i sols carrega JavaScript per als components que necessiten interactivitat. Astro va popularitzar aquest patró amb la seva Island Architecture: el contingut estàtic es renderitza al servidor i els components interactius s’hidraten individualment amb directives com client:visible.
Aquest enfocament redueix dràsticament la quantitat de JavaScript que el navegador necessita processar, millora el rendiment i elimina els problemes de renderització per al contingut SEO-crític.
Pre-renderització com a solució intermèdia
Si migrar a SSR no és viable a curt termini, la pre-renderització genera HTML estàtic per als bots de cerca mentre els usuaris continuen rebent la versió JavaScript. Eines com Prerender.io o Rendertron actuen com a intermediaris que emmagatzemen en memòria cau la versió renderitzada.
És una solució temporal. Google ha expressat preferència perquè els bots i els usuaris rebin el mateix contingut, i la pre-renderització selectiva pot interpretar-se com a cloaking si s’implementa incorrectament.
Preguntes freqüents sobre JavaScript SEO
Pot Google indexar pàgines amb React o Vue?
Sí, però amb condicions. Si feu servir React o Vue en mode SPA (renderització al costat del client), Googlebot ha de renderitzar el JavaScript per veure el contingut, la qual cosa pot causar retards. La solució recomanada és fer servir frameworks amb SSR (Next.js per a React, Nuxt per a Vue) o pre-renderització perquè el contingut estigui disponible a l’HTML inicial.
El server-side rendering és millor per al SEO?
SSR és l’opció més segura per al SEO perquè el contingut està disponible a l’HTML des de la primera resposta del servidor, sense dependre de la renderització JavaScript. La generació estàtica (SSG) és fins i tot millor per a contingut que no canvia freqüentment. Frameworks com Astro, Next.js i Nuxt ofereixen ambdues opcions.
Com sé si Google està renderitzant el meu JavaScript?
Feu servir l’eina d’inspecció d’URL de Google Search Console. Introduïu la URL, feu clic a «Prova la URL publicada» i compareu la captura de pantalla de l’HTML renderitzat amb el que hauríeu de veure. Si falta contingut, Google no està renderitzant correctament el vostre JavaScript.
Si el vostre lloc depèn de JavaScript per lliurar contingut i sospiteu que Google no el veu correctament, necessiteu un diagnòstic tècnic abans de perdre més posicions. Contacteu amb nosaltres per analitzar com Googlebot processa el vostre lloc i quins canvis prioritzar per recuperar visibilitat orgànica.
Comparteix aquest article
Si t'ha resultat útil aquest contingut, comparteix-lo amb els teus col·legues.
Preguntes Freqüents
¿Con qué frecuencia publican contenido nuevo?
Publicamos artículos nuevos semanalmente, enfocados en las últimas tendencias de SEO técnico, casos de estudio reales y mejores prácticas. Suscríbete a nuestro newsletter para no perderte ninguna actualización.
¿Los consejos son aplicables a cualquier tipo de sitio web?
Nuestros consejos se adaptan a diferentes tipos de sitios: ecommerce, blogs, sitios corporativos y aplicaciones web. Siempre indicamos cuándo una técnica es específica para cierto tipo de sitio o requerimientos técnicos.
¿Puedo implementar estas técnicas yo mismo?
Muchas técnicas básicas puedes implementarlas tú mismo siguiendo nuestras guías paso a paso. Para optimizaciones avanzadas o auditorías completas, recomendamos consultar con especialistas en SEO técnico como nuestro equipo.
¿Ofrecen servicios de consultoría personalizada?
Sí, ofrecemos servicios de consultoría SEO técnica personalizada, auditorías completas y optimización integral. Contáctanos para discutir las necesidades específicas de tu proyecto y cómo podemos ayudarte.
