Escopo Projeto Tecnologia

Checklist – 17 itens que você precisa verificar antes do Go-live de um portal de sucesso

Quando se projeta um website ou um blog, seja ele para utilização própria, ou para um cliente, existem uma série de regras que devem ser cumpridas antes de o colocar no ar. Embora a criação de blogs seja um processo bastante simples, a verdade é que muitas vezes os desenvolvedores se esquecem dos pormenores que são essenciais a usabilidade desses projetos. Compilei estas dicas já tem alguns anos e acredito que elas podem auxiliar você nos seus projetos

Parece simples, mas não é só felicidade. Não basta pegar os arquivos, enviar pelo FTP e partir pro abraço. Existem uma série de itens que precisam ser verificados e algumas regrinhas que podem ajudar a reduzir a dor de cabeça da publicação de um novo site em ambiente de produção.

Este artigo tem em conta todos os passos essenciais a uma boa usabilidade do seu próximo blog, ou mesmo do seu blog atual, pelo que deverá tê-los sempre em consideração à medida que vai mexendo e evoluindo no seu projeto. Com estas 17 verificações validadas, seu projeto será um sucesso e logo você aparecerá para o estimado Google!

1 – Nunca faça o GO-LIVE do site numa sexta-feira

Pode até ser que em algum momento entre o briefing e a assinatura do contrato ninguém viu que o dia do prazo final era uma sexta-feira, mas isso é exceção. Ninguém em estado perfeito de sanidade (a menos que tenha prazer em trabalhar fins de semana) aceita o agendamento de entrega para o último dia útil de uma semana. Nunca faça isso!

2 – Não se esqueça nunca do favicon

O favicon representa o ícone que aparece na barra de navegação do seu browser é também o ícone que fica registado na barra de favoritos, sempre que um determinado site é guardado. É um detalhe super fácil de resolver e que sempre passa despercebido. Para fazer isso o seguinte código dentro da  tag <head>:

<link rel=”icon” type=”image/x-icon” href=/favicon.ico” />

E ainda, que tal um favicon quando abrirem o site pelo iPhone?

<link rel=”apple-touch-icon” href=/favicon.png” />

3 – Revise os títulos e os dados (SEO)

O título da sua página é uma das partes mais importantes do SEO do seu blog. Além de dizer aos motores de busca aquilo que se trata nessa mesma página, diz também aos seus leitores qual o conteúdo e qual a área que o seu blog trata. Considere sempre que o seu título altere de página para página, de acordo com as regras da otimização para motores de busca.

A meta descrição e as meta tags deixaram de ter o peso que tinham em termos de SEO e aos olhos dos motores de busca especialmente. Para quem utiliza o WordPress, o plugin All in One SEO faz isso automaticamente de uma forma eficiente.

4 – Lembre-se do CSS media=”print”

Caso não saiba, é possível colocar um estilo CSS somente para o momento que uma página estiver sendo impressa. É a declaração de media=”print”.

<link rel=”stylesheet” type=”text/css” href=”print.css” media=”print” />

Alguns divs não possuem nada de interessante e podem ocupar muito espaço numa folha de papel na hora de sair na impressora, então basta selecioná-los com a folha de estilos de impressão e escondê-los com display: none.  Ainda é possível reduzir a quantidade de cores, de colunas ou até fazer todo um novo estilo, só depende da sua criatividade.

5 – Verifique a variação do layout cross-browser

Geralmente desenvolvemos em um navegador “favorito” meu caso é o Chrome, mas, se você conhece os motores (engines) de renderização, sabe que não precisa testar em realmente todos os navegadores do mercado. Uma dica para ter o CSS bem parecido em todos os navegadores é começar com um CSS Reset, um código CSS que zera todas as propriedades padrões e já deixa, de início, todos os browsers renderizando as tags de forma idêntica.  Existem muitos programadores que desenvolvem templates e sites em Firefox, e quando pensam que o seu projeto estava perfeito, abrem-no no Internet Explorer e tudo está destruído. É primordial, testar o seu projeto em múltiplos browsers durante o projeto e antes do GO-LIVE.

