Como definir a qualidade:
Se você já teve que julgar o código de alguém que você já deve saber o quão difícil é colocar uma espécie de grade sobre ele. Não só por causa das diferenças de estilos de codificação, mas também porque a qualidade do código final pode não estar a altura de sua face. A maneira mais rápida para julgar é dar uma olhada no código fonte do HTML, CSS e JavaScript, isso irá dizer-lhe muito.
Não estou muito interessado em definir uma escala de classificação, uma vez que é completamente impossível de qualquer maneira. Eu acho que é mais importante para definir que áreas e escopos existem para definir a qualidade do código front-end. Na minha experiência, existem quatro níveis importantes que precisam ser levados em consideração. Vou começar com o mais fácil e a mais simples, trabalhando a minha maneira.

1. Criando uma página:
Eis onde começa tudo. Você faz ou recebe um projeto, sente-se na frente de seu computador, você escolhe seu navegador favorito e começa a trabalhar. Escrever um HTML, CSS e JavaScript para combinar com um design funcional é um desafio no início. Como um não-designer que me levou algum tempo para entender as delícias de um bom design e de traduzir os para uma página da web. Por outro lado, esta é provavelmente a parte mais fácil do trabalho.
Para além das questões de design, você também tem que se preocupar sobre como escrever um código válido e você tem que ter certeza que sua página é acessível a pessoas que não utilizam navegadores regulares. Para a maioria das pessoas isso vai abrir portas para um mundo novo e desconhecido, mas é essencial dar uma qualidade global ao seu código.
Verificar a qualidade deste primeiro nível é bastante fácil. Validadores de código, uma rápida olhada em toda a fonte e rapidamente a digitalização da página com CSS desabilitado irá dizer-lhe muito. Mas claro, isso é só o começo.

2. Fazendo um trabalho de cross-browser e cross-platform:
Tempo para diminuir o zoom. Fazer uma única página para trabalhar em seu navegador favorito é uma coisa, ter certeza que ele funciona bem em uma variedade de navegadores e sistemas operacionais é um desafio completamente diferente. Primeiro de tudo, é importante notar que não é necessário que a página apareca exatamente do mesmo jeito em todos os navegadores. Para navegadores mais antigos, basta fazer o olhar e trabalhar bem, só que sem as coisas extravagantes. É importante certificar-se de que todas as funcionalidades ainda estejam lá. Sacrificar a funcionalidade essencial não é simplesmente feito.
Normalmente se preocupar com a compatibilidade do navegador é algo que acontece depois, mas é realmente importante ter isso em mente quando você começa em um projeto. Algumas técnicas funcionam melhor que outras, alguns problemas são mais fáceis de resolver do que outros. A escolha de um navegadorfuncional é muito importante de inicio. Conhecendo as entradas e saídas de navegadores e mudar um pouco o seu curso de código para afastar das grandes questões é um processo longo e cansativo, mas ajuda a melhorar a qualidade do seu código, um grande negócio.
Medir a qualidade real deste nível é um pouco mais difícil, embora o comprimento do navegador na fase de testes é uma boa indicação disto. Quando mais cedo você começa, mais fácil será para resolver os problemas do navegador, a realização destas terefas farão com que todos os browsers mostrem a página em uma forma aceitável. Mas, mesmo assim, alguns erros extremamente obscuros podem mantê-lo acordado a noite toda (ou a semana toda).

