Por razões que são quase demasiadamente numerosas para listar – marketing, vendas, psicologia, confiança, percepção profissional, etc – a forma como o seu site é vista pelos seus usuários deve estar primeiramente, todo em sua cabeça. Os seguintes 7 lembretes importantes irão lhe ajudar a ir na direção certa, mas você é o único que conhece seus clientes (ou deveria) para os melhores pontos de personalização.

1 – Foco do usuário

É importante nunca perder o foco. Você precisa pensar como o seu usuário. Seus clientes precisam sempre encontrar o que eles procuram, seja para pagar uma conta, encontrar um telefone ou o endereço da sua empresa com extrema facilidade. Faça sempre que possível que a vida de seu usuário seja facilitada. Quanto mais complicado e demorado for para encontrar a informação desejada, mais eles abandonarão seu website, e consequentemente não voltarão.

2 – Compreensão do usuário

Entenda a realidade de seu website. Ele é comercial? Então faça com que ele seja visto desta forma. Não há a necessidade de confundir a cabeça de seu usuário/cliente. Ajude-o a encontrar de forma fácil e rápida o que ele deseja. Uma boa idéia é disponibilizar ferramentas como sitemaps ou sistemas de busca.

3 – Velocidade de carregamento

Sim, seu site precisa carregar rápido, então velocidade é importante. Pra isso, basta reduzir o tamanho/qualidade das imagens, não exagerar no tamanho do flash, scripts, etc. Analise cuidadosamente as funcionalidades para que cada uma delas tenha seu valor.

4 – Layouts simples, às vezes, são a melhor opção

O Flash é uma ferramenta poderosíssima, quanto a isso não há discussão, principalmente quando é para demonstrar algo que é difícil colocar em palavras. Mas ele tem um problema tão forte quanto o seu poder, o peso de suas animações! As vezes suas animações se tornam tão pesadas que as pessoas perdem até a paciencia para carregá-las, mesmo sabendo que será repleto de efeitos, movimentos e etc.
Além disso, ele acaba sendo uma grande distração, o que pode tirar (e vai!) o foco do usuário. Dependendo da sua aplicação, a utilização de animações deste nível não são indicadas.

5 – Necessidade do usuário

Defina antes de desenvolver o layout todo o tipo de pessoa que você espera que visitará seu website e considere tudo o que eles desejam e procuram. Depois desta análise, tende desenvolver um layout que abranja o maior número de usuários (definidos no início do projeto) possíveis a encontrar os itens mais importantes em seu website.

6 – Compatibilidade entre navegadores

Que o site deve funcionar em todos os navegadores, isso já não é mais nenhuma novidade. Porém muitos se esquecem de testar as aplicações javscript. Algumas, infelizmente, não funcionam corretamente em todos os navegadores, então nunca se esqueça de testá-las exaustivamente.

7 – Sem surpresas

Use o óbvio, comum e padrão em elementos padrões de um website. Navegação não é algo que necessite ser muito criativo, pois ele precisa ser imediatamente compreendido e utilizável. Constância no mundo ‘www’ é, atualmente, uma coisa boa. Ela facilida a vida das pessoas pois ao acessar, o usuário se sente num “território familiar”.

Portanto, mais do que cair em profunda concepção metafórica ou querer mostrar todos os truqes possíveis, você deve concentrar-se em tornar o seu site uma solução para os seus clientes. Tornar a vida deles mais simples e fácil.

Adaptação do artigo: How to create an attractive user friendly

Então, como pode o copywriting influenciar a usabilidade? Para responder a isso, preciso primeiro ilustrar como pessoas geralmente percorrem um site. É caótico. Nós não nos focamos em nada em particular. Ao invés disso, nós “lemos” a página rapidamente, passando de um ponto a outro, tentando achar o que estamos procurando. Está é uma ilustração do caminho que alguém faz ao entrar em alguma página – as linhas e os pontos vermelhos mostram os vários movimentos do usuário e os vários focos de atenção, respectivamente.

