O problema é que devemos ter organização tanto na metodologia de trabalho, como no aproveitamento de tempo, assim não gastamos tempo desnecessário com refação e nosso orçamento acaba condizendo mais com a realidade!

Para aqueles que já estão iniciando, ou até mesmo quem já tem uma boa experiência, mas busca melhores soluções de trabalho, vou indicar algumas ferramentas que facilitam (e muito) meu trabalho no Mac:

Coda: editor de códigos

Quando mudei para a plataforma Mac passei um bom tempo procurando a solução definitiva, que ficasse no nível do que tenho com o PSPad (para Windows).

Acabei encontrando o Coda, já citado aqui anteriormente, o qual possui os pré-requisitos que julgo serem extremamente necessários para meu trabalho render o esperado:

• Envio de arquivos por FTP, permitindo atualizar arquivos remotamente de forma automática
• Snippets (ou Clips, como são chamados no aplicativo)
• Fácil administração de projetos
• Plugins
• Find / replace em múltiplos arquivos
• Find / replace de múltiplas linhas

Além de outros tantos recursos interessantes que apresentei neste vídeo.

Preço: U$99

FileZilla: cliente FTP

Já conhecido no mundo do Windows, FileZilla é um cliente FTP que cumpre bem com seu objetivo básico.

Há a possibilidade de criação de contas para cada site, facilitando sua organização.

iBiz: time tracking

Depois de alguns projetos finalizados percebi que deveria contar o tempo gasto em cada atividade, para comparar com o orçamento feito ao cliente e mensurar se estava lucrando ou perdendo dinheiro.

iBiz é a melhor solução que encontrei até o momento, já que possibilita uma ótima organização de clientes e, dentro deles, projetos distintos. Dentro de cada projeto podemos inserir atividades e listas do que fazer (to do list).

Os clientes podem ser sincronizados com contatos na Agenda do Mac, além das tarefas serem sincronizadas com o iCal, outra funcionalidade bem interessante!

Além disso, podemos aplicar um valor por hora e fazer a conta final, baseado no tempo gasto. É uma boa alternativa para quem faz manutenção, por exemplo.

Há outras diversas opções como a contagem de tempo gasto em cada aplicativo aberto, assim podemos saber se realmente estamos sendo produtivos ou não!

Preço: U$39,99

Automator: tarefas automáticas

Automator foi uma grata surpresa encontrada no Mac. Aplicativo que já faz parte do sistema, possibilita uma gama enorme de fluxos de trabalho que otimizam seu tempo.

Por exemplo, com o auxílio do Automator criei um aplicativo que executo sempre no início de um novo projeto. Defino um nome para este novo site e, automaticamente, são criadas pastas para o HTML, layouts, conteúdo, scripts, etc., apenas com um clique!

Esse é só um exemplo, mas você pode automatizar envio de e-mails, tratamento de imagens, entre tantas outras tarefas… Há uma página específica com download de ações no site da Apple.

Para quem ainda não entendeu muito bem, o Automator executa “macros” no sistema operacional, assim como fazemos em editores de texto. Além disso podemos mesclar com AppleScript, assim desenvolvemos um aplicativo realmente completo!

Adobe Kuler: paleta de cores

Dificuldades para a definição da paleta de cores do seu site? Adobe Kuler é um serviço muito conhecido, o qual funciona como uma rede social para compartilhar paleta de cores, servindo como inspiração.

Para automatizar o processo de criação, a Adobe disponibilizou o Kuler em Adobe Air, assim você pode instalá-lo e rodá-lo diretamente no Mac (ou PC). Conectando-se ao serviço podemos fazer pesquisas nas paletas e importá-las diretamente para o Photoshop!

É uma verdadeira mão na roda para os Web Designers!

VMWare Fusion: rodando Windows no Mac

Infelizmente nós, Web Developers no mundo Mac, ainda não podemos deixar de usar o Windows, já que devemos testar nossos sites no Internet Explorer e Firefox. Também cito o Firefox, pois há diferenças de renderização, mesmo que pequenas, entre a versão para Mac e Windows.

VMWare Fusion se mostrou uma ferramenta extremamente confiável para essa tarefa, além de sua praticidade, não sendo necessário reiniciar a máquina para entrar no Bootcamp.

Falando em Bootcamp, o VMWare Fusion permite que os dois utilizem a mesma instalação do Windows, poupando espaço no hd!

Também há opções para otimizar seu desempenho como a quantidade de memória utilizada, processamento, drives, etc. Enfim, é a solução definitiva para quem quer testar seus sites no Internet Explorer, mesmo desenvolvendo em um Mac.

Preço: U$79,99

Outros programas que também utilizo e dispensam apresentação são: Safari (e seu Inspetor Web), Photoshop, Illustrator, suíte de aplicativos iWork e Microsoft Office.

