Educação, Tecnologias Digitais e Inovação

Design

Usabilidade em sites

 

Imagem: Pixabay

O termo usabilidade é usado com referência a características de “deslocamento”/navegação de visitantes em sites e localização de funções, áreas e conteúdos do site. A visita em um site não deve exigir um manual.

Um site deve oferecer experiências de navegação fáceis, rápidas e objetivas. Em termos simples, o usuário não deve “quebrar a cabeça” para entender o site e chegar ao seu destino, localizando o conteúdo desejado ou a função a ser empregada. Hoje esta questão apresenta uma grande melhoria e a movimentação dentro do site é bastante simples. No entanto, nem sempre foi assim.

No início da década passada, era mais fácil se depara em um site em que se gastava muito tempo para encontrar a informação desejada, dando a impressão de que a navegação acontecia em círculos e acabávamos voltando para o mesmo lugar. Isto não era prestígio apenas de sites “amadores”.  Alguns sites de grandes empresas também apresentavam este problema.

Problemas de usabilidade também podem fazer parecer que algumas informações estão escondidas, seja por descuido ou por intenção.

As ferramentas de buscam ajudam a encontrar informações, mas o usuário deve conseguir entender a lógica de navegação do site sem esforço.

O tempo de permanência no site deve ser motivado por seus conteúdos e não consequência de uma navegação confusa ou redundante. Afinal, uma expressão comum em design precisa estar em mente: o conteúdo é rei!

Uma regra básica apontada por muitos designers e desenvolvedores é a chamada “regra” de 3 cliques. O visitante deve chegar ao conteúdo desejado em, no máximo, 3 cliques. Caso contrário, ele poderá:

a) ter dificuldades de encontrar o que deseja;

b) interromper a visita;

b) ficar desmotivado de voltar ao site.

Se por um lado há descuidados, há outros que investem e pesquisam bastante a usabilidade do site.

 

Webdesigner e Webmaster: um pouco de memória

Imagem: Pixabay

Houve um tempo em que era comum encontrar as palavras webdesigner e webmaster em algum lugar do site, mais comumente no rodapé. Em muitos casos, apenas o webmaster era mencionado. Hoje o mais comum é encontrar referências ao webdesigner. E o webmaster, onde foi parar?

É fácil perceber que o webdesigner era o designer de páginas da internet. Logo, ele era o desenhista da página, responsável pela sua aparência. O webdesigner basicamente usava html, css, javascript e animações em Flash para desenhar os sites.

E o webmaster? Primeiramente, é bom dizer que muitas vezes a palavra era usada de forma genérica, significando também webdesigner. No entanto, muitas vezes, especialmente quando as duas palavras apareciam, o webmaster era a pessoa responsável pela programação do site (em php, asp, asp.net, jsp, por exemplo), pela sua atualização e pela manutenção funcional do site. Quando uma única pessoa “fazia tudo” o comum era que esta pessoa fosse chamada de webmaster.

Se o webdesigner era o designer/desenhista da web, o webmaster era o mestre da web, muitas vezes um faz-tudo. Outro termo que passou a ser empregado, de forma mais sofisticada, era o web developer. Este era o desenvolvedor do site, capaz de programar funções avançadas no site, criar e administrar bancos de dados e desenvolver aplicações complexas para a internet.

CSS – Cascading Style Sheet – Folhas de estilo em cascata

Imagem: Pixabay

Você já se perguntou como muitos sites mudam de aparência de uma hora para a outra? A curiosidade fica maior quando o site é grande, com centenas ou milhares de páginas. Um dos “segredos” que possibilitam essa mágica são poucos arquivos CSS. CSS é a sigla para Cascading Style Sheet, em português folhas de estilo em cascata. O nome folha de estilo ajuda a prever que elas afetam o estilo de páginas na internet, ou seja, a sua aparência.

A “grande mágica” do CSS é o efeito em cascata. Ou seja, ao atualizar um arquivo, você pode ter mudanças de design afetando todos os sites.

O arquivo CSS é um arquivo de texto, salvo com a extensão CSS, que cuida de grande parte aparência do site. Entre outras coisas, o arquivo pode ter informações sobre fontes, cores, bordas, divisórias…

Imagine por exemplo um site estático com 200 páginas. Imagine que o texto apareça em cor vermelha e com a fonte Arial. Com um ajuste mínimo no arquivo CSS original, você pode trocar a fonte para Verdana azul. Ao fazer o upload de um único arquivo para o servidor, layout.css (por exemplo), você altera, ao mesmo tempo, a aparência das páginas. Isto significa que não é necessário fazer alterações separadas em nas 200 páginas e realizar novo upload de todas elas. Um pequeno arquivo pode afetar todos os sites. Entre outras coisas, isto significa economia de tempo e de franquia de banda de uso da internet.

Hoje a maioria dos sites, especialmente os grandes e os dinâmicos, empregam CSS para facilitar o design.

Antigamente, muitos sites estáticos eram feitos puramente em HTML. Dependendo do programa usado, todos os arquivos precisavam ser refeitos ou modificados e, depois carregados para o servidor de hospedagem. Alguns softwares, como o famoso e poderoso Dreamweaver, possuíam a função de modelos. Com esta função, alterações feitas no modelo eram transferidas para todas as páginas construídas a partir daquele modelo. Seria a mesma coisa do CSS ?

Não ! A alteração até podia ser feita em todas as páginas, mas as páginas precisavam ser atualizadas (por upload) no servidor. Logo, os arquivos anteriores precisavam ser alterados pelos novos. Sem dúvida, era um recurso muito útil, mas não era a mesma coisa.

O CSS ficou conhecido muitas vezes como tableless design (design sem tabela). Em outro post, tratarei dos designs baseados em tabela e os tableless.

 

(Aviso: O conteúdo desta página pode ser editado, modificado, atualizado e revisto periodicamente. Volte com frequência.)