Design Com Bolachas

sábado, 28 de fevereiro de 2009

Bandeiras e versões alternativas

Desde que tive a ideia de fazer este blog, decidi que ele deveria ser bilingue. Sou fluente tanto em Português do Brasil quanto em Inglês. Esta claramente era uma boa maneira de ampliar meu público em potencial.

Depois de pensar bastante, escolhi colocar o link para a versão alternativa no primeiro lugar da minha lista de links. Para torná-lo mais notável, achei que deveria ter uma daquelas bandeirinhas logo ao lado dele. Tendo eu já visto algumas bandeiras legais no meu cliente de BitTorrent favorito, o Ktorrent, decidi procurar, em sua documentação, onde foi que os desenvolvedores arranjaram-nas. Aqui está o link, as que eu estou usando são do conjunto world de 25x15 pixels. A licença destas é a Creative Commons.
Elas devem ser bem úteis quando você precisar ter versões em várias línguas de um site.

Marcadores: ,

quarta-feira, 18 de fevereiro de 2009

Fazendo o Template

Projetar o Template deste blog foi uma boa experiência e eu quero compartilhar com vocês alguns dos detalhes do processo que usei.

A primeira coisa que fiz foi um rascunho da aparência final com papel e lápis. Isto é ótimo porque nos dá a liberdade de criar estes rascunhos rápido e de descartá-los ainda mais rápido se eles não saírem como esperávamos ou se, simplesmente, mudamos de ideia no meio do processo. Em seguida, fiz um modelo do design no Inkscape, o qual usei para testar o esquema de cores que escolhi e o tamanho, em geral, das coisas. Então passei para a digitação do código e criação das imagens tomando estes passos:

  1. Selecionei o Template do tipo clássico na dashboard do Blogger e baixei uma cópia do template padrão, da qual removi todas as tags do Blogger (tais como BlogItemTitle ) e tudo que estava entre as chaves das regras CSS.
  2. Colei o típico conteúdo marcador de posição Lorem Ipsum e links de auto-referência no código para que eu tivesse algo em que aplicar estilo.
  3. Então, comecei a escrever as regras CSS e debugá-las ao mesmo tempo em que as criava com o Firebug (ferramenta adorável, diga-se de passagem; pense em obtê-la se você já não a usa).
  4. De vez em quando, checava o layout numa pilha de navegadores (incluindo, é claro, o IE do 5.0 ao 7) e certificava-me que o código validava no Validador do W3C.
  5. Decidi quais imagens eram necessárias e comecei a trabalhar nelas.
  6. Quando eu tinha um protótipo que funcionava e validava ambos XHTML/CSS eu comecei a trocar o conteúdo marcador de posição com as tags do Blogger apropriadas.
  7. Como passo final, fiz o upload do meu design de volta ao Blogger e eliminei os últimos poucos bugs que apareceram neste estágio.
Soa fácil, não? Bem, nem tanto assim. Para começar, há o problema da validação do código gerado pelo Blogger. Até o momento onde eu estava fazendo as imagens para este blog, tudo corria bem em relação à validação. Então, assim que inseri as tags do Blogger e fiz o primeiro teste pela URL no Validador do W3C, ele parou de validar. Parece que a maior parte do código que o Blogger insere no template não é padrão. Não há muito que eu possa fazer em relação a isto, então decidi simplesmente conviver com este fato. Há também alguns detalhes que eu prefiro falar a respeito em outro post, porque este já está bem grande.

E agora, o quê?

Estou pensando em usar o que aprendi ao fazer este template para criar templates customizados gratuitos. Então, esperem que eu venha postar um link para o meu novo blog de Templates!

Marcadores: , , ,

sábado, 14 de fevereiro de 2009

Primeiro

Oi, eu sou Thiago, e este é meu novo blog sobre Design e Desenvolvimento para a Web. Escreverei aqui alguns artigos sobre as técnicas que eu uso nos meus próprios designs. Tento manter meu foco primeiro na Usabilidade, depois na Acessibilidade e na Compatibilidade entre vários navegadores. Nunca uso editores WYSIWYG para a web, de fato a última vez que usei um deles foi na época do Netscape Composer 4.8.

Minhas atuais ferramentas preferidas para o design e desenvolvimento são:


Sinta-se a vontade para comentar, especialmente se você achar quaisquer erros gramaticais ou de código.

Espero que aprecie!

Marcadores: