Quão ruim é usar display: none em CSS?

72

Já ouvi muitas vezes que é ruim usar display: nonepor motivos de SEO, pois pode ser uma tentativa de inserir palavras-chave populares irrelevantes. Algumas questões:

  1. Isso ainda é recebido sabedoria?
  2. Faz diferença se você está apenas escondendo uma única palavra ou talvez um único caractere?
  3. Se você deve evitar usá-lo, quais são as técnicas preferidas para se esconder (em situações em que você precisa se tornar visível novamente em determinadas condições)?

Algumas referências que encontrei até agora:

Matt Cutts de 2005 em um comentário

Se você usa CSS diretamente para ocultar texto, não se surpreenda se isso for chamado de spam. Não estou dizendo que mouseovers, texto DHTML ou texto com logotipo, mas também com texto são spam; Eu respondi a última em uma conferência quando disse "imagine como ficaria para um visitante, um concorrente ou alguém verificando um relatório de spam. Se você mostrar o nome da sua empresa e o Expo Markers em vez de um logotipo da Expo Markers, Se o texto que você decidir exibir for 'Expo Markers cheap discount online buy online Expo Markers sale ...', seria mais cauteloso, porque isso pode parecer ruim. "

E em outro comentário no mesmo artigo

Podemos sinalizar texto que parece estar oculto usando CSS no Google. Até o momento , não removemos algoritmos os sites por fazer isso. Nós nos esforçamos para evitar jogar bebês fora com água do banho.

Eric Enge disse em 2008

O uso legítimo dessa técnica é tão predominante que eu raramente esperaria que os mecanismos de pesquisa penalizassem um site por usar o display: noneatributo. É muito difícil implementar um algoritmo que possa realmente determinar se o uso específico display: noneé destinado a enganar os mecanismos de pesquisa ou não.

Andy
fonte
E se eu usar uma tela branca de carregamento (sem texto dentro dela) que depois oculto com javascript? O Google considerará que estou ocultando a página sob essa tela branca? Obrigado
bloomingsmilez
Uso o display: none para reduzir o conteúdo da página em telas para dispositivos móveis, porque a quantidade de cópias que parece razoável em uma tela maior é demais para o telefone. Estou me causando um problema?

Respostas:

57

Nos dias de hoje em sites pesados ​​do jQuery (e outras estruturas JavaScript), não vejo como isso pode ser um problema, pois ele é usado extensivamente quando você usa coisas como controles deslizantes, transições, galerias, tickers, jQuery, etc. os mecanismos de busca são inteligentes o suficiente para não penalizar cegamente seu uso.

Um usuário declara isso no fórum da Central do webmaster do Google :

"Simplesmente usando a tela: nenhum não acionará automaticamente uma penalidade. A chave é se existe ou não um mecanismo - automático ou invocado pelo usuário - para tornar o conteúdo visível. O Google está se tornando muito hábil no processamento de JavaScript para encontre e interprete esses mecanismos. Se você usa HTML, CSS e JavaScript válidos, não tem com o que se preocupar. Boa sorte! "

Dan Diplo
fonte
Interessante, obrigado. Isso implica que eu deveria evitar ser preguiçoso e usar display: nonepara remover itens em CSS que poderiam ser removidos no código; mas por efeitos e coisas do gênero eu estou bem. Gostaria de saber então como eles podem detectar situações em que há um logotipo de imagem e o texto do logotipo também é incluído para acessibilidade, mas oculto. A partir da descrição, isso seria considerado ruim?
21710 Andy
@ Andy: Pode. Mas você não deve usar CSS para ocultar o texto do logotipo; coloque-o no altatributo da imgtag. É para isso que o atributo existe, e até onde eu sei, usá-lo tende a aumentar sua classificação de SEO.
David Z
Na verdade, parece que pode ser um caso em que você usa o longdescatributo da tag da imagem para fornecer um link para outra página que contém a descrição completa. Isso será visto apenas pelos leitores de tela (e talvez pelos mecanismos de busca). Veja webaim.org/techniques/images/longdesc#longdesc
Dan Diplo
Na verdade, não estou procurando a melhor maneira de apresentar uma descrição de um gráfico ... Eu estava me referindo à citação de Matt Cutts. Não estou dizendo que ... tenha um logotipo, mas também tenha texto é spam . Não me parece que ele esteja falando sobre o uso dos atributos altou longdesc, e isso forneceu um pequeno contraste com A chave é se existe ou não um mecanismo ... para tornar o conteúdo visível .
217 Andy
7

Se você não estiver abusando, não será um problema. No momento, o Google não rastreia folhas de estilo CSS procurando instâncias dedisplay: none

O Google não vai declarar guerra a uma regra de estilo amplamente usada; eles estão apenas alertando aqueles que pensam em adicionar 1000 palavras-chave a um site que está definido como display: noneou pior,margin-left: 9999px

Shane Stillwell
fonte
6

Use "display: none" somente quando for a ferramenta certa para usar.

Como as citações sugerem, o problema dos mecanismos de pesquisa com a exibição nenhum é spam. Tentativa de spam, independentemente de quais ferramentas você usa para isso, é uma má idéia. Se você usa CSS para algo que não seja spam, não há problema.

A ferramenta certa para o trabalho certo.