Caso você tenha outras opções ou indicações, compartilhe conosco enviando seu comentário!

O blog não é atualizado há algum tempo, mas como acredito que este não é o tipo de site que precise ser atualizado frequentemente, estou dando prioridade a outros projetos e, claro, os freelances, sempre nos “atrapalhando” nos projetos pessoais

Como já comentei aqui, criei um blog sobre Nintendo Wii, algo que me interessa muito e vai muito bem obrigado!

Além deste site, voltei a tocar com a minha banda e aproveitamos para inaugurar nosso site, por isso também estou me dedicando no desenvolvimento deste, principalmente na otimização para os sistemas de busca.

Em breve atualizarei a seção Portfolio, com diversos trabalhos desenvolvidos ao longo de 2008 que, por falta de tempo, não pude atualizar.

Um grande abraço a todos os visitantes!

Já escrevi por aqui um artigo bem interessante sobre como melhorar seu rendimento profissional, além de outro fator que influencia diretamente no assunto deste post, a colaboração que deve ocorrer entre Web Designer e desenvolvedor CSS.

Agora falaremos de algo que envolve a organização do trabalho, seja numa equipe com várias pessoas, como um simples freelancer: a padronização.

Como foi comentado no evento da W3C, o brasileiro geralmente não gosta da palavra padrão, pois pode parecer “engessado”, algo que realmente não combina com as práticas em nosso mercado de trabalho. Mas com o tempo a gente aprende e vę que a organização do desenvolvimento e fluxo de trabalho garante um resultado mais preciso e, conseqüentemente, com nível de qualidade superior.

Digamos que chegue um grande site para desenvolvermos e, logicamente, existe um prazo a ser cumprido. No entanto, deveremos tomar algumas providęncias para que o tempo não seja excedido e, em casos extremos, não percamos o cliente.

Supondo que o layout já esteja feito, assim já pulamos a parte de briefing, Arquitetura da Informação e Criação, indo diretamente ao desenvolvimento HTML e CSS. Então, deve-se iniciar pelos códigos HTMLs, focando totalmente nesta parte, mantendo sempre os princípios do KISS (keep it simple stupid) e semântica do código pois, como sempre digo, o código HTML bom é aquele que não precisa ser ajustado de acordo com “firulas” do layout.

Padronização de HTML

Na etapa do HTML devemos adotar uma padronização no desenvolvimento, como por exemplo estabelecer um estilo de DOCTYPE dependendo do foco do site (grandes portais tendem a ser administrados por uma ferramenta, por isso o XHTML 1.0 Transitional é o mais indicado por ser mais tolerante a erros no código) e um arquivo padrão, com um header e suas meta tags pré-escritas. O modo pelo qual inserimos o CSS também deve ser padronizado: alguns preferem utilizar @import com estilo inline, enquanto a maioria (como eu) preferem utilizar o <link rel="stylesheet"... />.

Segue abaixo o exemplo de “template” HTML que utilizo:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+XML; charset=iso-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="Carlos Eduardo de Souza" />
<title>T&#237;tulo do site</title>
<link href="CSS/estilo.css" rel="stylesheet" type="text/css" media="screen" />
<!--[if IE 7]><link rel="stylesheet" type="text/css" href="CSS/estilo_ie7.css" media="screen" /><![endif]-->
</head>
<body>
</body>
</html>

Além do código propriamente, deve haver um consenso entre os desenvolvedores da nomenclatura dos arquivos e organização de pastas, assim com o decorrer do projeto e sua manutenção, não perde-se tempo para encontrá-los.

Fica também a sugestão do controle de versőes, ítem importante principalmente em equipes numerosas como aqui na agęncia e, para este fim, utilizamos o Eclipse.

Padronização de CSS

Já na parte do CSS a padronização é um pouco mais complicada, pois muita coisa é subjetiva, ou seja, está relacionada com as preferęncias de cada desenvolvedor. Ao começar pela escrita das regras: muita gente prefere escrever uma regra com uma propriedade por linha, enquanto outros aderem a prática de uma regra por linha, com todas as propriedades seguidas lado a lado. Particularmente prefiro esta última opção, pois o documento fica muito menor e para encontrar as regras fica muito mais fácil.

Também temos que nos ater aos comentários, também estabelecendo um padrão para que o documento fique mais legível:

/*
Cliente: Nome do Cliente
Projeto: Nome do Projeto
*/

/*
--------------
ELEMENTOS e CLASSES
--------------
*/

/* ------- GERAL ------- */

Este é um exemplo do início de código CSS que adotei em meus projetos pessoais e na agęncia. Pode-se observar que o código começa com o nome do cliente e projeto, seguido de um “comentário principal”, para os elemtentos e classes aplicados a todo o site. Já o comentário “geral” é um exemplo de código utilizado para separar as seçőes, algo como um “comentário secundário”.