Para testar eficientemente os seus projetos em cross-browser, deixo uma pequena lista de checagem:

Eu costumo desenvolver no Chrome e depois fazer testes no Firefox e nas últimas versões do Internet Explorer/Edge. Se o código estiver validado e estiver tudo Ok nesses, já dá para garantir uma apresentação semelhante em todos os outros browsers. De qualquer forma, ainda tenho aqui Safari e Opera instalados.

6 – Revise o seu conteúdo

Uma das coisas essênciais no pré-lançamento de um website ou blog é a prova de leitura. Antes de lançar o seu novo blog, considere ler todos os conteúdos, todos os botões, todos os pormenores escritos. Existe sempre alguma coisa que falha. Cuidado para não deixar XXXX, nonononos e Lorem Ipsuns entrarem em nenhuma parte do site. Faça também a revisão ortográfica, existem dezenas de ferramentas que te ajudam com isso. Procure também remover as quebras de linha existentes, diminuir os espaçamentos desnecessários nos seus textos, entre outras coisas.

Imagens de conteúdo também são importantes, lembre-se (caso use) de usar imagens de banco de imagens sem as marcas d’agua e verifique se todas estão aparecendo corretamente e em suas respectivas páginas.

Outra parte do conteúdo que não pode entrar no ar com errata é o rodapé ou seção de contato. Certifique-se de que todos os endereços e telefones estão atualizados. Algumas vezes o cliente muda de endereço ou telefone durante o desenvolvimento de um projeto longo.

7 – Links

Outra coisa muito importante e que geralmente muitos webmasters se esquecem de verificar, são os links presentes no blog. Nunca assuma que todos os seus links se encontram corretos. Considere também verificar se o logotipo do seu blog linka automaticamente para a homepage. Geralmente um visitante pode não procurar pelo botão “home” quando pretende voltar à primeira página. O seu primeiro impeto será sempre o de clicar no logotipo.

Pode ser que uma configuração errada de URL’s em links relativos possa ter feito algumas páginas ficarem perdidas. Portanto, verifique se todos os seus links estão funcionando corretamente. Caso o site tenha uma quantidade muito extensa de páginas, existem plugins para auxiliar este trabalho no Chrome eu uso o Link Checkr, já no  Firefox o Linkchecker. Experimente.

Tenha em conta também a visibilidade dos seus links. A cor que utiliza para links, a cor que utiliza para links já visitados. Para ajudá-lo nesta tarefa, utilize a ferramenta W3C Link Checker.

8 – Testes de funcionalidade

Depois de verificar todos os 7 passos anteriores, é hora de testar a funcionalidade do seu novo portal. Eu costumo chamar pessoas que não tem conhecimento de desenvolvimento para que naveguem no portal, de modo que ele explore (geralmente tudo aquilo que você se esqueceu). Faça uma análise de comportamento e veja quais os locais que ele visita, quais as dificuldades que ele encontra. Procure também testar a página de contato e todos os formulários presentes no seu blog.

9 – Testes sem JavaScript

Tenha em mente que o seu blog deverá funcionar corretamente com o Javascript desligado no navegador. Para surpresa de muitos programadores, quando se desliga o Javascript o projeto que até então era perfeito, virou algo não muito bom assim.

10 – Validações

Os testes da validação de código da W3C são atualmente um dos melhores cartões de visita para leitores e visitantes de um website ou blog. Não é o fim do mundo se o seu blog contiver alguns erros, mas é importante que você procure resolvê-los o quanto antes. Além de melhorar a usabilidade do seu blog, irá também torná-lo mais amigo dos motores de busca e dos crawlers que fazem a indexação dos seus conteúdos. A falta de pequenos atributos como o “title” ou o “alt” podem levar a pequenos erros que são solucionáveis em poucos minutos. Faça o seu teste no W3C Validator.

