Busca Interna.

Digite expressão ou palavra-chave.

• Links
• Contatos
• Mapa do site
• Feeds

Destaques.

• Vídeo: Acessibilidade Web: Custo ou benefício?
  Esse vídeo com 12 minutos mostra os principais obstáculos e soluções de acessibilidade e usabilidade na web.
• Lista Acesso Digital A Acesso Digital criou uma lista de discussão para tratar de acessibilidade na web. Quer participar? É só se inscrever.
• Recomendações para a Acessibilidade do Conteúdo da Web 1.0
  Versão do WCAG 1.0 em português de Portugal. Os itens de acessibilidade web preconizados pelo W3C através do WCAG 1.0, apesar de serem os mais discutidos internacionalmente, ainda servem, em sua maioria, como padrão para desenvolvimento de páginas web acessíveis em todo o mundo.
• Diretrizes para a Acessibilidade dos Conteúdos da Web 2.0
  Versão do WCAG 2.0 em português do Brasil. A versão WCAG 2.0 vem substituir as Diretrizes de Acessibilidade para o Conteúdo da Web 1.0 [WCAG1.0], que foram publicadas como uma Recomendação W3C em Maio de 1999. Embora seja possível seguir tanto as WCAG 1.0 como as WCAG 2.0 (ou ambas), o W3C recomenda que os conteúdos novos e atualizados utilizem a versão WCAG 2.0. O W3C recomenda também que as políticas de acessibilidade da Web façam referência às WCAG 2.0.
• WCAG Samurai em Português.
  Esta é uma errata às WCAG 1.0. A WCAG Samurai é uma alternativa à WCAG 2.0. Você pode seguir a WCAG 2.0 ou esta errata, ou mesmo não seguir nenhuma delas, mas não é possível seguir ambas.

Padrões Web: Desenvolvimento em Camadas.

Bruno Torres.

Desenvolver sites e aplicações pra web usando os padrões web significa, basicamente, usar cada tecnologia para o propósito único para o qual ela foi desenvolvida. Com isso, acabamos por organizar nosso código em "camadas". São elas conteúdo, apresentação e comportamento. Vamos ver em separado, o que significa, para que serve e como desenvolver cada camada separadamente.

Neste texto vamos dar uma rápida passada pelas duas primeiras camadas, a de conteúdo e a de apresentação. A de comportamento fica para um próximo post.

Conteúdo.

A camada de conteúdo é, sem sombra de dúvida, a mais importante de todas. É onde colocamos a parte mais preciosa do nosso site, aquilo que realmente faz a diferença no fim das contas " o conteúdo" (surpresa!).

Para desenvolver essa camada usamos as chamadas linguagens de marcação de hipertexto, no nosso caso HTML ou XHTML. O desenvolvimento deve sempre começar por esta camada. Antes de se preocupar com a parte visual ou comportamental de um site ou aplicação, deve-se estruturar com o maior cuidado e critério possível o conteúdo.

Quando você for começar a realmente pôr a mão na massa e escrever o código, mesmo que já tenha um layout definido, tente não pensar na parte visual. Se atenha ao conteúdo. Como esse conteúdo é dividido? Que partes compõem esse conteúdo? Qual a função de cada parte do conteúdo dentro do site?

Tendo isso em mente, coloque essas partes por ordem de importância e relevância para os usuários. Certifique-se de que o que é mais importante seja colocado antes no código.

Preocupe-se com a semântica. Use os elementos certos para marcar o conteúdo. O HTML te dá uma quantidade consideravelmente boa de elementos para estruturar o seu conteúdo.

Abra o seu HTML puro em um browser. O que você vê na tela faz algum sentido? Verifique se é possível navegar tranquilamente pelo conteúdo usando o teclado.

Lembre-se, todo o restante do processo de desenvolvimento do seu site vai depender de como o seu conteúdo está estruturado. Se as coisas não estiverem bem estruturadas nessa camada, você vai, certamente, ter problemas no futuro. Revise o seu código, mexa no que tiver de ser mexido agora. Mais tarde pode ser tarde demais e o tempo que você vai perder será muito maior, acredite.

Estando tudo certo com a estruturação do conteúdo, podemos passar para a próxima camada.

Apresentação.

Agora é a hora de aplicar aquele belo layout que você (ou o seu designer) criou para tornar o seu conteúdo mais atraente. Nessa camada, vamos usar o CSS para definir propriedades visuais para cada elemento do seu conteúdo.

O mais importante aqui é manter as coisas simples. Evite usar propriedades que possam causar problemas em diferentes browsers. Em geral é possível criar qualquer tipo de layout usando apenas aquilo que é largamente suportado.

Resista à tentação de mexer na camada de conteúdo para satisfazer uma necessidade especificamente de apresentação. Pense um pouco mais. A solução pode ser mais simples do que você pensa. Use esse artifício apenas em casos de desespero total, quando tudo o mais falhar.

Lembre-se, se você tem um problema, é grande a chance de que alguém já tenha tido o mesmo problema e o tenha resolvido. Também é grande a chance de que esse alguém tenha publicado, em algum lugar, a solução, quem sabe, com uma bela explicação. Uma busca no Google é sempre uma boa pedida.

Teste freqüentemente o resultado, de preferência em diversos browsers. Principalmente nos mais usados (Internet Explorer, Firefox, Opera e Safari).

Quer uma dica? Use como base de testes um browser que tenha um melhor suporte aos padrões web. Firefox é uma bela opção para os usuários de Windows. Para quem usa Mac, o Safari é a melhor opção.

O Internet Explorer é, de longe, o browser mais usado, mas tem um suporte bastante precário aos padrões. Por isso, se você tomá-lo como base para o seu desenvolvimento, será muito mais complicado consertar as falhas que serão notadas nos outros browsers.

Se você fez tudo direitinho até aqui, você tem um site bem estruturado, visualmente agradável e consistente.

Disponibilizado em: 04/04/2008.