Além da escrita dos comentários e regras, também temos que mentalizar a forma que iremos exibir as propriedades. Muitos desenvolvedores optam por escrever as propriedades em ordem alfabética, mas eu prefiro escrever em ordem de relevância, por exemplo, colocando as propriedades de posicionamento, float, display, width, height, margin, padding, etc., na frente, enquanto as outras relativas a fontes, alinhamentos de texto, etc., ao final de cada linha. Assim todos os desenvolvedores da equipe encontrarão as informaçőes principais em primeiro lugar.

Também temos que nos ater aos hacks pois há diversas soluçőes, principalmente no que se diz a respeito de Internet Explorer. Há a possibilidade de usarmos conditional comments ou os famigerados hacks dentro do CSS. O importante é que haja uma padronização e a equipe siga o mesmo caminho para solucionar tais problemas.

Padronização é a chave para o sucesso

Sei que este artigo não é direcionado aos novatos da área, até porque envolve aspectos mais administrativos de nossa profissão, mas nada impede que estas dicas sejam seguidas desde seu começo na área.

O importante é que saibamos a relevância de seguirmos certas regras e que, com elas, nosso rendimento aumentará, além de termos uma base para que não aconteçam ou, pelo menos, diminuam as chances de erros durante o processo do projeto.

Em uma iniciativa pioneira, pelo menos em termos de Brasil, o setor de otimização para sistemas de busca aqui da agęncia realizou um campeonato interno para SEO, iniciado em Março e finalizado no final de Julho.

A proposta era fazermos, em duplas, blogs sobre esportes diferentes, e conseguirmos colocar determinados termos na primeira página do Google. Obviamente, quanto melhor a posição, mais pontos eram somados.

Cada dupla contava com a ajuda de um “técnico” e com certeza, boa parte do nosso mérito, foi por conta da competęncia do Marcelo Ribeiro (blog sobre perfis de aviőes), sempre disposto a nos ajudar e deixando a gente tranquilo quando, do nada, nosso blog despencou da primeira página em todos os termos

Para competir, eu e o Lincoln criamos o Jogue Diferente, blog voltado a estes esportes exóticos, mas sempre deixamos a porta aberta a sugestőes de jogos inventados por nossos leitores.

Com uma boa regularidade de visitantes e postando constantemente, inclusive produzindo vídeos da prática destes esportes, conseguimos fechar o campeonato com uma ótima vantagem sob o segundo colocado.

Como pręmio, ganhamos um iPod Shuffle 1gb mas, o que interessou mais, foi fato de não terem divulgado o pręmio anteriormente. Assim, quem participou do campeonato foram aqueles que justamente estavam interessados em aprender.

E como nós pudemos aprender! Muito obrigado pelos responsáveis do evento, por nos ajudar a compreender e até mesmo, poder oferecer serviços da área.

Technorati Tags: SEO

E esse assunto sobre a freqüęncia de posts não poderia ter um momento melhor para ser utilizado, já que neste ano não tenho conseguido postar tantas vezes como antes.

Os motivos são vários, desde dedicação a outros blogs, experimentando os conhecimentos adquiridos no Campeonato de SEO aqui da Mídia Digital, até um número expressivo de freelances nos últimos meses, diminuindo (e muito) meu tempo hábil para escrever por aqui.

Creio que isso acontece com qualquer blogueiro que mantenha seu blog por mais de um ano no ar mas, como sempre, há aquela preocupação acerca da atualização constante do site, etc.

Mas será que a freqüęncia dos posts é tão relevante assim? Vamos discutir sobre o assunto.

Em blogs como este, que abordam muitos temas que envolvem conhecimento, a qualidade dos posts sobrepőe a freqüęncia na qual são escritos, principalmente neste caso, que há centenas de textos que podem ser encontrados através dos sistemas de busca, sem dificuldade. Ou vocę acha que um texto bem elaborado, rico em conteúdo, escrito uma vez por męs, não vale mais do que 10 posts sem algo que lhe acrescente?

Concordo que há blogs e blogs, assuntos diversos que são tratados, mas no caso daqueles que abordam temas mais informativos, a freqüęncia da postagem não é tão relevante.

É só imaginar um programador que quer aprender mais sobre Microformats e, ao procurar no Google, acaba encontrando um post de 2006 sobre o assunto. Esta data da sua postagem tira sua credibilidade? Claro que não.

Desta forma, aproveito a oportunidade para aconselhar os novos blogueiros, principalmente desta área de Desenvolvimento Web, que não fiquem tão preocupados com a freqüęncia de suas postagens, pois os textos, mesmo que não estejam na página inicial de seus blogs, ainda podem ser encontrados!