Isso acontece muito rápido. Com pouco segundos nós “scaneamos” a página procurando por alguma coisa de nosso interesse. O maior problema que pode ocorrer no copywriting é o comprimento. É muito fácil escrever demais, especialmente quando conhecemos sobre o que estamos falando. É fácil pensar que colocando informações demais deixaremos as coisas mais claras para os nossos visitantes. Isso pode ser verdade, se ele ler tudo – mas ele não lerá!
Nosso visitantes estão “scaneando” loucamente a página procurando pedaços de informação, e a maioria deles não tem paciencia para ler parágrafos de texto – algumas vezes nem sentenças de texto. Temos que desenvolver curtos e consistentes pontos de foco para cada ponto de informação vital em nosso site. Estes pontos de foco devem fazer duas coisas: prender a atenção de seu visitante e chamar a atenção.

Veja um exemplo real:
Aqui está uma parte do site da MacPorts, uma ferramenta para Mac que ajuda a intalar vários programas ‘open source’.

É muito texo. Ninguém lerá isso tudo – e mesmo que leia, ele não ficará muito feliz com isso. Suponho que a maioria das pessoas chegam nesta página desejam fazer o download do MaxPorts, mas o link de instalação está no meio do texto. O que, cerca de 80% deste texto pode ser cortado sem que se perca nenhuma informação importante.

Aqui vai um rápido redesign:

Não está perfeito, mas eu penso que já é um grande avanço. Se eu tivesse mais tempo teria mudado um pouco mais o design e re-escrito o topo e os botões de seleção, mas as áreas mais importantes foram modificadas. Marcadores, titulos consistentes, fontes largas e chamando atenção, tudo ajuda tornar a página scaneável. As pessoas conseguem ver quais links estão disponíveis e a encontrá-los olhando rapidamente sem que seja necessário ler muito texto.

Copywriting deve ser sucinto e conciso. Usar fontes grandes para chamar atenção. Deixe claro a próxima ação com o mínimo de palavras possível e nunca entre em detalhes. O mais importante – corte qualquer palavra e sentença que não adiciona nenhum valor real. Seja curto e grosso!
Você provavelmente pensará que o copywriting está curto o suficiente, mas foi você quem escreveu – você conhece tudo o que está escrito e do que se trata. O visitante não e para encontrar ele terá que ler – eles estão aqui para fazer alguma coisa, então tire algum tempo e dê atenção para fazer coisas super fáceis de se scanear e encontrar.

Texto original: www.usabilitypost.com

Se você é um web developer ou designer e novato nos conceitos dos web standards e está indeciso de onde gastar o seu tempo para aprender tudo a respeito, aqui estão algumas das mais importantes razões para que isso seja feito.
Para os profissionais web que já trabalham com os web standards, esta lista será conveniente quando você precisar de bons argumentos sobre o assunto. Sinta-se a vontade para adicionar qualquer benefício que você pensa a respeito.

1 – Apresente-se com um aspecto profissional

Outros web developers e empregadores estarão atentos ao seu trabalho e saberão que você é um profissional que gosta de estar atento às mudanças tecnológicas e mantém seu conhecimento e habilidades sempre atualizadas. Isto lhe dará o aspecto de um verdadeiro profissional web.

2 – Apresente bem os seus clientes

Utilize os web standards em conjunto com as melhoras práticas de acessibilidade e dê aos seus clientes a chance de falar a respeito sobre o quanto eles se preocupam com todas as pessoas. E como eles acham importante que todo mundo possa utilizar os seus serviços e encontrar informações a respeito de seus produtos. Assim, evitaremos passar má impressões causadas pela desconsideração dos visitantes portadores de necessidades especiais, usuários de MAC e de dispositivos móveis.

3 – Maximize o número de clientes potenciais

Você não saberá qual dispositivo seus visitantes usarão para acessar o seu site. Você pode
pensar que sabe. Mas a não ser que você esteja desenvolvendo uma Intranet para uma companhia que tenha uma política sobre qual navegador deverá ser utilizado.
A única coisa que você razoavelmente terá certeza é que os clientes estarão utilizando alguma coisa que compreende HTML. Utilizando os web standards corretamente você terá certeza que você fez sua parte em desenvolver o seu site compatível com o maior número possível de dispositivos.

4 – Carregamento rápido e redução do consumo de banda

Uma marcação bem estruturada que separa a estrutura e o conteúdo da apresentação é geralmente muito mais compacto que um site com tabelas, spacer.gif e “tag soup”. Os documentos serão menores e mais rápido para baixar. Goste disto ou não, há várias pessoas ainda que utilizam conexão discada para acessar a internet.
Se o seu site tem um plano de hospedagem com tráfego de banda limitado, documentos menores reduzirão custos – mesmo que o tráfego aumente.

