Guia para o Web Design 2.0

Uma análise extensiva ao design de websites com o look 2.0, com muitas imagens!

"Por que é que usar tabelas é éstúpido"

É o título de uma apresentação em formato de slides que explica da forma mais simples a 'qualquer' pessoa por que é que não se devem usar tabelas para criar sites, e como se deve fazer a transição gradual para CSS.
Hilariante!

HTML Bonito

Chris Coyier mostra como uma página em html devia ser, na sua opinião, para ser verdadeiramente bela.

Menus CSS prontos a usar

Para quem não sabe ou não tem tempo para criar um menu em CSS de raiz, ou até para analisar e aprender, o site CSS Menu Generator disponibiliza o código para vários tipos de menus, tanto horizontais como verticais, que podemos personalizar com os links pretendidos. No final, podemos fazer o download do código e das imagens necessárias para o menu funcionar. Muito prático!

CSS Sprites: Como tornar um site mais rápido

Para além da já disseminada técnica de, numa mesma imagem, se incluir todos os estados de um botão, existe outra onde, numa mesma imagem, se inclui várias imagens (ou mesmo todas!) de uma página completa.
A isto chama-se sprites, e Chris Coyier explica em detalhe como funciona.

Os 5 Erros do CSS

Nunca ficaram a pensar como é um pouco estúpida a forma como o CSS (conforme os standards) interpreta a largura de um elemento e a ele acrescenta o padding e a margem (ao contrário do que faz o Internet Explorer, que, ao que parece, neste ponto até é o mais racional)? Isaac Shlueter lista 5 das falhas que considera mais graves ou mais irritantes do CSS - e fala do próprio CSS e não das falhas que os webdevelopers/designers podem cometer ao criar o código.

O Processo do Web Design

O designer Ben Hunt explica o seu processo de criação de websites, e mostra como só na fase final é que utiliza o computador.

Concurso: Webdesign

Um concurso destinado a webdesigners, cujo objectivo é criar o CSS para estilizar um novo site. O prémio para o vencedor são 20% das receitas futuras que esse site fizer e, apesar de ainda não estarem abertas as participações, já se pode registar no site do concurso.

Inspiração: Navegação original

Apesar de diferente, a navegação do site Letters & Numbers acaba por ser bastante simples e deveras intuitiva. Os trabalhos também são bons.

Formulários de Registo

Ryan Singer, da 'explosiva' 37signals, explica, num vídeo de 10 minutos, como se pode melhorar a experiência do utilizador ao utilizar formulários de registo na web.

Via Vitamin

O Preço do Design

Dois artigos interessantes sobre o valor do trabalho de design, tanto ao nível de identidade como webdesign.

1. What everyone ought to know about webdesign pricing, explica o trabalho que se tem ao desenvolver um layout e como estamos a cometer uma 'ilegalidade', pelo menos moral, se efectivamente cobrarmos pouco (tendo em conta que o salário mínimo nacional anda à volta dos 2,5 euros à hora, acaba por ser um pouco difícil - infelizmente).

2. 6 Reasons why a logo should cost more than your lunch, é um resumo por pontos sobre a importância de um logotipo.

Click Here!

Pelos vistos, a ideia recente de que o termo "click here" não é correcto e não se deve utilizar num site "acessível" cai por terra com o último estudo da empresa Marketing Sherpa.

«Adobe ranks #1 for the term "click here".»

... e de seguida vem a Apple e a 'recentemente-comprada-pela-Google', DoubleClick.

O pior site do ano...

é o esperado MySpace. Pelo menos é a opinião da PC World, que votou o hiper-popular site como o pior do ano de 2006, numa lista de 25. Contam com o meu voto!

CSS: Estruturas com elementos fixos

Dificuldade em criar um layout em CSS em que um ou mais elementos estão fixos (rodapé, menus, cabeçalho). Neste link temos uma variedade de composições apresentadas de forma simples e com o código disponível para utilização.

Teoria: Os sites que ganham prémios são maus

Gerry McGovern explica a sua teoria de que os sites que ganham prémios não são bons.

Backstage: Green My Apple

A webdesigner Veerle Pieters conta como foi o processo de criação do recente vencedor do Webby, Green My Apple: a abordagem da Greenpeace, o briefing, as limitações e um pouco do CSS utilizado para o menu.

Webdesign: Inspiração Instantânea

Um set do Flickr, pelo guru dos web standards Andy Budd, com dezenas de print-screens dos seus sites favoritos.

Cores "Pronto-a-usar"

O estudante/webdesigner Adam Polselli perdeu algum tempo a investigar e decidiu entregar, ao fantástico preço de 0, as receitas para diferentes estilos, como chique, vintage ou corporativo. Cores, fontes, layouts, ícones, espaçamentos, estilos e efeitos, para download em formato de imagem, mais uns textos explicativos. Mais alguma coisa?

Links Geniais: Inspiração, Ferramentas e Artigos

Fiquei contente por ver que no resumo do mês de Agosto da internacionalmente idolatrada Smashing Magazine, surgiram vários links que eu já tinha mencionado aqui no blog. Como não me quero estar a repetir, apenas aconselho uma espreitadela à fantástica lista deles, e destaco os links que mais me chamaram a atenção:

- Para quem precisa de inspiração web, o site Muse apresenta uma mostra de sites cuidadosamente seleccionados

- Inspiração "corporativa": inclui uma lista de logotipos agrupados por tendência

- Ferramenta 1: uma das coisas que mais gosto de fazer são padrões, no entanto, nem toda a gente tem tempo ou jeito para isso. O site Stripemania faz o trabalho por nós

- Ferramenta 2: muito útil para vermos como o nosso site é visualizado nos vários browsers, o site Browsershots prepara print-screens do url que quisermos e disponibiliza-os para download em zip ou png. Ainda assim, em alguns dos testes que fiz não me parece que os print-screens sejam completamente fidedignos

- Artigos: sobre a visualização, por parte dos utilizadores, de banners de publicidade nos sites. As conclusões do artigo são interessantes (ainda que um pouco óbvias), e podem ser complementadas com um outro artigo, do mesmo site - The Most Hated Advertising Techniques.

Ferramentas "daltónicas"

Um artigo do site 456 Berea Street apresenta uma lista de algumas ferramentas que permitem verificar se as cores utilizadas nos sites têm contraste suficiente e são facilmente visíveis por quem tem uma "visão diferente".

Algumas ferramentas permitem a instalação directa no Photoshop ou no Firefox, enquanto que outras fazem o teste directamente online.

Da lista destaco Colour Contrast Checker, Vischeck, GrayBit e Colour Contrast Visualiser - todas para os Favoritos.