Postado por: Milton Mattos em: ● July 1, 2009
Parceira com agência New Brand Solution e LionZ o site do Spa Sorocaba inaugura seu site novo. A proposta foi deixar mais clean e fácil de navegar. O Spa Sorocaba já foi eleito um dos melhores Spas do Brasil em 2008 pela revista Viagem.
Link: www.spasorocaba.com.br
Postado por: Milton Mattos em: ● July 11, 2008
Não tem nada mais motivador quando um projeto web suado entra no ar, foi o site para o refrigerante Guarah. Demorei até para escrever esse post, mas o site do Guarah esta no ar, com muito orgulho. A equipe que trabalhou para esse projeto esta de parabéns!
Agora bola para frente para outros desafios.
Postado por: Milton Mattos em: ● June 23, 2008
Muitas empresas vem investindo alto para evitar os erros de usabilidade mais comuns, que são:
Postado por: Milton Mattos em: ● June 10, 2008
Cada vez mais sites utilizam linguagem de game para divulgar os seus produtos. A empresa de balas Mentos, para divulgar sua linha de produtos, desenvolveu um jogo para internet no mesmo estilo Street Fight, só que ao invés de porradas são beijos. O momento mais divertido é quando você ganha.
Postado por: Milton Mattos em: ● April 8, 2008
Postado por: Milton Mattos em: ● April 2, 2008
Vídeo muito bacana sobre os conceitos de web 2.0 através de um supermercado. Com legendas em português.
Postado por: Milton Mattos em: ● January 21, 2008
Mandaram bem nessa campanha!

