Para ver todo o desenvolvimento da solução basta acessar o post. Já o resultado final pode ser conferido aqui.

Depois dou umas dicas de como por uns efeitos legais :]

Comecei a navegar na Wiki e descobri uma verdadeira mina de ouro das apresentações técnicas. São diversos assuntos abordados, todo relacionados a TI. Nem precisa dizer que passei algumas horas lendo/vendo algumas apresentações :] Tem muita coisa boa, a página do Steve Souders por exemplo, é só escolher um tema e correr pro abraço.

Essa aí de baixo, fala sobre frameworks para trabalhar com javascript. E meio longa, possui 83 slides, mas vale, muito, a pena ler ela inteira.

Mas esse não é o único problema de várias pessoas editarem o mesmo código. Existe ainda a questão dos preciosismos de cada desenvolvedor. Acredite, isso existe… Passei por isso algumas vezes aqui na Fishy, mas nada muito grave.

Mas não chegou a ser nada muito grave, já que na época que entrei haviam apenas dois front-ends. Entretanto algumas vezes apareciam alguns probleminhas… Principalmente na hora de entender o que aquela classe css queria dizer e qual a sua função.

De qualquer forma, afim de prevenir problemas desse tipo, começamos a desenvolver uma documentação interna ;] Na realidade essa documentação nunca ficou pronta, pois sempre apareciam coisas novas. Entretanto, a base ficou pronta depois de algumas reuniões e revisões.

Graças a isso, hoje temos um código uniforme e não temos grandes problemas para continuar o trabalho de outro front-end. Uma grande prova disso são nosso novos projetos. Um belo dia Rebeka, uma amiga nerd, chegou e me disse:

Antes eu sabia quem tinha feito os sites só de olhar o código… Hoje em dia isso não acontece mais, porque o código é praticamente igual em todos os projetos novos.

Nessa hora, ficou mais do que provado que estávamos no caminho certo. Hoje, nossa documentação praticamente não tem brechas, as coisas novas que vão aparecendo são analisadas e, caso seja possível, adotadas como solução padrão. Assim ela fica sempre atualizada e nosso trabalho cada dia menos difícil :]

E aí, você já pensou em fazer isso alguma vez?

Vi lá no site do Bruno Torres através da indicação do Ricardo para aplicação em um projeto que estou finalizando.

Trata-se de um menu dropdown com a possibilidade de navegação através do teclado. Para tal ação ser possível, usamos um javascript de fácil compreensão.

A marcação HTML é a seguinte:


<ul id="menu">
<li><a href=”/”>Início</a></li>
<li><a href=”/servicos”>Serviços</a>
<ul>
<li><a href=”/servicos/design”>Design</a></li>
<li><a href=”/servicos/prog”>Programação</a></li>
</ul>
</li>
</ul>


O css..


ul{ list-style:none; }
#menu li {
float:left;
position:relative;
}
#menu li ul {
display:none;
position:absolute;
top:0.9em;
left:0;
margin:0;
padding:0;
}
#menu li:hover ul { display:block; }


E o script:


var lis = document.getElementsByTagName('li');
for (var i = 0, li; li = lis[i]; i++){var link = li.getElementsByTagName('a')[0];
if (link){
link.onfocus = function(){
var ul = this.parentNode.getElementsByTagName('ul')[0];
if (ul)
ul.style.display = 'block';
}
var ul = link.parentNode.getElementsByTagName('ul')[0];
if (ul){
var ullinks = ul.getElementsByTagName('a');
var ullinksqty = ullinks.length;
var lastItem = ullinks[ullinksqty - 1];
if (lastItem){
lastItem.onblur = function(){
this.parentNode.parentNode.style.display = 'none';
}
lastItem.parentNode.onblur = function(){
this.parentNode.style.display = ”;
}
}
}
}
}


Para ler o artigo original basta clicar aqui

Há uma semana recebi, através do Twitter, um link para o canal de Webmasters do Google no Youtube, porém só lembrei de conferir ontem a noite =P

Ví o vídeo no qual Matt Cuts fala sobre espaço em branco no HTML (veja no vídeo a baixo), se isso tem algum impacto no processo de indexação do site.