Se o seu trabalho envolve SEO em algum nível, você provavelmente foi a ouvir mais e mais sobre JavaScript e as implicações que tem no rastreamento e indexação. Francamente, o Googlebot lutas com ela, e muitos websites os utilizam modernos JavaScript para carregar no conteúdo crucial hoje. Devido a isso, precisamos estar equipados para discutir este tema, quando ele vem para ser eficaz.

O objetivo deste post é equipá-lo com o mínimo viável o conhecimento necessário para fazê-lo. Este post não vou entrar nos mínimos detalhes, descrever a história, ou dar-lhe a extrema detalhes sobre especificações. Há um monte de incrível write-ups que já fazem isso — eu sugiro dar-lhes uma leitura se você está interessado em mergulho profundo (eu vou ligar para minha lista de favoritos, na parte inferior).

Para ser eficaz, consultores, quando se trata do tema wordpress e SEO, precisamos ser capazes de responder a três perguntas:

O domínio/página em questão dependem de JavaScript do lado do cliente para carregar/alterar na página de conteúdo ou links?

Se sim, é o Googlebot de ver o conteúdo carregado na via JavaScript corretamente?

Se não, qual é a solução ideal?

Com algumas pesquisas rápidas, eu era capaz de encontrar três exemplos de páginas de destino que usam JavaScript para carregar no conteúdo crucial.

• Sitecore o Simpósio da página
• Hulu página de destino para “O Caminho”
• A l’Oréal página inicial

Eu vou estar usando Sitecore o Simpósio da página de destino através de cada um desses pontos de conversa para ilustrar como responder as perguntas acima.

Nós vamos cobrir o “como posso fazer isso” aspecto primeiro, e no final eu vou expandir alguns conceitos básicos e link para mais recursos.

Pergunta 1: o domínio em questão dependem de JavaScript do lado do cliente para carregar/alterar na página de conteúdo ou links?

O primeiro passo para diagnosticar quaisquer problemas envolvendo JavaScript consiste em verificar se o domínio usa-lo para carregar no conteúdo crucial que poderia impacto (SEO on-page de conteúdo ou links). O ideal é que isso vai acontecer a qualquer momento você obter um novo cliente (durante a fase inicial da auditoria técnica), ou sempre que o seu cliente reformulações/lança novos recursos do site.

Como podemos fazer isso?

Pedir ao cliente

Pedi, e recebereis! Seriamente embora, um dos mais rápida/mais fáceis as coisas que você pode fazer como um consultor é contactar o seu POC (ou desenvolvedores sobre a conta) e pedir-lhes. Afinal, essas são as pessoas que trabalham no site do dia-a-dia!

“Oi [cliente], atualmente, estamos fazendo uma técnica de varredura no site. Uma coisa que temos que verificar é se qualquer crucial de conteúdo (links, sobre o conteúdo da página) é carregado na via JavaScript. Vamos fazer alguns testes manuais, mas uma maneira fácil de confirmar isso é pedir! Você poderia (ou a equipe) responda as seguintes, por favor? 1. Estamos usando JavaScript do lado do cliente para carregar em importantes de conteúdo? 2. Se sim, podemos obter uma lista com marcadores de onde o conteúdo é carregado na via JavaScript?”

Verificar manualmente

Mesmo em um grande site de e-commerce com milhões de páginas, normalmente há apenas um punhado de importantes modelos de página. Na minha experiência, ele só deve levar uma hora max para verificar manualmente. Eu uso o Chrome os Desenvolvedores da Web plugin, desabilitar o JavaScript a partir daí, e verificar manualmente o importante modelos de site (página inicial, página de categoria, página de produto, blog, etc.)

No exemplo acima, uma vez que desligar o JavaScript e recarregar a página, podemos ver que estamos olhando para uma página em branco.

Como você progredir, tomar notas sobre o conteúdo que não esteja a ser carregada, está a ser carregado no errado, ou quaisquer links internos que não está funcionando adequadamente.

No final desta etapa, devemos saber se o domínio em questão depende de JavaScript para carregar/alteração no conteúdo da página ou os links. Se a resposta é sim, nós também deve saber onde isso acontece (página inicial, páginas de categoria, módulos específicos, etc.)

Rastreamento

Você também pode rastrear o site (com uma ferramenta como o Screaming Frog ou Sitebulb) com renderização de JavaScript desactivado e, em seguida, executar o rastreamento mesmo com JavaScript ativado, e compare as diferenças com links internos e elementos da página.