11 – Faça o link para o RSS Feed

Quando se tem um blog de conteúdos dinâmicos, é extremamente importante ter-se um RSS Feed que os seus leitores e visitantes possam se inscrever. A melhor forma de providenciar esse link de subscrição é oferecendo-o juntamente com o endereço do seu blog, na barra de navegação do seu browser. Para isso basta utilizar o seguinte código:

<link rel=”alternate” type=”application/rss+xml” title=”Site ou título do RSS” href=”link-do-feed” />

Considere sempre colocar também um botão de inscrição na sua homepage, bem vísivel de preferência. Recomenda-se que esse botão seja incluido no header ou na barra lateral do blog, para que esteja sempre presente enquanto o leitor navega pelo site.

12 – Estatísticas

Repare que agora não é só você e sua equipe acessando o site e que já tem muita gente passeando pela interface que foi criada. Aproveite a oportunidade para monitorar o comportamento dos usuários, fazer testes A/B na interface, aprimorar o SEO e manter o projeto em constante crescimento. Integrar um software de estatísticas no seu blog é extremamente importante para medir eficientemente o crescimento do seu blog, a forma como os seus visitantes se comportam, entre outras informações essenciais para análise do seu blog. Considere utilizar o Google Analytics .

13 – Sitemap

Criar um sitemap.xml para o seu website ou blog, é extremamente importante do ponto de vista da indexação de conteúdo. Se você utiliza um website não dinâmico, considere utilizar o XML-Sitemaps para criar um arquivo com o mapa do seu website. Depois, coloque-o na raíz do seu servidor para que os motores de busca possam fazer uma indexação mais eficiente do seu conteúdo.

Se você utiliza o WordPress, instale o plugin Google XML Sitemaps, que cria-lhe um sitemap dinâmico automaticamente. Esse sitemap passa a ser atualizado dinamicamente e sempre que você adiciona novo conteúdo ao seu blog. Depois disso, considere criar uma conta no Google Webmaster Tools, onde deverá adicionar o seu novo blog e indexar o seu sitemap, acelerando o processo de indexação do site.

14 – Design Defensivo (parece absurdo, mas não é)

Um dos maiores exemplos do design defensivo, é a criação e utilização de páginas de Erro 404. Estas páginas representam endereços que estão quebrados e/ou foram alterados, pelo que é importante apresentar informação de qualidade para não perder esse visitante. E lembre-se nada de propaganda nessas páginas, você pode incluir artigos mais lidos e manter o visitante no site.

15 – Otimização de código (isso é uma constante)

Existem várias formas de otimizar ao máximo o seu blog, recorrendo à redução de pedidos HTTP, colocando atributos nas suas imagens, reduzindo o peso dessas mesmas imagens, otimizando o seu código CSS, e tornando tudo o mais simples e mais eficiente possível. Faça o teste com o WebAnalizer, e verifique o que você com certeza precisa melhorar no seu blog, é uma verificação constante em todo seu projeto.

16 – Faça e tenha sempre BACKUP

Se o seu website ou blog faz uso de uma base de dados, é primordial ter em conta a proteção da sua informação. Se por ventura utiliza o WordPress, considere instalar o plugin WordPress Database Backup, (ou outro que achar melhor) que faz backup de forma automática e até envia os backups por e-mail.

17 – Já acabou, Jéssica? Não, nunca acabamos!

O que mais eu esqueci nesse checklist? Comente e colabore com este checklist que eu adiciono aqui para que outros profissionais consultem também. Como disse este foi um compilado que juntei por algum tempo e gostaria de compartilhar com vocês, dê sua dica também!

Coimbra, PMP on FacebookCoimbra, PMP on LinkedinCoimbra, PMP on TwitterCoimbra, PMP on Youtube
Coimbra, PMP

CEO do portal, apaixonado por gestão de projetos, metodologias, minha família, professor, consultor, certificado PMP, Six Sigma White Belt.


Comentários

Deixe uma resposta