luminescente

Aqui vão algumas notas soltas sobre a web a um nível técnico.

Coisas que vejo no dia a dia no trabalho ou vou vendo nos sites que visito (claro que vou cuscar o source). Alguns problemas fundamentais, outros detalhes menores, mas que se podem encontrar sem ser preciso procurar muito.

Sem pretender ofender o trabalho de ninguém que também tenho a minha quota de azelhices (podem começar neste blog) e uma pessoa vai aprendendo com o tempo, não é verdade?

Inicialmente este texto era focado naquilo que se faz em Portugal, mas cedo abandonei a ideia. Há por aí HTML+CSS com muita qualidade a ser debitado por portugueses e também muita asneira feita por estrangeiros. Nem todos os bifes são o [http://en.wikipedia.org/wiki/Zeldman](Jeffrey_Zeldman) assim como nem todos os portugueses são o Chico que vende sites feitos no Frontpage.

#### HTML

- As tabelas continuam vivas e de saúde, infelizmente. Os velhos hábitos custam a morrer mesmo com soluções melhores. Há efeitos que é complicado fazer sem tabelas (alinhamentos verticais, por exemplo), mas não há desculpa para ainda se usar tabelas.
- Atributos das tags não delimitados, estruturas inválidas (elementos block dentro de elementos inline).
- Divitis: Quando o DIV é a resposta para todos os problemas, a pergunta não foi compreendida.

#### CSS

- Usa-se CSS, mas mal. Muitas vezes apenas para FAC (Fonts And Colors), ou corre-se tudo a DIVs com classes de nome “bold”, “titulo”, “link”.
- Não é necessário definir para todas as tags o font-family/font-size. Define-se uma vez para o body e basta para a maior parte das situações. Pelo menos façam uma regra “p, div, span, a, table, td, th” para aplicar num único sítio a fonte predominante em vez de repetir as propriedades da fonte para cada tag/id/classe.
- Selectores de contexto. Em vez de definir que os links dentro de um determinado elemento têm uma determinada formatação, corre-se tudo com classes e IDs compostos (a.sidebarContentGroupLink {}). O IE é muito mau, mas pelo menos compreende selectores de contexto simples (para o exemplo anterior, algo como #sidebar .group a {} ).
- IDs repetidos (hint: é para isso que as classes existem).

#### Flash

- Recurso a Flash e Javascript para coisas simples como menus e links de navegação, quando não mesmo para sites inteiros.
- Scrolling do conteúdo feito em Flash, cada qual com a sua implementação, usualmente avariada, em que as coisas não funcionam como se esperam normalmente.

#### Javascript

- Javascript da idade da pedra. window.layers, document.nomedoform.field, doc.write() em XHTML. O Google é vosso amigo, mas neste tema afastem-se dos primeiros resultados da pesquisa, a não ser que sejam um link para o [http://www.jquery.com](jQuery).
- Tal como indicado para Flash, as inúmeras macaquices que se vêem com o scrolling do conteúdo em Javascript, que não funciona, ou não funciona de forma intuitiva ou com lacunas (não suportar scrolling com a roda do rato, por exemplo).

#### Vários

- Frames! Argh!!!
- Confusão com o encoding dos caracteres. Envia-se latin1 quando o o header ou a metatag indicam UTF-8. Strings que são processadas por funções que não compreendem as sequências UTF-8 e e mutilam caracteres (hint: em php usar as funções mb_* em vez das simples como o substr, strlen, etc).
- site.com deve ir ter ao mesmo sítio que www.site.com. Acontece mais vezes do que julgam.
- Usar XHTML por tudo e por nada, sem se perceber o que se ganha em relação ao HTML4.
- Há várias tags que não são muito utilizadas mas são importantes. Label, optgroup, fieldset+legend, até mesmo os h1..h6.
- Não se usam [sprites](http://www.alistapart.com/articles/sprites). Continua-a a recorer ao velho script de pre-load de imagens (copiado do *I feel lucky* do Google…), ou deixa-se o utilizador esperar o carregamento da imagem do menu quando passa o rato por cima.
- UPDATE: em páginas com mais do que um formulário, carregar em Enter após se preencher os dados faz o submit do formulário errado, normalmente o primeiro da página.