Por exemplo, pode ser que quando você rastrear o website com renderização de JavaScript desactivado, as tags de título, não aparecem. Em minha mente, isso provocaria uma ação para rastrear o website com renderização de JavaScript ativado para ver se as tags de título de aparecer (bem como conferir manualmente).

Exemplo

Para o nosso exemplo, eu fui em frente e fiz uma verificação manual. Como podemos ver na imagem abaixo, quando nós desativar o JavaScript, o conteúdo não é de carga.

Em outras palavras, a resposta à nossa primeira pergunta para este páginas é “sim, o JavaScript está a ser utilizado para carregar em partes cruciais do site.”

Pergunta 2: Se sim, é o Googlebot de ver o conteúdo carregado na via JavaScript corretamente?

Se o seu cliente está a depender de JavaScript em certas partes de seu site (no nosso exemplo, que eles são), ele é o nosso trabalho para tentar replicar como o Google está vendo a página(s). Queremos responder a pergunta, “o Google Está vendo a página/site da maneira que nós queremos que ele?”

Para obter uma descrição precisa do que o Googlebot está vendo, precisamos tentar imitar a forma como ele rastreia a página.

Como podemos fazer isso?

Usar o novo Google mobile-friendly ferramenta de teste

No momento, a forma mais rápida e mais precisa forma para tentar replicar o que o Googlebot está vendo em um site está usando o novo Google mobile simpatia ferramenta. Meu colega Dom recentemente escreveu uma profundidade post comparando Pesquisa Console de Buscar e Processar, Googlebot, e o móvel simpatia ferramenta. Suas conclusões foram que a maior parte do tempo, o Googlebot e o móvel simpatia ferramenta resultou na mesma saída.

No móvel do Google simpatia ferramenta, basta inserir o seu URL, o hit “run test” e, em seguida, uma vez que o teste for concluído, clique em “código fonte” no lado direito da janela. Você pode pegar o código e pesquise qualquer conteúdo da página (tags de título, paramentos, etc.) ou os links. Se eles aparecem por aqui, o Google é mais provável ver o conteúdo.

Procurar visível de conteúdo no Google

É sempre bom sentido-seleção. Outra forma rápida de verificar se o GoogleBot tem indexado de conteúdo na sua página, basta selecionar o texto visível da sua página, e fazer um site:pesquisar no Google com aspas em redor, disse o texto.

No nosso exemplo, é visível o texto na página que lê…

“Se você estiver em marketing, desenvolvimento de negócios, ou ELE, você sente uma sensação de urgência. Ou, talvez, a oportunidade?”

Quando fazemos um site:a busca por esta expressão exata, para essa mesma página, vamos conseguir nada. Isso significa que o Google não indexado de conteúdo.

O rastreamento com uma ferramenta

A maioria das ferramentas de rastreamento de ter a funcionalidade para rastrear o JavaScript agora. Por exemplo, em Gritando Sapo que você pode cabeça para configuração > aranha > renderizar >, em seguida, selecione “JavaScript” a partir da lista pendente e clique em “salvar”. DeepCrawl e SiteBulb possuam ambos a esta função também.

A partir daqui, você pode introduzir o seu domínio/URL e veja a página processada/código uma vez que a sua ferramenta de escolha foi concluída a pesquisa.

Exemplo:

Ao tentar responder a essa pergunta, a minha preferência é começar por introduzir o domínio para os móveis do Google simpatia ferramenta, copiar o código-fonte, e procurando importante em elementos da página (acho que a tag de título

, cópia do corpo, etc.) Também é útil para utilizar uma ferramenta como ‘diff’, o verificador de comparar o HTML processado com o HTML original (Gritando Sapo também tem uma função em que você pode fazer isso ao lado).

Para o nosso exemplo, é aqui que a saída do móvel simpatia ferramenta de shows-nos.

Depois de algumas pesquisas, fica claro que o importante em elementos da página estão em falta aqui.

Nós também fizemos o segundo teste e confirmou que o Google não indexados o conteúdo do corpo encontrado nesta página.

A implicação neste ponto é que o Googlebot não está vendo o nosso conteúdo a maneira que nós queremos, que é um problema.

Vamos em frente e ver o que podemos recomendar o cliente.

Pergunta 3: Se estamos confiantes de que o Googlebot não está vendo o nosso conteúdo corretamente, o que deve recomendamos?