Para marcar a nova versão do navegador, foi inaugurada a campanha Download Day 2008 visando bater o recorde no número de downloads em um único dia.

Este movimento, acima de tudo, ajudará a divulgar ainda mais este nome que, ao lado de Opera e Safari, são os melhores browsers do mercado, sem dúvida.

Por isso, não se esqueça que amanhã é dia de baixar a nova versão do Firefox e batermos este recorde!

A entrada é gratuita e aberta a todos mas, para poder comparecer, basta fazer o credenciamento pela Internet. Caso queira mais detalhes, visite a página oficial do anúncio.

O primeiro é o blog sobre esporte diferente, criado para participar do campeonato de SEO da agęncia em que trabalho e, por sinal, está indo muito bem!

Outro trabalho que iniciei nesta semana foi um blog sobre Nintendo Wii, que também utilizarei para aplicar as técnicas de SEO absorvidas no decorrer do campeonato e escrever sobre um assunto que gosto muito de falar, o Nintendo Wii.

E, por fim, tenho honra em anunciar o lançamento do site oficial do time de futebol americano Curitiba Brown Spiders, no qual estamos colocando todo o conteúdo no ar, mas sua estrutura está toda pronta.

Além dos projetos pessoais, atualizarei a seção Portfolio com alguns novos sites que desenvolvi lá na agęncia, como por exemplo o site de venda do Google Earth Pro… Ficou bem interessante.

Primeiramente, graças ŕ um grande esforço consegui comprar o MacBook Pro, que pretendo utilizar em meus trabalhos, aumentando o meu rendimento e, conseqüentemente, a lucratividade nos projetos realizados.

Ainda tenho que ganhar experięncia no Mac OSX, mas já consegui me habituar com ele e perceber que não dá mais pra voltar a usar PC. Graças ao meu amigo Eduardo Perroud, consegui boas referęncias em programas de edição HTML/CSS para Mac, portanto nessa parte também estou tranqüilo. O único problema é a diferença de renderização do Firefox do Mac para o Windows, mas o problema também já foi constatado e contornado.

Devido ao tempo que levei para aprender e me habituar bem com o notebook, sobrou pouco para postar aqui, mas podem ficar tranqüilos que teremos novidades!

Tenho muitos temas para abordar, desde questőes relacionadas aos blogs, técnicas de CSS, SEO, Web Design, etc., ou seja, tem muita coisa boa engatilhada pra escrever na continuidade. Claro, também darei seqüencia ŕ “Sexta-feira dos Web Standards” que estava tendo um retorno legal do pessoal.

Por fim, mas não menos importante, quero aproveitar essa nova fase de oportunidades e amadurecimento para renovar o visual do project.47 e, de repente, mudar um pouco a estratégia do site… Bom, vamos ver como as coisas vão se encaminhando.

Aguardem pelas novidades

Lá pelo final da década de 90, quando houve o boom da Internet, surgiram vários “profissionais” que diziam saber de tudo, ou melhor, se intitulavam “Webmasters” que, teoricamente, sabiam e faziam de tudo no site.

Porém, como dito anteriormente, com o amadurecimento das profissőes e serviços prestados, além do surgimento de novas categorias, foram exigidos conhecimentos cada vez mais específicos. Por exemplo, hoje em dia, é obrigatório termos um profissional que saiba de Design voltado para Web e outro de TI, cada um em sua área. Posso afirmar que, quanto mais focado em sua profissão, mais bem sucedido vocę será nela. Mas não devemos nos esquecer de termos noçőes das outras etapas que envolvem o projeto.

Mas essa questão toda da especialização pode acabar se tornando uma armadilha para alguns. Com certo tempo de trabalho, conheci muita gente que acha que ser Designer basta para criar o layout para um site, por exemplo. Quem acaba se dando mal é o cara encarregado de fazer o HTML e CSS, tendo que se desdobrar para montar layouts mirabolantes, exigindo PNGs transparentes, fundos pesadíssimos, etc… Quantos já não passaram por isso?

Como Designer, posso afirmar que para se criar algo voltado para a Internet, deve-se fazer uma pesquisa sobre esse tipo de mídia, pois são apresentadas algumas “limitaçőes” (como na escolha de fontes, por exemplo), além da própria maneira do usuário interagir com ela ser totalmente diferente de um cartaz, por exemplo. Aliás, essas limitaçőes acabam deixando louco o pessoal que só trabalha com mídias offline.

Na realidade, o ponto ideal seria cada um conhecer e ser o mais focado possível em sua profissão, mas nunca chegar ao ponto de não saber mais nada das outras áreas que envolvem seu projeto, pois isso poderá acarretar sérios problemas para a continuidade do mesmo. Entrando em termos práticos, o resultado disso tudo seria a famosa “refação”, devido a falta de qualidade do produto entregue.

Leia também: Vocę trabalha com comunicação digital