Construir um site hoje em dia é muito mais do que criar uma simples página web. As necessidades são ilimitadas, fazendo-nos confiar em diferentes ferramentas que nos podem ajudar a validar os passos que damos e a qualidade do projeto. Quando há muitos projectos que necessitam da tua atenção e tempo, é necessário que estas ferramentas o ajudem a realizar um trabalho notável no menor tempo possível.

O principal objectivo deste artigo é não só nomear algumas características essenciais que precisas de conhecer ao criar um website, mas também partilhar algumas dessas ferramentas.

Características Essenciais

Acessibilidade

Esta característica é considerada a base de um bom projeto, mas por vezes é negligenciada.

A World Wide Web não é mais do que uma enorme base de dados que tem de ser acessível a todos, mesmo aos utilizadores que necessitam de tecnologia Assistiva para aceder a conteúdos digitais. Quando o fazemos corretamente, aumentamos a qualidade e relevância do projeto, e o alcance da plataforma.

Para avaliar a acessibilidade:

• Verificar markup (HTML, XHTML) of the web documents:

http://validator.w3.org

• Verificar ligações e âncoras em páginas web ou websites completos:

http://validator.w3.org/checklink

 

Design

Como diz o Michael Nunes: “A good design is one that works”.

Era uma vez, em que as pessoas usavam apenas os seus computadores para acederem à Internet. Agora parece que não podemos viver sem os nossos telemóveis e os nossos tablets. Por isso, é importante que todos os websites sejam reativos, capazes de se adaptarem a todas as resoluções de ecrã. Uma característica obrigatória para o que é considerado um bom design.

Para testar a capacidade de resposta do design da web:

• Online Media queries tester: http://beta.screenqueri.es/
• Para teste em dispositivos Android na app Chrome: https://goo.gl/2qfWhD
• Para teste em dispositivos iOS na app Safari: https://developer.apple.com/safari/tools/

Performance

Hoje em dia, a performance de um website é absolutamente essencial.

Não gostamos de esperar. Não queremos esperar. Não vamos esperar. É assim que os utilizadores percebem a sua experiência na World Wide Web hoje em dia. Portanto, os websites precisam de ser carregados mais rapidamente, caso contrário, as janelas vão ser fechadas.

E isso é importante não só para os utilizadores, mas também para os motores de busca, como aponta o Google.

Conselhos para melhorar o desempenho de um website:

Otimizar as imagens

• Remover metadata com uma aplicação como o codeKit, para reduzir o peso da imagem;
• Utilizar a imagem no tamanho certo para o efeito;
• Adaptar o tipo certo de imagem ao objetivo e otimizar sempre com base na qualidade vs. quantidade.

Reduzir o máximo de pedidos HTTP que puderes:

• Combinar o CSS e o ficheiro JS sempre que possível;
• Tornar obrigatória a utilização de imagens sprite.

Sempre que possível, escolher textos em vez de imagens para diminuir o número de pedidos HTTP.

Agrupar e minimizar Scripts e CSS para remover informação desnecessária. Ao torná-los mais leves, estarás a otimizá-los e a reduzir também o número de pedidos HTTP.

Utiliza um sistema de cache sempre que possível para reduzir consideravelmente a quantidade de pedidos feitos ao servidor, quando alguém está a aceder ao website.

Validar a resposta de qualidade do website em termos de desempenho:

• Recebe um relatório sobre a qualidade do conteúdo do teu website: https://developers.google.com/speed/pagespeed/
• Otimizar imagens para um melhor resultado: https://imageoptim.com/mac
• Agrupar e minimizar ficheiros JS/CSS e optimizar imagens: http://incident57.com/codekit/
• Task Runners: https://www.npmjs.com/package/gulp and http://gruntjs.com/

SEO

O SEO certo ajuda o website a obter mais visibilidade nos motores de busca, o que irá aumentar o número de acessos. É importante verificar o SEO e corrigir possíveis problemas antes do lançamento do website.

Com uma ferramenta como o VARVY é possível analisar todo o projeto e determinar a sua qualidade. A ferramenta dar-te-á um relatório com todas as falhas apontando a forma de as corrigir. Avalia aqui todos os pontos e fornece uma lista das melhores práticas para melhorar a qualidade de um site.

Existe uma extensão Chrome para ajudar a validar todos estes pontos mais rapidamente: https://chrome.google.com/webstore/detail/web-developer-checklist/iahamcpedabephpcgkeikbclmaljebjp.

O seguinte site é também útil para utilizar como checklist: http://webdevchecklist.com/

Para construir um grande website há tanto a que prestar atenção mas, uma vez organizada a tua lista de verificação, será mais fácil para ti obter os melhores resultados. Presta atenção a todos os detalhes para entregares um website que cumpra o briefing e exceda todas as expetativas.

Obrigada por leres

Nós realmente queremos ouvir a tua opinião! Entra em contato connosco 

A Monday é uma agência digital e interativa baseada em Lisboa. Somos uma equipa de designers, builders & thinkers que fazem experiências digitais. Conhece alguns dos nossos clientes: Snickers, Red Bull, Twix, Philips, M&M’s