Sim, esse aqui sou eu. A alternativa pro Corel Draw que citei na entrevista é o Inkscape. E já que citei ele, já aproveito pra dizer que sim, vou continuar com minha lista de artigos sobre desenvolvimento web no Ubuntu, e vou tentar até colocar uns artigos sobre design lá. Algumas imagens dos artigos já estão online, pro divertimento de quem quiser ordená-las por data e tentar decifrar o significado.

Inkscape? Corel Draw? Apache? PHP? Você é Webdesigner ou Programador?

Até me mostrarem uma lei da física que me impeça de ser ambos, continuarei sendo os dois (embora esse blog esteja uma caca visualmente!).

No post sobre hacks css e tabelas houve uma pequena discussão nos comentários sobre a separação de conteúdo e design. Há muita desinformação dos profissionais mais entusiastas dos padrões nesse aspecto.

Embora seja possível separar totalmente algum conteúdo de alguma apresentação específica, nem sempre é possível separar qualquer conteúdo de qualquer apresentação usando somente CSS. Em outras palavras, existem sim limitações tecnológicas no desenvolvimento com padrões, e muitas!

Nos comentários do post surgiu um desafio, após a declaração do William:

Estou para ver ainda algum caso onde não fosse possível separar completamente conteúdo de layout. Se você conhece algum exemplo me mostre, quero ver.

Preparei um desafio simples de um caso no qual é impossível separar conteúdo da apresentação e até modifiquei o desafio de acordo com as dicas do desafiado. Como não obtive resposta ainda, resolvi dar mais visibilidade ao desafio usando esse post

Qualquer um que solucionar o problema do desafio, não ganha um pendrive ou livro, mas ganha um post de desculpas bem envergonhado. Eu sou um desenvolvedor pobre, porém honrado :)

Há um bom tempo estou tentando me livrar do Photoshop para construir sites. Além de ser pago e caro, o que faz com que eu me torne dependente do computador do serviço, é pesado.

Tentei o GIMP, que é mundialmente conhecido como o Linux Photoshop. Péssimo, aquela interface é um suicídio pra quem já acostumou com outro programa. Além do mais, softwares que trabalham com bitmaps não são os mais recomendados para design de páginas na internet.

Após muito pesquisar e resistir, resolvi que seria melhor adotar um programa que trabalha com imagens vetoriais, não bitmaps. Descobri o Inkscape e me encantei.

Além de ser extremamente simples (o que eu adoro), o Inkscape trabalha com SVG, um padrão da web que já comentei por aqui.

Ao abrir o programa pela primeira vez, fiz algo que nunca havia feito antes: usei o tutorial nativo dele e posso afirmar, é excelente! Além desse tutorial nativo, bastante material em vídeo pode ser encontrado no youtube.

Sem dúvida o tutorial que me fez mudar definitivamente para o Inkscape foi o de fatiamento de imagens, que me permite exportar as imagens do layout separadamente de maneira muito fácil

Obviamente, nessas primeiras semanas, tudo foi só experimentação. Sinto falta de algumas coisas que o Photoshop fazia automaticamente, como sombras e texturas direto na camada. Aliás, trabalhar com camadas no Inkscape é possível, mas é desencorajador (pelo menos até o momento).

Ainda estou brigando com meu hardware para conseguir manter um Linux perfeito, enquanto isso eu brinco com o Inkscape do Windows mesmo, já que ele pode ser instalado em ambos.

Para quem busca mais opções além do Inkscape pra trabalhar com design de páginas no Linux, pode conferir um artigo do Marcus que fala sobre isso também.

O que me preocupa, talvez até assusta, é que não conheço nenhuma página com design excepcional que foi declarada como construída no Linux. Será que dará certo?

Designer bom hoje em dia tem que saber CSS, senão já sabe o que acontece né? É quase certeza de briga com o programador. E o programador tem razão! Como se não bastasse ter que construir o acesso aos dados ele ainda terá que criar folhas de estilos? Sem chance.

Aí é que está o grande problema: Há uma carência muito grande de ferramentas visuais pra CSS, o que torna essa linguagem praticamente código puro. Não tem jeito, você terá que abrir o editor de código e fazer as folhas de estilo na unha.