5 – Atenda os requisitos de acessibilidade

Utilizar os web standards não garante que todos os aspectos do seu site será acessível para as pessoas portadoras de necessidades especiais, mas isto é um bom começo. Tenha certeza que seus documentos estão validados, bem estruturados, semânticos e você estará no caminho certo para ter um site acessível.

6 – Melhore sua posição nos sites de busca

Conteúdo bem escrito, compreensível, bem estruturado e com uma marcação semântica é uma comida saborosa para os robots de sites de busca e você aumentará sua posição nos mesmos. Isso, com certeza, conduzirá para um acréscimo no tráfego, o que é o desejado por todo dono de site.

7 – Mantenha sua marcação fácil de manter

Ao atualizar o seu site, você prefere trabalhar arduamente sobre muitos kilobytes de intermináveis tabelas aninhadas e spacers.gif ou navegar sobre uma marcação simples, clara e bem estrutura?
Removendo, inserindo ou editando conteúdo sem apresentação é muito mais fácil e eficiente do que ter a certeza que toda a apresentação contida no documento estará correta. Utilizando as CSS para controlar o layout torna esse processo mais fácil para fazer alterações de layouts.

8 – Conteúdo resistente ao futuro

Não há ninguém que possa garantir com 100% de certeza que os documento criados e guardados digitalmente hoje serão legíveis daqui a cem anos. Ou quinze anos. Mas se você separar o conteúdo da apresentação e usar os web standards corretamente, você terá feito o melhor que pode para assegurar que seu conteúdo será legível mesmo ainda quando você se for.

9 – Boa razão para os negócios

Por que um dono de site diria não para mais visitantes? Para um site mais rápido? Otimizado para motores de busca? Com bom potencial publicitário? Isso não faz sentido.

10 – Isto é o jeito certo de fazer as coisas

O caminho dos web standards é a forma que deveríamos ter seguido quando começamos a desenvolver para a web. E agora que podemos, por que não fazer as coisas corretamente e ter uma excelente razão para sentimos bem com conosco mesmo?

Artigo original: Ten reasons to learn and use web standards
Tradução (pt-br): Leandro Vieira (artigo publicado)

Fonte: www.pinceladasdaweb.com.br

Design para a Internet

Autor: Felipe Memória
Baseado na premissa de que a dificuldade de utilização de um produto é primordialmente causada por erros de projeto, o livro aborda primeiramente conceitos básicos e fundamentais sobre assuntos que estão diretamente relacionados à navegabilidade e à usabilidade. O ponto forte do livro diz respeito a tudo que envolve a navegação na Web, não só com relação a padrões de elementos de interface como também de formatação de conteúdo.
Outro ponto forte são os estudos de casos. O autor apresentará cases da Globo.com, tais como ?Site Oficial da Rede Globo?, ?GloboEsporte.com?, ?Jornalismo da TV Globo?, e cases sobre o Yahoo!, a BBC e a AOL. Além desses, o autor também apresenta um estudo de caso detalhado e inédito sobre um recurso de navegação auxiliar muito utilizado na Web, chamado Breadcrumb Trail. Esse elemento representa o caminho percorrido pelos usuários até determinada página, provendo links que possibilitam voltar a outras anteriormente visitadas.

Não me faça pensar

Autor: Steve Krug
Nesta segunda edição, Steve acrescenta três novos capítulos no mesmo estilo do original: divertido e interessante, mas, ainda assim, cheio de informações e conselhos práticos, tanto para novatos quanto para veteranos. Não fique surpreso se ele mudar completamente a forma pela qual você pensa em projeto para Web.
Usabilidade como um favor comum: Por que as pessoas realmente saem de Web sites;  Acessibilidade, Cascading Style Sheets e você: Tornando os sites usáveis e acessíveis e Socorro! Meu chefe quer que eu ___: Sobrevivendo a caprichos de projetos de executivos.
Alguns livros abrirão sua mente. Não me Faça Pensar! vai mais longe: ele abrirá a mente (e a carteira) do seu chefe para investir em usabilidade na Web. Ele faz isso rápida e gentilmente, além de com humor.

Designer para quem não é designer

Autores: Robin Williams e John Tollett
O Livro mais Premiado da Área de Web Design, introduz ao design e a diagramação através dos 4 princípios básicos do design: proximidade, alinhamento, repetição e contraste.
Usando exemplos de “antes” e “depois”, estimula o leitor a fazer suas próprias experiências. Traz também o básico sobre: tipologia, serifa, estilo, peso, tamanho.
A leitura é agradável e didática. A autora sempre ilustra com bons exemplos e não perde tempo com palavreado bonito.
Excelente livro para quem nunca estudou a fundo a área do Design.

Edição e Design

Autor: Jan White
A edição atualizada é um guia fundamental para editores, diretores de arte e designers. Um compêndio de dicas práticas para um casamento feliz entre forma e conteúdo. Inclusive, aí reside a essência do livro. Com mais de cem ilustrações o Edição e Design aborda em mais de 20 capítulos assuntos como Tipografia, Simetria e Assimetria, Capas e páginas internas, Cores, Boxes e fios, Fotos, diagramas e legendas, Espaço com elemento positivo, Colunas, grades e margens, entre outros assuntos. A proposta de Jan White é mostrar como a colaboração entre editor e designer pode ter um grande impacto criativo pela união do uso de palavras, imagens e espaço. Com diversos problemas práticos com soluções diretas contempla as expectativas de designers, diretores editoriais e ?publishers? em busca de novidades que tornem seus produtos mais competitivos e atraentes.

GRID – Construção e descontrução

Autor: Timothy Samara
O grid tipográfico é um sistema de planejamento geométrico que divide a informação em partes e ajudam o observador a entender o significado entre os elementos informativos, sejam estes imagens ou palavras. Para alguns designers gráficos, é parte incontestável do processo de trabalho, oferecendo precisão, ordem e clareza. No entanto, a partir dos anos oitenta, viu-se um movimento dissidente, um esforço para demonstrar os limites desse método. Samara propõe então um novo olhar sobre o embate e, de maneira nada maniqueísta, retoma a discussão. Leitura fundamental para profissionais e estudantes na área de projeto, tanto no design como na arquitetura, este livro põe em foco o princípio unificador do grid e o valor de outros tipos de idéias, oferecendo análises atentas e consistentes sobre toda espécie de manifestações visuais. O volume foi organizado em duas partes, “Construindo” e “Desconstruindo” o grid. Em cada uma delas, um capítulo de extrema concisão histórica fundamenta os comentários com exemplos concretos. O autor comenta também formas de comunicação dispostas tanto no espaço tridimensional quanto no universo virtual das mídias eletrônicas.

Layout – O design da página impressa

Autor: Allen Hurlburt
Partindo das fontes do design moderno, o autor relata os estilos históricos de arte, arquitetura e design, expondo os melhores designs de página, desde o fim do século XIX até os nossos dias. O autor comenta os mais importantes movimentos artísticos e as influências que exerceram.
Este livro se destina ao artista profissional que busca novas perspectivas em seu trabalho, para o professor que procura um livro que sintetize os aspectos criativos do design gráfico e para o estudante que precisa de um compêndio orientador.
Obra fundamental com 160 valiosas ilustrações.

Gestal do Objeto: Sistema de leitura visual da forma

Autor: de João Gomes Filho
A capacidade da informação visual é muito mais ampla do que aquelas transmitidas e/ou assimiladas pelos outros sentidos. A comunicação, hoje, é feita e difundida pelos meios tecnológicos, meios estes que nos expõem – muitas vezes compulsoriamente – a múltiplos elementos visuais. Diante desta realidade, o aprendizado e a absorção de uma gramática da imagem tornam-se imprescindíveis à compreensão da forma de como se apresenta nossa cultura atual. ‘Gestalt do Objeto’ foi concebido e estruturado de maneira a proporcionar exemplificações dos princípios, conceitos e técnicas visuais. De acordo com a Gestalt, a arte funda-se no princípio da pregnância da forma. E, assim, no processo de criação de imagens, fatores como equilíbrio, clareza e harmonia visual são imprescindíveis para o ser humano. De modo prático e didático, é apresentado um sistema de leitura visual da forma do objeto, fazendo uso de fundamentos científicos da Psicologia da Percepção da Escola Gestalt.

Resumos retirados do Submarino