Postado por: Milton Mattos em: ● January 14, 2008
No post anterior foi comentando sobre a prioridade 1 para acessibilidade. Agora segue as directivas da prioridade 2 para acessibilidade na web.
Exemplo de código MathML
http://codefactory.com.br/weblog/?page_id=85Browser compatíveis para MathML
http://www.w3.org/Math/implementations.html
Minha opinião
Se não têm suporte para o browser mais usado Internet Explorer e sendo necessário instalar um pluging para rodar o MathML. Creio que esteja muito longe a acessibilidade para esse aspecto.
O mesmo caso ocorre no uso do comando css “before” e “after” que indica o começo/fim do documento, para facilitar o usuário e lembrar onde ele estave. Não funciona no Internet Explorer, somente no Mozilla.Minha opiniãoNão sei se é hiprocrisia, mas o W3C não utiliza isso.
> Criar documentos passíveis de validação por gramáticas formais, publicadas
Por exemplo, incluir uma declaração de tipo de documento no início do documento, que se refira a uma DTD publicada (por ex., a DTD estrita do HTML 4.0).
> Utilizar folhas de estilo para controlar a paginação (disposição em página) e a apresentação.
Por exemplo, utilizar a propriedade ‘font’ do CSS em vez do elemento FONT do HTML no controlo estilos de tipo de letra.
> Utilizar unidades relativas, e não absolutas, nos valores dos atributos da linguagem de anotação e nos valores das propriedades das folhas de estilo.
Por exemplo, em CSS, utilizar ‘em’ ou percentagens em vez das unidades absolutas ‘pt’ ou ‘cm’.
> Utilizar elementos de cabeçalho indicativos da estrutura do documento e fazê-lo de acordo com as especificações.
Por exemplo, em HTML, utilizar H2 para indicar uma subsecção de H1. O mesmo caso do uso correto dos comandos para tabela.
> Anotar correctamente listas e pontos de enumeração em listas.
Por exemplo, em HTML, hierarquizar correctamente as listas OL, UL e DL. Quando houver outras categorias na lista, incluir um texto finalizando informando a finalização da categoria.
Exemplo
http://www.w3.org/TR/WCAG10-CSS-TECHS/#lists
> Anotar as citações. Não utilizar anotações de citação para efeitos de formatação, como, por exemplo, o avanço de texto.
Por exemplo, em HTML, utilizar os elementos Q e BLOCKQUOTE para, respectivamente, anotar citações curtas e mais extensas. O elemento não funciona no Internet Explorer.
Indicar claramente qual o idioma utilizado
> Não contém nenhum ponto sobre essa directiva.
Criar tabelas passíveis de transformação harmoniosa
> Não utilizar tabelas para efeitos de disposição em página, a não ser que a tabela continue a fazer sentido depois de linearizada. Se não for o caso, fornecer um equivalente alternativo (que pode ser uma versão linearizada);
> Se for utilizada uma tabela para efeitos de disposição em página, não utilizar qualquer anotação estrutural para efeitos de formatação visual.
Por exemplo, em HTML, não utilizar o elemento TH para fazer com que o conteúdo de uma célula (que não seja de cabeçalho de tabela) apareça centrado e a negrito.
Assegurar que as páginas dotadas de novas tecnologias sejam transformadas harmoniosamente
> Em programas interpretáveis e applets, assegurar que a resposta a acontecimentos seja independente do dispositivo de entrada.Usar teclado ao invés do mouse.Técnica
Use “onmousedown” com “onkeydown”.
> Assegurar a acessibilidade do conteúdo dinâmico ou fornecer uma apresentação ou página alternativas.
Use “onmouseup” com “onkeyup”.
Use “onclick” com “onkeypress”
Por exemplo, em HTML utilizar NOFRAMES no final de cada conjunto de frames. No caso de determinadas aplicações, os programas interpretados no servidor podem ser de acesso mais fácil do que os interpretados no cliente.
Assegurar o controle do utilizador sobre as alterações temporais do conteúdo
> Evitar as situações que possam provocar o piscar do conteúdo das páginas (isto é, alterar a apresentação a intervalos regulares, como o ligar e desligar), até que os agentes do utilizador possibilitem o controlo desse efeito.
> Evitar páginas contendo movimento, até que os agentes do utilizador possibilitem a imobilização do conteúdo.
Sempre que uma página contenha movimento, fornecer (num programa interpretável ou num applet) um mecanismo para o imobilizar e para impedir actualizações. A utilização de folhas de estilo dotadas de programas interpretáveis destinados à criação de movimento permite que os utilizadores tenham mais facilidade em as desactivar ou fazer com que os seus efeitos sejam anulados.
> Não criar páginas de refrescamento automático periódico, até que os agentes do utilizador possibilitem parar o refrescamento.
Por exemplo, em HTML, não provocar o refrescamento automático das páginas através da inclusão de “HTTP-EQUIV=refresh”, até que os agentes do utilizador dêem aos utilizadores a possibilidade de desactivarem essa funcionalidade.
> Não utilizar anotações para redireccionar as páginas automaticamente, até que os agentes do utilizador possibilitem parar o redireccionamento automático. Em vez de utilizar anotações, configurar o servidor de modo a que seja ele a executar os redireccionamentos.
Assegurar a acessibilidade directa de interfaces do utilizador integradas
> Sempre que um objecto integrado tenha uma “interface própria”, a interface — tal como a interface do próprio navegador — tem de ser acessível. Se a interface do objecto integrado não puder ser tornada acessível, tem de ser fornecida uma solução alternativa.
Pautar a concepção pela independência face a dispositivos
> Assegurar que qualquer elemento dotado de interface própria possa funcionar de modo independente de dispositivos.
Cada interface própria deve funcionar com qualquer dispositivo(mouse, teclado e entre outros)
> Em programas interpretáveis, especificar de resposta a acontecimentos, preferindo-as a rotinas dependentes de dispositivos.
O detalhe dessa directiva é informar quando houve um programa(script, apllet ou object) depender do dispositivo teclado.
Utilizar soluções de transição
> Não provocar o aparecimento de janelas de sobreposição ou outras, e não fazer com que o conteúdo da janela actual seja modificado sem que o utilizador seja disso informado, até que os agentes do utilizador tornem possível a desactivação de janelas secundárias.
Por exemplo, em HTML, evitar a utilização de frames cujo destino seja uma nova janela.
> Assegurar o correcto posicionamento de todos os controlos de formulários que tenham rótulos implicitamente associados, até que os agentes do utilizador venham a suportar associações explícitas entre rótulos e controlos de formulários.
O rótulo tem de estar imediatamente antes do respectivo controlo, na mesma linha (permitindo mais do que um controlo/tabela por linha), ou na linha que precede o controlo (com um único rótulo e um único controlo por linha).
Utilizar tecnologias e recomendações do W3C
Utilizar tecnologias do W3C sempre disponíveis e adequadas a uma determinada tarefa; utilizar as versões mais recentes, desde que suportadas.
Para saber onde encontrar as mais recentes especificações do W3C e suporte relativo à interface do usuário de WAI (com informações sobre os agentes que suportam as especificações W3C), consultar a lista de referências.
A W3C lista tecnologias para acessibilidade:
MathML para equação matématicas
HTML, XHTML, XML para estruturar documentos
RDF para meta data
SMIL para criação apresentação multimidia
CSS and XSL para definir folha de estilo
XSLT para criação transformação de estilo
PNG para gráficos
> Evitar funcionalidades desatualizadas de tecnologias do W3C.
Por exemplo, em HTML, não utilizar o elemento FONT, já desatualizado; utilizar, em seu lugar, folhas de estilo (por ex., a propriedade ‘font’ do CSS).
Fornecer informações de contexto e orientações.
> Descrever a finalidade dos frames e o modo como se relacionam entre si, se isso não for óbvio a partir unicamente dos títulos.
> Dividir grandes blocos de informação em grupos mais fáceis de gerenciar, sempre que for o caso.
Por exemplo, em HTML, utilizar OPTGROUP para agrupar elementos OPTION dentro de um SELECT; agrupar controles de formulários por meio de FIELDSET e de LEGEND; utilizar listas hierárquicas sempre que for adequado; utilizar cabeçalhos para estruturar documentos.
> Associar explicitamente os rótulos aos respectivos controles.
Por exemplo, em HTML, utilizar LABEL e o respectivo atributo “for”.
Fornecer mecanismos de navegação claros
Fornecer mecanismos de navegação coerentes e sistematizados — informações de orientação, barras de navegação, mapa do site — para aumentar as probabilidades de uma pessoa encontrar o que procura em um dado site.
> Identificar claramente o destino de cada link
O texto do link deve ser suficientemente ilustrativo para fazer sentido quando for lido fora de contexto – isoladamente ou integrado em uma seqüência de links. O texto do link deve, além disso, ser conciso. Evitar o famoso “clique aqui” nos textos.
> Fornecer metadados para acrescentar informações semânticas a páginas ou sites.
> Dar informações sobre a organização geral de um site (por ex., por meio de um mapa do site ou de um sumário).
> Utilizar os mecanismos de navegação de maneira coerente e sistemática.
Fornecer mecanismos de navegação claros
Não contém nenhum ponto sobre essa directiva.
Postado por: Milton Mattos em: ● January 8, 2008
Ultimamente vejo que pessoas têm dificuldade em descobrir as prioridades estabelicidas pela W3C para acessibilidade. Nesse post segue as prioridades 1 traduzido para o português e alguns comentários meus sobre os casos.
A prioridade 1 possibilitará o uso do site por todos os grupos. Para alguns grupos, esse é um requisito básico para permitir seu acesso às informações.
* longdesc é um comando html para redirecionar para uma página com descrição da imagem quando o alt não for suficiente.
Dicas
Links
Sou publicitário, trabalho com internet desde 1999 com criação, desenvolvimento e arquitetura da informação.