Agora sabemos que o domínio é usar JavaScript para carregar no conteúdo crucial e sabemos que o Googlebot é mais provável de não ver que o conteúdo, a etapa final é para recomendar uma solução ideal para o cliente. Palavra chave: recomendo, não implementar. É 100% nosso trabalho para assinalar o problema ao nosso cliente, explicar por que é importante (bem como as possíveis implicações), e destacar uma solução ideal. Ele é 100% não o nosso trabalho para tentar fazer o desenvolvedor a tarefa de descobrir uma solução ideal para a pilha/recursos/etc.

Como podemos fazer isso?

Você quer processamento do lado do servidor

A principal razão por que o Google está tendo problemas para ver Sitecore a página de destino, agora, é porque Sitecore a página de destino é perguntando ao usuário (eua, o Googlebot) para fazer o trabalho pesado de carregar o JavaScript em sua página. Em outras palavras, eles estão usando JavaScript do lado do cliente.

O Googlebot é, literalmente, o desembarque na página, tentando executar JavaScript como a melhor possível, e, em seguida, precisar de sair antes de ter uma chance para ver todo o conteúdo.

A correção aqui é, em vez de ter Sitecore a página de destino de carga em seu servidor. Em outras palavras, queremos levar o trabalho pesado fora do Googlebot, e colocá-lo em Sitecore servidores. Isso irá garantir que, quando o Googlebot vem para a página, ele não tem de fazer qualquer trabalho pesado e em vez de rastreamento renderizado o HTML.

Neste cenário, o Googlebot terras na página e já se vê o HTML (e todo o conteúdo).

Existem opções mais específicas (como isomórficas configurações)

Este é o lugar onde chega a ser um pouco de ervas daninhas, mas existem soluções híbridas. O melhor no momento é chamado de isomórficas.

Neste modelo, nós estamos pedindo para o cliente para carregar a primeira solicitação em seu servidor e, em seguida, no futuro, quaisquer solicitações são feitas do lado do cliente.

Assim Googlebot vem para a página, o cliente do servidor já tiver executado o JavaScript inicial necessária para a página, envia renderizado em HTML para o navegador, e nada depois que é feito no lado do cliente.

Se você estiver olhando para recomendar esta como uma solução, por favor, leia este post do AirBNB equipe que cobre isomórficas configurações em detalhe.

Rastreamento de AJAX = não vá

Eu não vou entrar em detalhes sobre isso, mas só sei que o Google anterior de rastreamento de AJAX solução para JavaScript já foi descontinuado e, eventualmente, não irá funcionar. Não devemos recomendar este método.

(No entanto, estou interessado em ouvir os estudos de caso a partir de qualquer um que implementou esta solução recentemente. Como o Google respondeu? Também, aqui está um ótimo texto sobre isso com meu colega Rob.)

Resumo

Correndo o risco de ser gravemente extrema simplificação, aqui está o que você precisa fazer para começar a trabalhar com JavaScript e SEO em 2018:

Saber quando e onde o domínio do cliente usa JavaScript do lado do cliente para carregar na página de conteúdo ou links.

Pedir aos desenvolvedores.

Desativar JavaScript e fazer alguns testes manuais pelo modelo de página.

Rastreamento usando um JavaScript rastreador.

Verificar se o GoogleBot está vendo o conteúdo da maneira que pretendo.

Móvel do Google simpatia verificador.

Fazendo uma pesquisa site:conteúdo visível na página.

Rastreamento usando um JavaScript rastreador.

Dar um ideal de recomendação para o cliente.

Processamento do lado do servidor.

Soluções híbridas (isomórfica).

Não rastreamento de AJAX.

Recursos adicionais

• O melhor Guia para JavaScript, SEO
• JavaScript e SEO: A Diferença Entre Rastreamento e Indexação de
• Princípios fundamentais de SEO para JavaScript
• Como Auditar o JavaScript para SEO
• JavaScript SEO Recursos
• Fonte de vista: Por que Ainda é importante e Como Rapidamente Compará-lo a um Prestados DOM

Eu estou realmente interessada em ouvir sobre suas experiências com JavaScript e SEO. Quais são alguns exemplos de coisas que funcionaram bem para você? O que sobre coisas que não funcionou tão bem? Se você tiver implementado um isomórfica de configuração, estou curioso para saber como isso impactou a forma como o Googlebot vê o seu site.