eXaminator
Validador de Acessibilidade Web
acesso > Programa ACESSO da UMIC

Resultados do Validador eXaminator da UMIC – Agência para a Sociedade do Conhecimento, IP.

notas técnicas: validador eXaminator | índice web@x | logótipo dinâmico "Certified Accessibility".

Resultado:

C28: Especificar o tamanho de caixas de texto utilizando unidades 'em' | Técnicas para as WCAG 2.0

http://acesso.umic.pt/w3/TR/WCAG20-TECHS/C28.html

Resultado da análise de 181 elementos

Índice web@X (0-10): 10.0 (o índice deve ser usado apenas como referência dos responsáveis pelos conteúdos do sítio web)

Esta página passa a bateria de testes do eXaminator para as prioridades 1, 2 e 3 (conformidade "aaa")

Conformidade Testes ok / Testes aplicados
Testes de prioridade 1 1 / 1
Testes de prioridade 2 11 / 11
Testes de prioridade 3 2 / 2

Não deixe de rever manualmente as 8 ocorrências localizadas na página.


Testes de prioridade 1
Texto alternativo nas imagens.

OK Há 1 imagem(ns) e todas fazem uso do atributo "alt" para afixar a legenda. Deve verificar se os textos alternativos afixados se encontram correctos.
Cada imagem deve ter o atributo "alt" preenchido com uma legenda que explicite o conteúdo ou cumpra a função da mesma. Se a imagem é muito complexa, exigindo uma descrição mais longa, deve usar em adição o atributo "longdesc".

Forneça um equivalente textual para todo o elemento não textual. Pode ser feito através do atributo "alt", ou "longdesc" ou no conteúdo do elemento. (Prioridade 1) (Exemplo)

Testes de prioridade 2
Declaração do tipo de documento/Sintaxe.

OK Correcto! Há uma declaração do tipo de documento (DTD).
Uma DTD indica a sintaxe/gramática utilizada no código fonte da página e permite verificar a correcta aplicação desse código - validar a assertividade de escrita do código.

Crie documentos validando a notação com a gramática formal publicada. (Prioridade 2) (Exemplo)

Atributos obsoletos.

OK Correcto! Não se usam atributos obsoletos em HTML 4.01 ("hspace", "bgcolor" ou "nowrap", por exemplo).
Os atributos obsoletos são construções que foram descontinuadas e progressivamente substituídas por outras mais apropriados, nomeadamente através do uso de CSS, pelo que devem evitar-se, senão mesmo eliminar-se, por poderem provocar problemas de acessibilidade. Por outro lado, a sua utilização revela falta de actualização por parte do profissional Web que a realizou.

Evite o uso de notação obsoleta das tecnologias do W3C. (Prioridade 2) (Exemplo)

Destino dos links.

OK O objectivo de cada link parece estar claramente identificado.
Os links devem indicar de maneira muito clara e sucinta para onde apontam, de forma a que os utilizadores possam saber o que encontrarão se decidirem escolher esse link.

Identifique claramente o destino de cada link. (Prioridade 2) (Exemplo)

Elementos obsoletos.

