Instruções sobre webstandards , técnicas de codificação, como dar mais ênfase a sua acessibilidade beleza e usabilidade dentro de seus padrões. junto com esta matéria, também um slide.
Muitos desenvolvedores já adotaram os Webstandards, mas seguem apenas os padrões que beneficiam a produção das páginas. Existem técnicas de codificação que podem aumentar a acessibilidade, a usabilidade e a beleza das páginas, mas elas não estão muito difundidas.
slide
Tópicos e referências
* O que é webstadards
* Como são elaborados os Webstandards?
o W3C
* Os Webstandards, em última análise, devem beneficiar o usuário
* Separação entre conteúdo, apresentação e comportamento [ infográfico ]
o Código mais organizado, mais fácil de manter
o Diferentes arquivos de CSS para diferentes mídias: monitor, PDA, impressora, áudio [ tutorial ]
o Melhor indexabilidade em buscadores como o Google
* Recomendações baseadas nos padrões e na experiência de diversos autores
* Metadados
o Defina o seu DOCTYPE [ importância ]
+ Renderiza mais rápido
+ Padroniza renderização
o Declarando o idioma do texto [ aprofundamento ]
+ Essencial para a sintetização
+ Facilita indexação
o Ligue o documento a documentos relacionados. [ referência ] [ elocubração ]
+ Link rel (next, prev, index, start, author, copyright )
o Escreva títulos descritivos e sucintos para cada página
+ descritivo
+ não usar palavras-chave genéricas [ discussão ]
+ começar com o conteúdo
o Utilizar as tag certas [ importância ]
o Comente seus códigos [ aprofundamento ]
+ O código CSS tb é uma interface com usuários
+ Superespecificar
* Layout
o Evite usar tabelas para marcar layout [ introdução ]
+ Renderiza somente depois de carregadas as tabelas
+ Não se adapta facilmente
o Faça seu layout funcionar em diferentes resoluções [ lista de email ]
o Defina uma largura máxima para a coluna principal de texto [ argumentos científicos ]
o Ofereça layouts alternativos para o usuário [ tutorial ]
o Evite usar iframes
+ Use DIVs com overflow
o Evite colorir as barras de rolagem [ discussão ]
* Tipografia
o Prefira tamanhos de fonte relativos
o Use fontes incomuns, desde que com alternativas padrão [ pesquisa ]
o Substituir texto somente quando for impreencindível [ discussão ]
+ SFIR
o Aproveite o espaçamento entrelinhas e entreletras para aumentar a legibilidade [ chacota ]
* Navegação
o Mantenha o mesmo código de invólucro para conteúdo através das páginas do site [ exemplo ]
+ Ilusão de que não carregou nova página
o Evite submenus voadores horizontais só com CSS [ bom exemplo / mau exemplo ]
o Não quebre o botão voltar do navegador quando a gente mais precisa dele [ solução1 | solução2 ]
o Forneça um link para pular direto para o conteúdo [ aprofundamento ]
o Controle a ordem da navegação com a tecla tab.
* Formulários
o Associe o rótulo com o elemento de formulário. [ discussão ]
o Posicione os rótulos acima das caixas de entrada de texto. [ pesquisa científica ]
o Formulário Acessível ou Usável?
* Dimensões da Linguagem [ elocubração ]
o Sintática - regras da linguagem
o Semântica - significados da linguagem
o Pragmática - efeitos da linguagem
* Ferramentas essenciais
o Internet Explorer
o Barra Webaccessibilty
o Firefox
o Extensão Aardvark
o Barra Webdeveloper
o Opera
o Opera Mini Simulator
Fonte: usabilidoido.com.br
Nenhum comentário:
Postar um comentário
deixe seu comentário