luiscubal
fonte
3
Obrigado. A questão então se torna quando é display: nonea ferramenta certa. Você diz que se o CSS for usado para qualquer coisa que não seja spam, não será um problema: você está confiante de que se eu usar display: nonecomo uma maneira lenta de remover elementos, isso não será um problema?
21710 Andy
@Andy display: nenhuma é a ferramenta correta quando você não deseja exibir algum conteúdo. Para remover elementos, talvez seja melhor não incluí-lo (ou, se estiver usando JavaScript, removendo os elementos do DOM). Se você remover o conteúdo da página usando display: none, para que os usuários não o vejam, mas os mecanismos de pesquisa ainda o indexem, isso seria spam. Se você tiver algum tipo de botão "Mostrar / Ocultar", ou algo assim, tudo bem.
23410 luiscubal
4

Eu concordo com Dan Diplo e, para acrescentar ao que ele disse, o próprio Googledisplay: none também usa em sua PÁGINA INICIAL , por isso não pode ser um problema usá-lo, desde que você não o use como spam (por exemplo, inserir centenas de palavras-chave em uma tela: nenhum painel DIV).

Abra a página inicial do Google e procure o código-fonte HTML. Procure por display:nonevocê e verá muitas vezes. :)

Marco Demaio
fonte
Obrigado Marco. Isso ainda deixa questões sobre se você pode usar display: noneelementos que nunca são visíveis.
Andy Andy
@ Andy: elementos nunca visíveis devem ser apenas SPAM, não vejo por que você deve usar elementos nunca visíveis, por que se preocupar em colocá-los na página HTML? Então, eu esperaria usá-los não é uma boa idéia. O Google poderá detectá-los agora ou no futuro e penalizar seu site.
Marco Demaio 16/09/10
O único exemplo em que consigo pensar é quando você está usando um CMS e, por motivos de tempo, convém usar CSS para ocultar um ou dois pequenos pedaços de marcação, em vez de personalizar totalmente a marcação. (E eu só estou pedindo o Q para entender a situação atual melhor -. Meu CMS de escolha é Drupal, onde alterando a marcação é rápida e fácil)
Andy
@ Andy - É logicamente possível para um mecanismo de pesquisa ler milhares de linhas de javascript e identificar casos em que é logicamente impossível que um elemento seja mostrado? Seria necessária uma imensa engenharia reversa para estudar o código de qualquer site com uma linha que diga $('.'+somevar).show();e descubra que todo valor possível somevarpoderia ter e compará-lo a todos os estados possíveis do DOM - e esse é um caso excepcionalmente trivial ... Além disso, abundância de casos em que uma div não vai ser mostradas, devido aos dados, entrada, resultados API / chamadas AJAX, o comportamento do usuário, etc, mas logicamente poderia ...
user56reinstatemonica8
@ user568458 Acho que esse é o argumento de Eric Enge no último parágrafo da pergunta e de Dan Diplo na resposta aceita.
22412 Andy
3

Eu acho que você deveria tentar encontrar outras alternativas, mas aqui estão alguns artigos de referência

Inclui links para Maile e Vanessa em um bate-papo na rádio do Webmaster sobre este tópico http://luigimontanez.com/2010/stop-using-text-indent-css-trick/

Maile é engenheiro do Google http://maileohye.com/html-text-indent-not-messing-up-your-rankings/

É algo para o qual o Google vai encontrar uma solução, mas o deslocamento negativo e a exibição não são seguros se você adotar uma perspectiva de longo prazo.

AndyBeard
fonte
0

O Google rastreia o display:noneconteúdo CSS .

Ocultar algo do Google só é ruim se você estiver intencionalmente tentando manipular as classificações de pesquisa.

As opções ocultas e o texto dos visitantes agora são uma prática comum, considerando como os sites interativos se tornaram, portanto você não deve se preocupar. No passado, as pessoas usavam esse tipo de método para enganar o SEO, ocultar palavras-chave e links etc. O resultado é que, quando o Google rastreia um site que esconde coisas ocultas do visualizador, ele o vê como menos confiável.

Josip Ivic
fonte
0

Acabei de ter uma conferência com seo no google e isso não é verdade. Exibir nenhum penaliza, com certeza. Algum tempo antes disso, tratava-se de visibilidade ou usando tamanhos de texto negativos ou recuo negativo.

É um fato que o texto precisa estar visível e não obstruído de maneira visível. Pelo menos nenhuma placa da caldeira ou conteúdo duplicado ou preguiçoso.

A propósito, o Google pode fazer o que quiser em seu site e provavelmente se colocará em primeiro lugar, mesmo que fosse uma batata.

Em particular, a abordagem proposta e provavelmente a ser usada é mostrá-la e independentemente das consequências do projeto.

Vou propor coisas como indexação z (camadas) para verificar se, por acaso, esse tipo de estilo não é considerado. Mas não acho que o algoritmo seja suficientemente forte para considerar isso. Ou coisas como calcular a posição da caixa sobre o tamanho da tela para considerar o posicionamento negativo como um bloco visual.

O texto relacionado ao interesse do cliente seo ergo deve estar visível.

Budaya
fonte
11
Esta resposta está totalmente errada. Qualquer conferência que você frequentou é terrível. Não consigo imaginar que outro lixo eles te alimentaram. Eles provavelmente disseram que as meta tags também eram importantes.
John Conde
11
É verdade que, se você criar uma longa lista de palavras-chave, coloque-a em sua página e oculte-a com a exibição: nenhuma, o Google penalizará seu site. Também é verdade que o texto destinado a ser indexado precisa estar visível. Como outras respostas apontam, há usos legítimos para exibição: nenhum.
Stephen Ostermiller
Os meios técnicos usados ​​para ocultar o texto não importam para o Google. As especulações de que o índice z ou o posicionamento negativo possam ser usados ​​para enganar o Google são totalmente falsas. Googlebot renderiza páginas agora e pode detectar quaisquer meios utilizados para impedir que o texto de aparecer em pixels nas page.As outras respostas apontam, não
Stephen Ostermiller