OK Correcto! Não se usam elementos obsoletos em HTML 4.01 (<applet>, <center> ou <font>, por exemplo.
Os elementos obsoletos são construções que foram sendo substituídas por outras mais apropriadas e devem evitar-se porque podem provocar problemas de acessibilidade. Por outro lado, a sua utilização evidencia uma falta de actualização na área do desenho Web por parte do profissional que o realizou.

Evite o uso de notação obsoleta das tecnologias do W3C. (Prioridade 2) (Exemplo)

Utilização de tabelas para maquetar a página (tabela-layout).

OK Correcto! Não se usam tabelas para maquetar a página.
As tabelas são elementos para apresentar conteúdo tabular e não devem utilizar-se para apresentar outro tipo de conteúdo. Isto é especialmente importante para quem utiliza navegadores de base texto ou leitores que lêem linha a linha os dados existentes no ecrã.

Não deve usar tabelas para formatar páginas a não ser que a tabela faça sentido quando em formato linear. Caso contrário, se a tabela não fizer sentido, forneça um equivalente alternativo (o qual poderá ser uma versão linear). (Prioridade 2) (Exemplo)

Elementos HTML de apresentação.

OK Correcto! Não se usam elementos HTML de apresentação como <b>, <center> ou <font> para controlar a apresentação da página.
É incorrecto utilizar elementos da linguagem de programação (X)HTML para controlar a forma/estilo de apresentação da página. Use (X)HTML para estruturar/suportar o conteúdo e as folhas de estilo CSS para controlar o estilo da página.

Use folhas de estilo para controlar a disposição dos elementos na página e a forma de os apresentar. (Prioridade 2) (Exemplo)

Validação do código das folhas de estilo CSS.

OK Correcto! O código das CSS está correcto.
É importante evitar os erros de sintaxe das folhas de estilo para permitir a sua correcta interpretação.

Validator de CSS do W3C

Crie documentos validando a notação com a gramática formal publicada. (Prioridade 2) (Exemplo)

Atributos de apresentação.

OK Correcto! Não se usam atributos como "size", "color" ou "face" para controlar a apresentação da página.
É incorrecto utilizar atributos da linguagem de programação (X)HTML para controlar a forma/estilo de apresentação da página. Use (X)HTML para estruturar/suportar o conteúdo e as folhas de estilo CSS para controlar o estilo da página.

Use folhas de estilo para controlar a disposição dos elementos na página e a forma de os apresentar. (Prioridade 2) (Exemplo)

Utilização de CSS.

OK Correcto! Usam-se estilos para controlar a apresentação da página.
As folhas de estilo representam um grande passo em frente para a Web uma vez que a sua utilização permite separar o conteúdo da apresentação das páginas.

Use folhas de estilo para controlar a disposição dos elementos na página e a forma de os apresentar. (Prioridade 2) (Exemplo)

Utilização de medidas absolutas.

OK Correcto! Não se usam medidas absolutas.
Se se utilizam unidades de medida relativas, e não absolutas, os utilizadores poderão ampliar ou reduzir o tamanho dos elementos da página de acordo com as suas necessidades. Por outro lado, as páginas adequam-se a ecrãs com diferentes resoluções, redimensionando automaticamente os seus elementos.

Use unidades relativas em vez de absolutas nos valores dos atributos da linguagem de notação e valores das propriedades das folhas de estilo. (Prioridade 2) (Exemplo)

Utilização de cabeçalhos.

OK Correcto! Usam-se cabeçalhos (<h1>~<h6>).
Devem-se marcar correctamente os cabeçalhos da página e não mesclar os seus níveis aleatoriamente apenas para fazer uso dos estilos (tamanhos de fonte) que estão, por defeito, associados aos cabeçalhos. Use CSS para formatar a cor, o tamanho e o tipo de letra dos cabeçalhos. Actualmente eles constituem um importante elemento facilitador da navegação por todos aqueles que fazem uso de tecnologias de apoio.

Use os elementos cabeçalho (<H1>...<H6>) para transmitir a estrutura dos documentos e utilize-os de acordo com as especificações. (Prioridade 2) (Exemplo)

Validação do código (X)HTML.

O eXaminator não conseguiu estabelecer ligação ao validator de (X)HTML do W3C
É importante evitar os erros de sintaxe no código fonte para que a página seja correctamente interpretada pelos agentes de utilizador, nos quais se incluem as ajudas técnicas.

Validator de (X)HTML do W3C

Crie documentos validando a notação com a gramática formal publicada. (Prioridade 2) (Exemplo)

Testes de prioridade 3
Identificação do idioma principal da página.

OK Correcto! É especificado "pt-PT" como idioma principal. Verifique se o código se encontra correcto.
Em todas as páginas deve-se indicar o idioma principal do documento. Se o documento estiver em XHTML, dever-se-á verificar que, para além do atributo "lang", se utiliza também "xml:lang".

Identifique o idioma principal do documento. (Prioridade 3) (Exemplo)

Links adjacentes.

OK Correcto! Há 38 link(s) e todos estão separados por caracteres imprimíveis.
Alguns agentes de utilizador não conseguem diferenciar os links se estes se encontrarem colados uns aos outros, sem qualquer marca ou carácter imprimível não "linkado" a separá-los. Algo do tipo: link1 | link2 | link3, em que | é um carácter sem ligação.

Até que os agentes do utilizador consigam distinguir links adjacentes, inclua caracteres não-linkados, circundados por espaços, entre os links adjacentes. (Prioridade 3) (Exemplo)


Verificações manuais a empreender

Barreiras à acessibilidade (Testes de prioridade 1)
Mudanças de idioma ao longo da página.

OK Correcto! Identificam-se 6 mudanças de idioma ao longo da página.
Todos os conteúdos apresentados num idioma distinto ao da página e os links que apontem para recursos noutros idiomas, devem ser marcados indicando o idioma em que se encontram escritos.

Identifique claramente quaisquer alterações de idioma no texto de um documento, incluindo os equivalentes textuais (caso das legendas das imagens e de outros elementos). (Prioridade 1) (Exemplo)

Obstáculos à acessibilidade (Testes de prioridade 2)
Título da página.

OK A página tem um título que deve verificar manualmente. É o texto "C28: Especificar o tamanho de caixas de texto utilizando unidades 'em' | Técnicas para as WCAG 2.0" adequado como título para esta página?
Deve existir um título para a página, através do elemento <title>, e o mesmo deve ser claro, descritivo e conciso.

Forneça metadados para acrescentar informações semânticas às páginas e aos sítios Web. (Prioridade 2) (Exemplo)

Blocos de informação.

OK Há uma média de 12 palavras em cada bloco de informação.
Estruture e segmente correctamente os textos utilizando títulos, subtítulos, parágrafos e listas. Lembre-se que os blocos de informação demasiado grandes dificultam a sua compreensão.

Divida grandes blocos de informação em grupos mais geríveis e apropriados. (Prioridade 2) (Exemplo)

Versão (X)HTML.

OK Versão XHTML.
É importante usar as tecnologías do W3C quando as mesmas já se encontram disponíveis (alvo de recomendação final) e sejam suportadas, nomeadamente por um vasto leque de agentes de utilizador (navegadores Web, tecnologias de apoio, etc). Recomenda-se o uso das tecnologias do W3C, pela sua aceitação generalizada em todo o mundo e também pelo facto de as mesmas incorporarem as questões de acessibilidade desde a concepção.

Use tecnologias W3C quando a mesma esteja disponível e seja apropriada para uma tarefa. Utilize as versões mais recentes, desde que suportadas. (Prioridad 2) (Exemplo)

Ruídos à acessibilidade (Testes de prioridade 3)
Identificação de abreviaturas ou acrónimos.

OK Correcto! Foram localizados 5 abreviatura(s) ou acrónimo(s).
Quando um acrónimo aparece pela primeira vez na página ele deve ser apresentado da seguinte forma: A Unidade de Missão Inovação e Conhecimento (UMIC). Sempre que o acrónimo UMIC surgir dever-se-á usar o atributo "title" do elemento <acronym>. No caso das abreviaturas dever-se-á usar o atributo "title" do elemento <abbr>. Por exemplo: <abbr title="Avenida">Av.</abbr>.

Especifique por extenso cada abreviatura ou acrónimo quando da sua primeira ocorrência num documento. (Prioridade 3) (Exemplo)

Agrupar links.

Aviso 42% dos links estão organizados em listas (total de links: 38).
Devem-se proporcionar barras de navegação constituidas por listas de links para os agrupar, facilitando assim a sua localização. Lembre-se que as listas não se definem pelo seu aspecto gráfico mas pelo uso apropriado dos elementos <ol> (lista ordenada), <ul> (lista não ordenada) e <dl> (lista de definição).

Providencie barras de navegação para salientar e dar acesso aos mecanismos de navegação. De preferência faça uso de elementos de notação para listas (<ul>...<ol>) para estruturar esses mecanismos. Use CSS para lhes dar estilo. (Prioridade 3) (Exemplo)

Utilização de accesskey.

Aviso Não se utiliza o atributo "accesskey".
Os atalhos de teclado permitem, a quem utiliza o teclado para navegar, aceder rapidamente aos elementos mais importantes da página. É particularmente importante colocar uma tecla de atalho para acesso ao campo de edição do motor de busca.

Defina teclas de atalho para links importantes (incluíndo os que se encontram nos mapas de imagem client-side), controlos de formulário, e grupos de controlos de formulários. (Prioridade 3) (Exemplo)

Informação sobre documentos relacionados.

Aviso Não se proporciona informação sobre documentos relacionados (usando <link>, no cabeçalho da página por exemplo).
Os elementos <link> com atributos "rel" ou "rev" permitem dar informação acerca da relação entre a página actual e outros recursos.

Providencie informação sobre colecções de documentos (i.e. documentos compostos por múltiplas páginas). (Prioridade 3) (Exemplo)

Voltar

Tot:Array
(
    [?xml] => 1
    [total] => 181
    [utf-8] => 2
    [!doctype] => 1
    [dtd] => DTD XHTML 1.0 Transitional
    [xhtml] => 1
    [html] => 1
    [attr_lang] => 6
    [lang_pri] => pt-PT
    [lang_xml] => pt-PT
    [head] => 1
    [meta] => 1
    [attr_charset] => 1
    [title] => 1
    [title_pag] => C28: Especificar o tamanho de caixas de texto utilizando unidades 'em' | Técnicas para as WCAG 2.0
    [link] => 3
    [css] => 253
    [csscolor] => 44
    [body] => 1
    [div] => 24
    [total_body] => 171
    [p] => 23
    [a] => 38
    [enlaces] => 22
    [img] => 1
    [alt_img] => 1
    [content_page] => 789
    [anclas] => 7
    [ul] => 8
    [li] => 24
    [strong] => 13
    [attr_title] => 11
    [abbr] => 2
    [menu_bar] => 16
    [h1] => 1
    [h2] => 6
    [code] => 17
    [h3] => 6
    [pre] => 4
    [acronym] => 3
    [sup] => 1
    [elem_deprec] => 0
    [img_sin_alt] => 0
)
Resumen:Array
(
    [langs] => Array
        (
            [0] => 10
            [1] => 10
            [2] => 10
        )

    [img] => Array
        (
            [0] => 10
            [1] => 10
            [2] => 10
        )

    [titulo2] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [DTD] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [attr_deprec] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [enlaces_no_dif] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [bloques] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [elem_deprec] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [tablas] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [elem_pres] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [css_valid] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [attr_pres] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [hay_estilos] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [unidades_abs] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [heading] => Array
        (
            [0] => 8
            [1] => 10
            [2] => 8
        )

    [DTD_ver] => Array
        (
            [0] => 8
            [1] => 9
            [2] => 7.2
        )

    [abbr] => Array
        (
            [0] => 6
            [1] => 10
            [2] => 6
        )

    [lang_pri] => Array
        (
            [0] => 6
            [1] => 10
            [2] => 6
        )

    [a_adya] => Array
        (
            [0] => 6
            [1] => 10
            [2] => 6
        )

    [menu_bar] => Array
        (
            [0] => 6
            [1] => 6
            [2] => 3.6
        )

    [accesskey] => Array
        (
            [0] => 6
            [1] => 4
            [2] => 2.4
        )

    [link_rel] => Array
        (
            [0] => 6
            [1] => 4
            [2] => 2.4
        )

)

O índice web@X resulta da utilização do validador de Acessibilidade Web eXaminator.

Última actualização: 20 Setembro de 2009.
Programa ACESSO da UMIC - Agência para a Sociedade do Conhecimento, I.P.

Motor de Busca
Motor de Busca
Mapa do Sítio
Mapa do Sítio
Ajuda
Ajuda
Sugestão
Sugestão