Isso prova quanto tempo as empresas estavam cegas para os padrões web. O Dreamweaver, um popular editor visual para criação de websites, teve sua explosão de popularidade em 1999, pouco tempo depois do lançamento do CSS nível 2. Só agora nas versões mais recentes, os padrões da web tem recebido um pouco mais de atenção.

Engraçado é que tem gente até comentando o futuro do css, pedindo revisões com menos intervalos de tempo e mais ferramentas para trabalharmos. Mas e o coitado do designer? Nenhuma ferramenta pra trabalhar de maneira prática com CSS é feita pra ele. Coitado do programador também.

Você já deu uma lida nos esboços do CSS nível 3? Sabe as bordas, fundos, texto e tudo mais que somos obrigados a fazer com imagens hoje em dia? Ele incorpora tudo isso.

Eu não sei o nome do primeiro editor CSS3 visual que surgirá, só sei que será um pouco de Photoshop, um pouco de Dreamweaver e totalmente visual. E vai vender muito.

A dúvida é comum, respostas conclusivas existem poucas. Quando criar um layout, você deve usar 800×600 ou 1024×768 como resolução?

Todo mundo começa a argumentar usando estatísticas de uso de resoluções. É comum falar que “a maioria das pessoas usa 1024×768″. Existem alguns fatores além desse.

Recentemente o Roger Johansson fez uma pesquisa sobre quem maximiza a tela dos navegadores. O resultado da pesquisa mostra que no geral apenas 50% dos usuários maximiza a tela, o que coloca mais um elemento na hora de considerar nossos layouts.

A pesquisa vai adiante, ela retrata exatamente o comportamento dos usuários de cada resolução.

A resolução mais utilizada segundo a pesquisa é a de 1280×1024, um dado completamente novo para nós. E dos 617 usuários dessa resolução (dos 1070 participantes) apenas 61% deles utilizava a tela do navegador maximizada.

Na resolução de 1024×768 73% dos usuários usam a tela maximizada.

Isso é muito importante porque sempre consideramos o tamanho da tela mas raramente o comportamento do usuário. Um site fixo em uma largura para 1024 nem sempre é ideal para quem usa a resolução de 1024 de largura, porque nem sempre a pessoa usa o navegador maximizado.

Eu não recomendo layouts fixos, os líquidos e elásticos não tem esse problema das resoluções, mas se for usar um fixo a alternativa mais acessível segundo os dados da pesquisa é 800×600.

Esses dias lembrei de uma galeria de fotos bem dinâmica que fiz em CSS Puro. Funcionou em todos os navegadores na época.

O mais legal dela é a abordagem minimalística do CSS. Não uso uma classe por foto, tudo é baseado na tag img e pra ativar a galeria basta adicionar uma única class="photopreview" na lista não-ordenada que contém as imagens.

Fiz duas versões, aqui e aqui. As fotos (e um pouco de inspiração) eu roubei da galeria que o Maujor fez.

Essa galeria também é legal pra mostrar como os navegadores implementam diferente cada coisa no CSS. No Firefox por exemplo você pode clicar e arrastar sobre as fotos (segunda galeria) que a propriedade active se mantém. Já nos demais, acontecem coisas estranhas.

Provavelmente essa galeria é muito menor do que qualquer uma feita em Flash ou Ajax. Não tem efeitos de transparência nem transição, mas é elegante e funcional.

Com um pouco mais de trabalho dá pra colocar miniaturas reais nela (as que usei são apenas redimensionamentos) e zoom real também. Preferi evitar a fadiga e deixar o código simples, a idéia da galeria é apenas transmitir uma….. idéia.

O Maujor colocou no seu blog recentemente um desafio para designers: Refazer o design do Zen Garden do Maujor, um clone brasileiro inspirado no CSS Zen Garden.
O prêmio para o vencedor será um livro Photoshop CS2 – A Bíblia e para participar basta enviar o desenho do layout, não precisa fazer a parte de CSS.

Além do prêmio dado pelo Maujor, a Dialhost e o iMasters darão prêmios adicionais aos participantes.

Quaisquer dúvidas podem ser esclarecidas lá no post sobre o desafio direto no blog.

Eu já fiz minha contribuição, recomendo a todos que participem!