Índice de Figuras
C. Experiência O pai chega em casa e a câmara grava lindas fotografias dos seus filhos, exatamente como anunciado Um final feliz.
4. Lidar com o ciclo de vida do produto: Em comércio eletrónico existem muitas vezes, casos em que os produtos têm um ciclo de vida curto Um exemplo clássico
6.5 Piloto micro-site Colchões
6.5.4 Soluções Propostas no Projeto para os Problemas
Da análise conjunta com a equipa de sistemas da entidade, resultou uma avaliação das prioridades para a implementação das medidas de otimização deste piloto. Dos critérios observados, para os fatores on-page, atribui-se maior relevância às medidas com impactos na usabilidade e acessibilidade do website.
Seguidamente, apresentam-se as propostas para a correção dos problemas de conteúdos e design da plataforma:
Optar por um domínio preferencial e redirecionar as solicitações do domínio não preferencial. O redireccionamento de solicitações de um domínio não preferencial é importante, por exemplo, para que os motores de pesquisa e utilizadores considerem os URLs com e sem "www" como o mesmo website (Google Inc., 2013);
o Usar o redireccionamento 301 para desviar (permanentemente) todo o tráfego do URL não preferencial; (configuração através das regras de redirects 301 no ficheiro .Htacess);
o Para a diminuição do conteúdo duplicado, recorrer à tag rel=”canonical”, esta tag permite indicar aos motores de pesquisa a versão da página preferencial de um conjunto de páginas com conteúdo extremamente semelhante.
Implementação de uma solução para melhorar a usabilidade na navegação do menu principal. Desta forma, também possibilitará tornar a plataforma mais amigável para os motores de pesquisa.
o Permitindo a navegação no histórico com os botões do navegador (Avançar) e (Retroceder) em páginas do menu principal;
o Apresentando títulos únicos e descritivos para todas as páginas no menu principal do website;
o Apresentando sumários únicos e descritivos para todas as páginas no menu principal do website.
Corrigir alguns dos principais erros de acessibilidade do website dos níveis (A) e (AA);
Estudar e selecionar as palavras-chave, tendo em vista o aumento do número de consultas (termos na pesquisa web do Google) que retornaram páginas do website;
Capítulo 6
o Existem diferentes tipos de marcação de dados, sendo os mais conhecidos os: Microformatos, RDFa e Microdados. Estes últimos, são os recomendados pelo Google, e portanto, o tipo de marcação escolhido para o website do piloto Colchões.
Sugerir a indexação das novas páginas por intermédio de um Sitemap.XML;
Expõem-se de seguida as propostas de melhoria para beneficiar os aspetos técnicos do
website:
Desenvolvimento e implementação do ficheiro Sitemap.xml;
Desenvolvimento e implementação do ficheiro robots.txt;
Melhorar desempenho do servidor:
o Ativação da compressão gZip no servidor.
Apresentam-se ainda as propostas para a abordagem aos fatores off-page, como sugestões de melhoria dos aspetos de linking em websites externos:
Estratégias de construção de ligações externas (Link Building):
o Proposta de requisitos para ligações externas aos fornecedores (backlinks); o Criação ligações externas com alto valor de referência.
6.5.5 Apresentação da Solução
1. Estudar as palavras-chave e colocar as palavras selecionadas em locais estratégicos no
website. Explorar o conceito da cauda longa, isto é, a utilização de termos de pesquisa
com potencial para aumentar as taxas de conversão.
a. Para tal seleção, contar-se-á principalmente com as palavras recolhidas das campanhas Adwords, aquelas com melhor prestação, isto é, com o valor do CTR (click-through rate) mais alto, e ainda outras palavras do mesmo campo semântico com melhor relação entre volume de pesquisas e concorrência. b. Disponibilizar as palavras-chave selecionadas em elementos da estrutura e dos
conteúdos do website. Alterações nas meta tags, elementos do código fonte das páginas para inserção de palavras-chave segundo as boas práticas.
i. Produção de títulos únicos e otimizados para as principais páginas do
website:
Title tags;
ii. Produção de sumários únicos e otimizados para as principais páginas do website:
Meta description tags;
iii. Adicionar cabeçalhos Header tags à página principal e páginas de categoria;
iv. Adicionar os textos alternativos nas tags <img> dos banners, deslizante (slider) e imagens de produtos;
v. Introduzir os atributos title nas tags <a> dos banners estruturais e deslizante (slider) da página inicial;
2. Melhoria de erros HTML:
a. Corrigir a Meta Language, pois este erro tem impacto em termos demográficos;
3. Desenvolvimento e implementação de links de contexto nas ligações internas, tendo em vista o aumento de cliques para páginas de categoria.
4. Implementação de microdados HTML - marcação de dados estruturados para Rich
Snippets do tipo Breadcrumb e Produts;
5. Implementação de regras no ficheiro .Htaccess para redirecionar as solicitações sem “www” para URLs com “www”;
6. Adicionar os textos alternativos nas tags <img> dos banners estruturais atendendo às boas práticas;
7. Desenvolvimento dos requisitos para os botões de redireccionamento fornecedores (InboundLinks);
8. Produção de um Sitemap.xml, e um novo ficheiro robots.txt para indicar o caminho do
Sitemap.xml aos restantes motores de pesquisa.
6.5.6 Experimentação da Solução
1. Recolha e análise de palavras-chave:
Tal como no piloto Catálogo Casa, utilizou-se na seleção de palavras-chave mais relevantes, a listagem de palavras-chave já utilizadas nas campanhas Adwords. Embora neste caso, tenha sido explorada uma outra abordagem, ou seja, além da opção por termos com maior número de impressões e melhor CTR. Foram selecionados ainda, determinadas palavras com um maior número de vocábulos, isto é, termos menos genéricos de modo a explorar o efeito cauda longa, onde está normalmente o maior potencial de conversão (Anderson, 2007).
Na abordagem para a otimização dos fatores on-page, tiveram a prioridade os principais elementos com efeito nas SERPs dos motores de pesquisa. Esses elementos, foram primeiro adicionados ao HTML naquelas páginas onde eles não existiam e posteriormente otimizados para as principais páginas do website.
Capítulo 6
Figura 36 - SERPs do website Colchões no Google antes da otimização.
Na página inicial (HomePage), procedeu-se à otimização da tag meta description, (trata- se de um resumo de uma página frequentemente utilizado pelo Google no Snippet das páginas de resultados da pesquisa em função do termo utilizado para uma determinada consulta).
Figura 37 - Boas práticas de otimização da página principal do website Colchões.
No ponto A, ação implementada foi a inclusão do nome da marca “Continente”, para todas as páginas, permitindo desta forma uma maior associação dos artigos ao Continente nestes meios. Relativamente ao Ponto B, aqui a principal otimização foi a definição do domínio de preferência, ou seja do URL com o prefixo “www”. Quanto ao ponto C, neste caso, desenvolveu-se uma descrição que ajude o consumidor a perceber resumidamente todo o conteúdo do website, até porque, através da primeira página é possível aceder a todos os assuntos descritos.
Neste caso, além de se resumir os conteúdos sem se perder o poder descritivo, foi também explorado o efeito cauda longa, fornecendo resposta a pelo menos duas questões: “lojas de colchões online?” e “onde comprar colchão barato?”
2. Tendo em vista as boas práticas de SEO para os fatores com impacto nas SERPs, ou seja, para que as title tags e meta description tags fossem maioritáriamente únicas desenvolveu-se em documentos PHP do website, um conjunto de sripts para introduzir automáticamente os conteúdos nesses elementos HTML.
Figura 38 - Ficheiro responsável por gerar os dados das páginas de produto do website Colchões.
a. Na linha 28, foi colocado no conteúdo da tag title <title><?php echo $titulo; ?> - Colchões Online</title>, uma parte dinâmica que coloca no título da página uma descrição curta do artigo: <?php echo $titulo; ?> sendo essa descrição única em cada artigo. Um campo na base de dados que corresponde ao nome do artigo, e que é única para os diferentes artigos do catálogo. Este título é concatenado ainda com uma parte estática, “- Colchões Online”, uma forma de incluir o título do micro-site nos titles tags do website.
b. Na tag meta description ilustrada na linha 29 <meta name="description" content="<?php echo strip_tags($descricao); ?>" />, inclui-se dinâmicamente uma descrição do artigo. Através do pedaço de código seguinte: <?php echo strip_tags($descricao); ?>, que coloca no conteúdo desta tag, caso exista na base de dados do sistema, uma descrição do artigo. Naqueles artigos em que não há na base de dados qualquer conteúdo, existe um script reponsável por incluir uma descrição predefinida.
As páginas de categoria, geradas pelo novo documento “catalogo.php”, desenvolvido para produzir as páginas solicitadas do menu principal, criou-se um script que permite atribuir aos itens do menu principal as meta tags correspondentes para cada página resultante.
Figura 39 - Ficheiro responsável por gerar os conteúdos para as páginas do menu principal catalogo.php.
Apesar deste método utilizado não ser o mais eficiente, trata-se de uma solução de recurso, uma vez que não existiam informações sobre estas páginas mapeadas na base de dados. Desta forma, possibilita incluir-se as meta tags nos elementos HTML das respetivas páginas, por intermédio de arrays que armazenam as informações para as diferentes tags.
Capítulo 6
c. Na linha 93, foi colocado no conteúdo da tag title <title><?php echo $mtitle [$subcategoria]; ?> - Continente Online</title>, uma parte dinâmica que coloca na página através da seguinte sintaxe: <? php echo $mtitle [$subcategoria];?>. Este título é concatenado ainda com uma parte estática, “- Continente Online”, de forma a incluir a marca Continente nos títulos destas páginas das categorias e subcategorias.
d. Na tag meta description ilustrada na linha 94 <meta name="description" content="<?php echo $mdescr[$subcategoria]; ?>" />, inclui-se no conteúdo da
tag meta description a informação correspondente no array para cada página
do menu principal. 3. Hiperligações (Links) contextuais:
Numa hiperligação há que definir o destino e o texto âncora, que é apresentado ao utilizador. Neste caso, em que o endereço é para uma página interna, pode utilizar-se o formato relativo para esse caminho. O exemplo seguinte apresenta uma das hiperligações utilizadas no website: <a href="catalogo.php?c=colchao&s=colchao" class="myContent> colchões</a>. A marca <a…> (âncora) tem o parâmetro href…, com a referência da hiperligação, e fecha com a marca </a> entre as marcas encontra-se o texto visível na página, também conhecido por texto âncora.
Figura 40 - Exemplo de um link contextual no Google Analytics.
Com o texto âncora apropriado, tanto os utilizadores como motores de pesquisa conseguem perceber mais facilmente os conteúdos de uma ligação. Desta forma também se potencia a interatividade entre diferentes páginas do website possibilitando aumentar o número de visualizações de páginas.
4. O Google pode criar rich snippets: informações detalhadas, para ajudar os utilizadores nas consultas específicas. Por exemplo, o snippet de um e-retalhista pode mostrar por exemplo a classificação da avaliação de um produto, o preço e a disponibilidade desse mesmo artigo. Os rich snippets ajudam os utilizadores a identificar se o website é relevante para a pesquisa. Nestas circunstâncias, podem resultar em mais cliques nas páginas em que foram implementados os dados estruturados.
No website Colchões, implementou-se a marcação de dados estruturados do tipo Microdados, um padrão de marcação de páginas HTML. Os conjuntos de esquemas utilizados no website foram de dois tipos: (Breadcrumbs) e (Products), a título exemplificativo, é aqui apresentado apenas o primeiro tipo de dados estruturados através de microdados:
Figura 41 - Exemplo do esquema Breadcrumb visto a partir da ferramenta de marcação de dados.
Quando uma página tem várias trilhas de breadcrumb, tal como o exemplo que foi experimentado, então este deve indicar o rasto de breadcrumb para cada trilha pertencente. Para fazer isso, utiliza-se a propriedade filho, de modo a especificar na hierarquia o próximo item, tal como o exemplo a seguir:
Onde está: Homepage Continente / Colchões Online / Colchões Molas
<DIV itemscope itemtype="http://data-vocabulary.org/Breadcrumb" id="breadcrumb">Onde está: <a href="http://www.continente.pt/" rel="Continente Online" itemprop="url">"><span itemprop="title">Homepage Continente</span></a> / <a href="http://www.colchoes.continente.pt/" rel="Colchões Online" itemprop="url"><span itemprop="title">Colchões Online</span></a> / <span itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <a itemprop="url" href="http://www.colchoes.continente.pt/catalogo.php?c=colchao&s=molas"><span
itemprop="title">Colchões Molas</a></span></DIV>
A seguir apresenta-se em detalhe o funcionamento deste exemplo:
Na primeira linha de cada <div>, <itemscope itemtype="http://data- vocabulary.org/Breadcrumb"> indica que o HTML contido nesse elemento descreve uma trilha. O itemscope indica que o conteúdo da <div> descreve um item, e itemtype = http://data-vocabulary.org/Breadcrumb indica que o item é
Capítulo 6
propriedades (tais como <div> ou <span>) é atribuído um atributo itemprop indicando uma propriedade. Por exemplo, <span itemprop="url">.
Cada item da trilha deve aparecer por ordem, com o primeiro item que representa a página de nível superior, e o item final representando o pai da página atual.
Figura 42 - Ferramenta de testes de dados estruturados do Google Webmasters.
5. A opção por um domínio de preferência pode ser implementada através do ficheiro .htaccess do servidor Apache. O .htaccess ou (ficheiro de configuração distribuída) oferece por exemplo um meio de manipular os URLs das páginas.
Este ficheiro, permite por exemplo a criação de regras que viabilizam o redireccionamento de páginas solicitadas sempre que sejam digitadas sem o “www”, para a versão com “www”. Isto pode ser implementado em servidores Apache, com módulo mod_rewrite instalado através da seguinte sintaxe:
<IfModule mod_rewrite.c> RewriteEngine on
# Rewrite non www to www.
rewritecond %{http_host} ^colchoes.continente.pt [NC]
rewriterule ^(.*)$ http://www.colchoes.continente.pt/$1 [r=301,NC] </IfModule>
6. Tendo em vista a substituição do método de chamadas Ajax para apresentação do conteúdo através da navegação no menu principal, recorreu-se à arquitetura convencional do funcionamento de páginas dinâmicas.
A arquitetura de páginas dinâmicas tem o seguinte funcionamento:
a. Os clientes pedem uma determinada página a um servidor de web; b. O servidor web verifica se possui a página;
c. Se a página tiver um script PHP, o motor PHP do servidor web processa esse script;
d. Se o script possuir algum código, este é processado;
e. O resultado do script, formatado em HTML é devolvido ao cliente.
Figura 43 - Esquema da arquitetura de funcionamento de páginas dinâmicas com PHP.
Este modelo de interação clássico entre cliente e servidor utiliza o protocolo HTTP baseado num sistema de hipertexto. Ou seja, quando é clicado um link para requisitar um documento, há uma solicitação HTTP… o servidor responde, processando essa requisição e devolvendo-lhe o documento (Pereira & Poupa, 2011). Deste modo, a navegação no menu principal permite aos motores de pesquisa uma maior capacidade de rastrear o website corretamente.
Com a alteração no modo de disponibilização do conteúdo no menu principal, surgiu um facto imponderável: As novas páginas geradas em cada item do menu apresenta também ligações diferentes para essas páginas. O que acontece é uma duplicação de conteúdos, pois os
banners laterais (à direita) do template, repetem-se em outras páginas diferentes do website,
tal como o conteúdo ao qual eles ligavam anteriormente por chamadas Ajax.
Assim o conteúdo da “ajuda”, “consultor de descanso” e também “dicas para dormir” estavam presentes em todo o website, isto é, nas páginas em que o mesmo conteúdo repetido era igual a uma parte considerável da página inicial. Ou seja, deste modo as páginas do catálogo (categorias e subcategorias) e restantes páginas de produto apresentavam o mesmo conteúdo, duplicado. O que, provocava uma diluição da relevância dessas mesmas palavras- chave, por outras páginas de conteúdo muito semelhante.
Tornando-se necessária a correção do código HTML, de forma a evitar essa duplicação nos conteúdos das páginas semelhantes do website.
Capítulo 6
Formularam-se assim duas opções:
Criar novas páginas com apenas o conteúdo respetivo e também com as necessárias alterações nas novas ligações dos banners a essas mesmas páginas, eliminando o respetivo conteúdo da página principal;
Manter o conteúdo na página de entrada, mas eliminando a redundância. Isto é, criando novas páginas com o mesmo conteúdo, embora não permitindo a indexação das mesmas pelos motores de pesquisa.
A estratégia escolhida, teve em consideração, o facto desse conteúdo estar presente no documento index.php. Ou seja, a página inicial (Homepage), continha a maior porção do conteúdo. Portanto, se esta página de entrada era aquela que mais tráfego gerava para o
website, retirar-lhe esse conteúdo para outras páginas poderia ser prejudicial, pelo que, se
decidiu pela segunda opção.
Portanto, foram assim criadas novas páginas “clones” da página principal, e para que estas não fossem consideradas como conteúdo redundante, foi-lhes adicionado, uma meta tag: <meta name="robots" content="noindex, nofollow" /> assim é possível alertar os robôs dos motores de pesquisa para não seguirem, nem indexarem tais páginas.
7. Sugestão de novas páginas do website aos motores de pesquisa, por intermédio de um
Sitemap.xml:
Para o desenvolvimento do Sitemap.xml recorreu-se à ferramenta XENU, esta permite despistar as ligações quebradas no website, para de seguida gerar o Sitemap.xml.
Após a obtenção e validação do Sitemap, foi necessário ainda submeter esse ficheiro XML na diretoria raiz do servidor. Só após essa disponibilização é possível informar os motores de pesquisa sobre a localização desse ficheiro, deste modo havia a necessidade de colocar o URL relativo nas ferramentas do Google e do Bing Webmasters.
Outra técnica recomendada é inserir o URL absoluto no ficheiro robots.txt de forma a indicar o todos os “robôs” que rastreiam o website, sobre a existência e localização do arquivo
Sitemap.xml. Essa menção tem de ser executada iniciando numa nova linha com a palavra
“Sitemap:”, com a primeira letra da palavra em maiúscula semelhante ao seguinte exemplo: Sitemap: http://www.colchoes.continente.pt/sitemap.xml
Fatores Off-Page:
1. Relativamente à otimização dos fatores off-page, foram levadas a cabo duas iniciativas de Link Building:
Foram criadas duas ligações de teste a diretórios relevantes para o website:
Diretório Dmoz;
Lojas Online.
Tal como foi referido no piloto Catálogo Casa, a primeira ligação externa foi, para o diretório Dmoz, por esta ser considerada como obrigatória na estratégia de Link Buinding de um website. Seguindo as boas práticas, esta ligação pode representar uma ajuda para os motores de pesquisa perceberem melhor os conteúdos dos websites.
Foi ainda sugerida, a aquisição de ligações externas a partir de fornecedores, de modo a procurar-se obter ligações externas (Backlinks), de qualidade, pois a autoridade desses domínios é incontestavelmente boa. Tais origens de ligações a apontar para as páginas de produto do portal Continente, não só estimulam o tráfego de referência, originando mais visitas, como são excelentes referências para atrair atenção dos robôs dos motores de pesquisa.
Existem nas relações comerciais entre fornecedores e retalhistas, determinadas condições e contrapartidas. Alguns fornecedores disponibilizam nos seus websites ligações dos seus artigos para retalhistas que comercializam tais artigos. São conhecidos por botões de compra “Buy Now”. Este tipo de ligações externas, têm mais relevância quanto maior for a relação entre as palavras-chave dos conteúdos dessas páginas e as palavras-chave dos conteúdos das páginas de destino (Ascensão, 2011).
Nesse sentido, desenvolveu-se um conjunto de requisitos para tirar maior partido dessas ligações externas. Os requisitos visam otimizar alguns elementos dessas ligações, tendo em vista um melhor aproveitamento desses botões. O texto alternativo e o atributo title aumentam a acessibilidade da ligação, sendo também importante para SEO, uma vez que estes atributos em botões imagem são utilizados como texto âncora.
O anexo AA, apresenta assim um conjunto de sugestões para otimizar essas ligações externas, neste caso, trata-se de requisitos para os botões de ação (Buy Now) - “Comprar Agora” a partir dos websites de fornecedores.