3. fazer um site:
Tempo para diminuir o zoom, mais uma vez. Um site é mais do que uma simples coleção de páginas. Você notará que vários componentes serão apresentados em páginas diferentes dentro do site, você vai notar também que arquivos CSS e JavaScript será utilizado em várias páginas dentro do site. Manter seu código consistente em todas as páginas pode ser muito mais difícil do que você imaginava.
A chave é pensar em componentes. HTML é uma linguagem descritiva, de forma independente da visualização ou do contexto, um bloco de “determinados conteúdos” deve sempre ser construído usando o html mesmo. Um exemplo que eu gosto de usar é o de um artigo de notícias. Isto pode aparecer em um bloco de focos separados, em uma lista resumida, como um resultado de pesquisa ou como um todo em uma página de detalhes. Basicamente é sempre a mesma coisa (um artigo de notícia), para a parte semântica do HTML (também acho que nomes de classes) devem ser os mesmos para todas essas instâncias. Variações no projeto devem ser baseados no contexto, pela definição de variantes (adicionando uma classe base extra para a diferenciação). Uma vez que você tem tudo isso coberto, a escrita correta do CSS e JavaScript deve ser muito mais fácil e a duplicação de código será reduzida.
Este nível é bastante fácil de controlar. Basta tomar algumas páginas de um site, destacar alguns componentes com variantes de design claro e verificar como são construídos e decorados. Se não houver uma base comum, esta certamente irá afetar a qualidade do seu site a longo prazo.

4. estabilidade e flexibilidade:
Os três níveis acima são todos importantes, mas, mesmo combinados todos os três critérios, a qualidade do seu código ainda pode ser bastante duvidosa. Seu código só será realmente brilhante quando ele se mostra estável e flexível. O problema é que você pode apenas usar esta medida quando se é efetivamente demasiado. Você pode olhar para vários indicadores embora.
O primeiro é quando você estiver chegado ao ponto de “os 5 últimos bugs”. Estas são alterações de última hora ou bugs com prioridade ligeiramente mais baixa que você adia porque eles são muito difíceis de corrigir. Você sabe que fez um bom trabalho quando você pode eliminá-los rapidamente. Por outro lado, se a fixação desses erros introduz novos ou requer retrabalhos de seções completas, ainda há muito espaço para melhorias.
Outro bom indicador é a “fase 2″. Como você está bem preparado para incorporar as alterações de design funcional sem arruinar seu site. Você pode deixar cair um componente existente em outro lugar sem ter que refazer todo o css? Você pode fazer a sua coluna da esquerda mais adaptando o mínimo de valores CSS e sem qualquer images recutting? Você pode criar uma variante de concepção de um componente sem ter que entregar o código HTML novo? Como é que fácil trocar de lugar com os componentes? O que se mede uma trilha de duas linhas? Todos estes elementos são indicadores da estabilidade e flexibilidade de seu código.

Conclusão:
Se o nível de qualidade alcançado for 4, sua missão não foi cumprida, pode custar-lhe muito tempo, esforço e dinheiro. Perguntas simples de seu cliente teram que ser respondida por respostas técnicas complicadas, seu cliente realmente não importa. Levará a horas extras, prazos não cumpridos, o estresse e um declínio na relação com seu cliente.
É um sério processo de aprendizagem que, como flexibilidade e estabilidade são apenas alcançados por dominar os 3 primeiros níveis e evoluir a partir daí. Se você quer melhorar suas habilidades, olhar para tráz e rever seu conceitos são uma boa dica. Veja onde você escorregou e pense em maneiras de se certificar de que não acontecerá novamente. Se você fizer isso com cada projeto, o céu é o limite.

Este artigo é uma tradução, o documento original pode ser encontrado em: front-end quality levels (http://www.onderhond.com/blog/work/front-end-quality-levels)

Eu adquiri este notebook na loja virtual do Shoptime (já conhecido por suas cagadas), o que se vê nos anúncios é totalmente contrário com a realidade. Será que o fato do frete ser gratis dá a esta empresa o direito de entregar o produto quando bem entender? Bem, a resposta é NÃO.

O anuncio chamou minha atenção por diversos fatores, entre eles, o valor e forma de pagamento/parcelamento, processamento, armazenamento, gráficos e dispositivos. Depois de muito pensar decidi comprar para complementar meu ambiente de trabalho e aumentar minha mobilidade, tudo certo e financeiramente combinado só o que tive a fazer foi esperar, depois de 22 dias de espera, a transportadora Ramos me entregou o pacote que aliais estava em péssimo estado de conservação e sujo. A maquina vem devidamente equipada com um sistema operacional personalizado pela Itautec baseado e Linux, o Librix que agrada a muitos, mas este não foi o meu caso e efetuei a instalação da também distribuição Linux, Ubuntu, que de fato já estava em mente desde de quando comprei a maquina. Depois de tudo corretamente instalado o próximo passo foi personalizar o sistema de uma forma que possa facilitar ao máximo meu ambiente de trabalho e pessoal, eu já sabia que não seria uma tarefa fácil encontrar os softwares de minha preferência. Finalizando esta parte eu consegui deixar o PC com a minha cara.

Primeiras dificuldades:
Wi-fi incompatível com a maioria das redes, ao chegar no Recife Palace Hotel, local da realização do 14º EDTED – Recife notei logo que a minha maquina era a única que não conseguia uma conexão estável com a rede do hotel, ai é fogo nê?

Incompatibilidade com Windows! Não há mais o que falar, aliais tem, a BIOS precisa ser atualizada, mas… não consegui fazer isso por que a Itautec não me forneceu o o arquivo pra isso, ah, o 0800 do SAC não funcionou em nenhum telefone que tentei, só faltou via satélite.

O Som pifou no terceiro mês, apesar de pouco ser usado, não posso reclamar ou enviar para a autorizado simplesmente por que o SAC não pode ser acessado de nenhum telefone e o Shoptime não quer nem saber, me manda pro SAC Itautec que não existe.

A quantidade de memória não condiz com o anunciado. Na loja virtual ate hoje pode ser lido as seguinte especificações: Memória – 4GB (2 X 2) DDR, legal é que só vem com 3GB! Cadê o Procon heim?

Outros: muito peso, baixa duração de bateria, alto aquecimento, gravadora lenta, bluetooth pega quando quer, saida VGA com defeito e por ai vai..eu poderia escrever mil defeitos que encontrei neste notebook mais esses são os principais e mais importantes.

Conclusão: a Itautec apesar de ser uma empresa de renome e conhecida inclusive em outros países é totalmente ineficiente e desrespeitosa com seus clientes. Shoptime é Shoptime e todo mundo já conhece sua falta de respeito com as pessoas, creio que a maioria dos problemas citados por mim podem ser encontrados em todos os equipamentos da mesma linha. Então, NÃO COMPREM ESTA PORCARIA! Fica a dica e espero não ser processado.

Atualização: O Sistema de Atendimento ao Cliente (SAC) da Itautec se manifestou a respeito deste artigo respondendo da seguinte forma: “Nossa empresa pede desculpas por nosso atendimento que não conseguiu sanar os problemas encontrados em seu equipamento, expressamos nossa vontade de que esse problema seja solucionado o mais breve possível”. Realmente a empresa entrou em contato comigo e através do próprio telefone consegui resolver parte dos problemas com o notebook, outros foram resolvidos em uma assistência técnica autorizada na cidade de Caruaru, por isso expresso aqui minha satisfação com o atendimento da Itautec que fez todo o acompanhamento deste caso. É bom frisar quão importante foi este blog para que o problema fosse solucionado o mais rápido possível, isso mostra que a internet cresce cada vez mais como uma ferramenta democrática e importante para uma sociedade mais justa.

Isso é o futuro!

È época de festejar tudo o que conquistamos durante mais um ano de muito trabalho e suor derramado, é isso ai, o ano esta acabando e é tempo de se confraternizar com familiares, amigos, colegas e clientes.

Passamos por muito estresse com “browsers” que não funcionam direito e vimos uma pequena rede social chamada Twitter estourar de uma forma assustadora, muitas coisas boas aconteceram e ainda estão por acontecer, mas, ninguém é senhor do tempo e também coisas ruins aconteceram. Mais a vida é assim, um dia é da caça, outro do caçador.

Desejo a todos os visitantes, clientes, amigos e parentes, um Feliz natal e um ano Novo cheio de muitas, mais muitas Felicidades e é claro muita saúde para que possamos continuar nossa jornada.

Peço de Deus abençoe há todos nós e espero contar com você no próximo ano.

Feliz 2010!

Na ultima semana senti a necessidade de contar apenas com um pequeno resumo de meus posts na página principal e em buscas por palavras chave e tags, confesso que fique abismado com a falta de usuários que pudessem me ajudar com isso, depois de muito pesquisar em muitos sites, blog e fóruns consegui juntar diversos pontos importantes para complementar um tutorial de como conseguir este objetivo.

Como fazer:
Muito simples, basta alterar o código de arquivos do template, cujo a função é exibir os posts contidos no bando de dados.

Na maioria dos Themes, os arquivos a serem alterados são: index.php home.php e archive.php.

Procure pela seguinte linha de código php:

the_content(Read the rest of this entry »’);

Troque: the_content por: the_excerpt
Faça isso em todos os arquivos que encontrar com a função the_content e todos os posts apareceram em resumo excerto em seu link permanente.

Benefícios:
Essa troca ira diminuir as chances de seu blog sofrer punição dos buscadores por conteúdo duplicado além de melhorar a usabilidade e proporcionar uma melhor indexação do seu conteúdo em sites de busca.

Espero ter ajudado e espero que esse tipo de informação no futuro seja mais presente na internet, afinal onde esta aquela “Web colaborativa”?

No último post intitulado “Nova fase!”, comuniquei que ocorreriam diversas modificações em meus projetos pessoais, uma deles seria um novo layout para o blog.
Minha intenção era usar um tema de minha autoria, mais infelizmente o tempo não me permite fazer isso no momento, por isso depois de muito pesquisar optei pelo “Motion”, que é disponibilizado no BD do próprio Wordpress.

Mais seguindo a dica do Guto Gomes, no futuro irei desenvolver um layout personalizado seguindo as novas tendências do mercado, ou seja, html 5 e css3.
Então vale aguardar por mais novidades no blog e também no site, que inclusive está na fase final de desenvolvimento.

Estou aberto a criticas, então deixem seus comentários a respeito do novo layout..abraço!

Dê olho nas tendências como um bom “geek” que sou, tomei a decisão de alterar minha forma de trabalho, isso não quer dizer deixarei de ser front end para me tornar um back end de uma hora para outra, o fato de ainda não ter um portfolio “apresentável” implica em diversas consequências, dentre elas, não sou reconhecido com um desenvolvedor atuante..cara, mais isso vai mudar agora, depois de uma semana fora do ar este blog esta novamente na ativa (isso é obvio), e meu site pessoal estará pronto em breve, certamente o design do blog não ficará de fora e também ganhará cara nova.

A cerca de um mês participei do EDTED (Encontro de Design e Tecnologia Digital), cujo qual foi realizado no Recife Palace Hotel (que é claro, fica no recife), algumas das palestras que tive a oportunidade de presenciar, me mostram um caminho bem diferente do que venho adotando atualmente, métodos revolucionários de trabalho mostrados pelo Fabiano Milani em sua apresentação sobre Scrum, e formas absolutamente absurdas e mega inteligentes de se administrar CMS’s assinadas por Paulino Michellazo, entre outras que com toda a certeza abriram meus olhos para um mundo diferente, isso é claro em aspectos ‘internetescos”. Claro não posso deixar de citar a grande Cleo Morgause que tem um nome difícil mais arrasa quando o assunto é SEO, sem falar nas grandes ajudas que recebo diariamente do Pedro Rogério com seus posts e shares que abordam assuntos itinerantes ao meu ver com o maior sucesso.

Neste momento tem pelo menos mil pessoas me chamando de “puxa saco” de famosos, mais isso não importa desde de que o meu objetivo que é começar do zero e falar tudo que quero esteja sendo alcançado, mais isso não aconteceria sem citar o grande Maujor que é o nosso maior “guru” da css e do html. Toda essa galera “da pesada” estimula as boas praticas na web e disseminam conhecimento diariamente em sites, blogs e redes sociais; tudo ali prontinho pra nós “jovens nerds” assimilarmos pra si e “pasarmos” a diante.

Concluindo, conhecimento nunca é demais galera! Este é apenas mais um entre tantos blogs voltados ao mundo da tecnologia, mais não fica só no virtual, leia um livro..melhor leia vários livros sobre diversos assuntos e torne-se mais um entre tantos colaboradores da internet brasileira e por que não dizer mundial.

O poeta já dizia: A vida é uma eterna escola, nós..os eternos estudantes!

Foto: é minha mesmo..

Foi com a visão da praia de Boa Viagem que o ‘Encontro de Design e Tecnologia Digital’, EDTED, se despediu da grande Recife.

O salão de eventos do Recife Palace Hotel foi pequeno para o número de pessoa que compareceram a ultima edição deste que é considerado o maior evento de tecnologia do Brasil, profissionais do mundo web “deram um show” em suas apresentação, o destaque foi para o Paulino Michelazzo (CMS’s Livres) e Fabiano Milani (Scrum), que foram sem duvida as duas melhores palestras do EDTED Recife.

Outra palestra que chamou muito a atenção dos desenvolvedores foi provida por Luiz Tiago, filho da terra que entusiasmou o publico ao falar sobre HTML 5 e CSS 3, palestra essa que derrubava o publico nas gargalhadas quando o assunto era ‘Internet Explorer’, ao final ele lançou um desafio aos participantes (mesmo feito no blog do Maujor), que a missão era: construir um ‘GIF’ de sorriso com apenas HTML 5 e CSS 3.

Stands da ‘HostNet’, ‘PagSeguro’ e ‘Extenssiva’ estavam no local distribuindo brides e é claro promovendo os serviços prestados por elas, ao final como é de costume, uma “mesa redonda” foi montada com todos os Palestrantes e Participantes, com muita descontração e sorteio de prêmios cedidos por patrocinadores e palestrantes, aproveito e dou meus parabéns a ‘sortuda’ da vez ‘Eva Siqueira’ que com sua ‘sorte’ esmagadora conseguiu levar 2 (DOIS) prêmios.

Conclusão: O evento foi extremamente proveitoso e aditivo ao nosso conhecimento, espero que muitos outros eventos como esse, sejam realizados no nordeste, pois este é um dos tabus a serem quebrados no Brasil, de que o nordeste é terra de ‘matuto’.

Aguardamos com muito entusiasmo a edição do próximo ano, e pedimos a Arteccom que a Paraiba seja adicionada no calendário, please…

14º EDTED

Neste Sábado (14/11) chega finalmente a capital Pernambucana a 14º edição do ‘Encontro de Design e Tecnologia Digital’, o EDTED, finalizando com muito sucesso o ano de 2009.

Com algumas baixas na “Super-Equipe” de palestrantes o evento vem adicionar um pouco mais de conhecimento aos jovens e já pioneiros da tecnologia no nordeste Brasileiro, uma delas é a tão aguardada presença do “Dinossauro das CSS”, Maujor, que infelizmente não poderá comparecer devido a problemas de saúde.

Outra personalidade que fará falta é Guilherme Chapiewski (Globo.com) que se encontra em viajem pelos EUA, informou a organização do evento.

Grande expectativa gira em torno do Recife Palace Hotel (renomado hotel da grande recife, hospedeiro inclusive da Seleção Brasileira), caso você deseje se hospedar nele ou em algum hotel, a própria Arteccom reservou uma promoção exclusiva para os inscritos no evento, confira no site: www.edted.com.br.

Aguardo a presença de todos os Desenvolvedores e entusiastas em mais um evento de grande porte na capital do frevo, a cobertura completa você acompanha através do Twitter: @war10ck_ti e buscando pela hashtag, #edted.

Convites pro Google Wave

Recebi 8 convite para o Google Wave, minha intenção é disseminar conhecimento para o próximo, então é claro irei distribuir entre meus colegas internaltas e desenvolvedores.

As primeiras 8 pessoas que deixarem comentários com e-mail receberam um convite! VALENDO…

Novo Orkut

O que mais se vê na internet (principalmente redes sócias) nos últimos dias não é outra coisa se não o lançamento do Google Wave e a nova versão do Orkut, rede social tão consagrada no Brazil, muitos enlouquecidos por um convite correm atrás de amigos ou pessoas que prometem dar ou sortear-los em troca de retwits, o Google por sua vez distribuiu milhares de convites para usuários aleatórios espalhados pelo mundo, neste caso podemos dizer que para o Orkut praticamente todos os convites foram enviados para e-mails brasileiros, levando em conta que esta ferramenta não é muito conhecida, muito menos usada fora daqui, outra forma de se conseguir um convite seria enviar um e-mail para o Google solicitando uma conta, no caso do Wave, o felizardo que recebe o convite direto do Google tem o direito de enviar um número limitado de convites para quem desejar, já no Orkut quase todos os usuários tem o direito de enviar convites, mais no meu caso aparece um mensagem dizendo o seguinte: “no momento seus convites não estão disponíveis”, mais vale esperar para ver e no futuro posso ate distribuir alguns entre os leitores do blog.

Primeiras impressões: Novo Orkut

Primeiramente o que não deixei de observar foi que boa parte da estrutura do site ainda é igual à versão antiga, páginas como “Amigos” e “Comunidades” estão praticamente iguais, somente com algumas mudanças no tom de cor a na fonte padrão.

Outra coisa que não pude deixar de notar e que me deixou bastante satisfeito foi o fato do site não mais dar suporte para o internet explorer, nisso o Google acertou em cheio, espero que essa mesma atitude seja adotada para a nova versão do YouTube.

A acessibilidade ainda é um obstáculo nessa nova versão, a exposição dos contatos ficou um pouco exagerada e a sessão, Conte algo para seus amigos! Ainda esta um pouco confusa, me parece mais um padrão parecido com o Facebook, todavia, muito precisa ser melhorado.

O layout não é nada revolucionário, algo que me é estranho por estarmos falando de um produto do Google.

Um recurso interresante é o suporte a HTML, algo que é familiar a usuários mais adeptos, mais que com essa versão foi aumentado, pude observar em algumas páginas, vídeos, fotos e gifs, o que pode ser um crime contra a acessibilidade, mais que bem administrado pode ser bem útil.

Carregamento de fotos, esse é um ponto bastante divergente dessa nova versão, pelo que li isso seria um recurso a ser melhorado, bem se eu fosse dar uma nota ela seria 7, não melhorou muito coisa, coloquei uma foto para ser carregada no inicio deste texto com o tamanho de 3.2MB há uma velocidade de 300kb, o tempo total do upload foi de 4 minutos, se comparado a versão antiga a diferença é extremamente pequena.

Por se tratar de uma versão beta creio que esses problemas e muito outros que não citei serão resolvidos ao longo do tempo.

Primeiras impressões: Google Wave

Google Wave

A respeito desta ferramenta eu diria que é cedo para falar alguma coisa, o pouco que pude observar me fez enxergar que ainda é um código prematuro, e muitas coisas ainda ser melhoradas numa escala de 0 a 10 = 8, algo que não pude deixar de notar foram os waves em tempo real, quando você esta digitando alguma coisa, outras pessoas que foram selecionadas por você vêem o que é escrito de forma dinâmica, por isso é bom caprichar na digitação pra não passar vexame corrigindo os próprios erros.

Também não pude deixar de notar que já existem diversos plugins que já funcionam apartir da API no Wave, inclusive testei uma delas, ela permite que o usuário escreva posts para o Twitter apartir do Google Wave, mas, eu particularmente percebi que alguns dos textos escritos não são postados no Twitter e algo que também deve ser frisado é que ele também não conta o número de caracteres digitados, algo que pode atrapalhar sendo que o Twitter não aceita mais de 140 caracteres.

Não tive muito tempo para avaliar o Wave, mas, o pouco que vi reportei aqui.

Em breve estarei distribuindo alguns convites para o Novo Orkut e também para o Google Wave, pra já o desafio é o seguinte:

Quantas vezes citei o aplicativo “Google Wave”, sendo que diversas vezes a empresa foi omitida?

Ta valendo um convite pro Novo Orkut, o resultado sai semana que vem!