Commit 065d7de54bf23fc3c3ea6d0969ee9cbd2e119fac
1 parent
023fb5a5
Exists in
master
and in
1 other branch
Fonte das tabelas, paragrafos h3, h2.
git-svn-id: https://svn.bento.ifrs.edu.br/default/ASES/ASES%20-%20Web/ASES%20-%20Web/Fontes/avaliador-web@10635 c2178572-b5ca-4887-91d2-9e3a90c7d55b
Showing
1 changed file
with
1055 additions
and
0 deletions
Show diff stats
src/main/webapp/WEB-INF/jsp/institucional/criteriosSucesso.jsp
0 → 100644
| ... | ... | @@ -0,0 +1,1055 @@ |
| 1 | +<%@page contentType="text/html" pageEncoding="UTF-8"%> | |
| 2 | +<%@taglib prefix="t" tagdir="/WEB-INF/tags"%> | |
| 3 | +<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> | |
| 4 | + | |
| 5 | + | |
| 6 | +<t:baseLayout> | |
| 7 | + <jsp:body> | |
| 8 | + | |
| 9 | + <div class="funcionalidades"> | |
| 10 | + <ul class="breadcrumb"> | |
| 11 | + <li> | |
| 12 | + <span>Você está em:</span> | |
| 13 | + </li> | |
| 14 | + <li> | |
| 15 | + <a href="${pageContext.request.contextPath}">Página Inicial</a> | |
| 16 | + </li> | |
| 17 | + <li>|</li> | |
| 18 | + <li>Critérios de Sucesso</li> | |
| 19 | + </ul> | |
| 20 | + </div> | |
| 21 | + | |
| 22 | + <div class="tile --NOVALUE--"> | |
| 23 | + <div class="outstanding-header"> | |
| 24 | + <h2 class="outstanding-title">Critérios de Avaliação</h2> | |
| 25 | + </div> | |
| 26 | + </div> | |
| 27 | + | |
| 28 | + <p class="criterios"> | |
| 29 | + As recomendações de acessibilidade foram desmembradas em critérios de avaliação. | |
| 30 | + Para cada critério de avaliação das recomendações foram estabelecidos parâmetros de acordo com a sua natureza.</p> | |
| 31 | + | |
| 32 | + | |
| 33 | + <hr class="hr_linhaDupla"> | |
| 34 | + <h3 class="subtitulo">Recomendação 1.1 - Respeitar os padrões Web</h3> | |
| 35 | + | |
| 36 | + <p class="criterios"> | |
| 37 | + Os padrões Web são recomendações do W3C (World Wide Web Consortium), as quais | |
| 38 | + são destinadas a orientar os desenvolvedores para o uso de boas práticas que tornam a | |
| 39 | + web acessivel para todos, permitindo assim que os desenvolvedores criem experiências | |
| 40 | + ricas, alimentadas por um vasto armazenamento de dados, os quais estão disponiveis | |
| 41 | + para qualquer dispositivo e compatíveis com atuais e futuros agentes de usuário (ex: navegadores).</p> | |
| 42 | + | |
| 43 | + | |
| 44 | + <table class="tabelaCriterioSucesso"> | |
| 45 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 1.1</caption> | |
| 46 | + <thead> | |
| 47 | + <tr> | |
| 48 | + <th id="numero_11" class="topo indice0">Número</th> | |
| 49 | + <th id="criterio_11" class="topo indice1">Critério</th> | |
| 50 | + <th id="como_avaliar_11" class="topo indice2">Como avaliar</th> | |
| 51 | + </tr> | |
| 52 | + </thead> | |
| 53 | + <tbody> | |
| 54 | + | |
| 55 | + <tr id="criterio_111"> | |
| 56 | + <td headers="numero_11" class="celula">1.1.1</td> | |
| 57 | + <td headers="criterio_11" class="celula">Não foram respeitados os Padrões Web CSS</td> | |
| 58 | + <td headers="como_avaliar_11" class="celula">Verificar relatório no anexo do documento de avaliação de erros e avisos apresentados pela ferramenta de avaliação de HTML do W3C: <a | |
| 59 | + href="https://validator.w3.org/nu/">https://validator.w3.org/nu/ (link para um novo sitio)</a>.</td> | |
| 60 | + </tr> | |
| 61 | + <tr id="criterio_112"> | |
| 62 | + <td headers="numero_11" class="celula">1.1.2</td> | |
| 63 | + <td headers="criterio_11" class="celula">Não foram respeitados os Padrões Web CSS</td> | |
| 64 | + <td headers="como_avaliar_11" class="celula">Verificar relatório no anexo do documento de avaliação de erros e avisos apresentados pela ferramenta da avaliação de HTML do W3C: <a | |
| 65 | + href="https://jigsaw.w3.org/css-validator/">https://jigsaw.w3.org/css-validator/ (link para um novo sitio)</a>.</td> | |
| 66 | + </tr> | |
| 67 | + <tr id="criterio_113"> | |
| 68 | + <td headers="numero_11" class="celula">1.1.3</td> | |
| 69 | + <td headers="criterio_11" class="celula">Presença de CSS(s) in-line</td> | |
| 70 | + <td headers="como_avaliar_11" class="celula">Verificar a presença do atributo "style" no código das páginas HTML.</td> | |
| 71 | + </tr> | |
| 72 | + <tr id="criterio_114"> | |
| 73 | + <td headers="numero_11" class="celula">1.1.4</td> | |
| 74 | + <td headers="criterio_11" class="celula">Presença de CSS(s) interno</td> | |
| 75 | + <td headers="como_avaliar_11" class="celula">Verificar a presença da tag HTML <style> no código das páginas HTML.</td> | |
| 76 | + </tr> | |
| 77 | + <tr id="criterio_115"> | |
| 78 | + <td headers="numero_11" class="celula">1.1.5</td> | |
| 79 | + <td headers="criterio_11" class="celula">Presença de javascript(s) in-line</td> | |
| 80 | + <td headers="como_avaliar_11" class="celula">Verificar a presença de código javascript dentro dos atributos de eventos no código HTML a serem avaliados: onload, onunload, onblur, onchange, onfocus, onsearch, onselect, onsubmit, onkeydown, onkeypress, onkeyup, onclick, ondblclick, onmousedown, onmousesemove, onmouseout, onmouseover, onmouseup, onmousewheel, oncopy, oncut, onpaste, onabort.</td> | |
| 81 | + </tr> | |
| 82 | + <tr id="criterio_116"> | |
| 83 | + <td headers="numero_11" class="celula">1.1.6</td> | |
| 84 | + <td headers="criterio_11" class="celula">Presença de javascript(s) interno</td> | |
| 85 | + <td headers="como_avaliar_11" class="celula">Verificar a presença de código javascript dentro da tag <script>.</td> | |
| 86 | + </tr> | |
| 87 | + </tbody> | |
| 88 | + </table> | |
| 89 | + | |
| 90 | + <h3 class="subtitulo">Recomendação 1.2 - Organizar o código HTML de forma lógica e semântica</h3> | |
| 91 | + <p class="criterios">O código HTML deve ser organizado de forma lógica e semântica, ou seja, apresentando os elementos em uma ordem compreensível e correspondendo ao conteúdo desejado. Cada elemento HTML deve ser utilizado para o fim que ele foi criado.</p> | |
| 92 | + | |
| 93 | + <table class="tabelaCriterioSucesso"> | |
| 94 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 1.2</caption> | |
| 95 | + <thead> | |
| 96 | + <tr> | |
| 97 | + <th id="numero_12" class="topo indice0">Número</th> | |
| 98 | + <th id="criterio_12" class="topo indice1">Critério</th> | |
| 99 | + <th id="como_avaliar_12" class="topo indice2">Como avaliar</th> | |
| 100 | + </tr> | |
| 101 | + </thead> | |
| 102 | + <tbody> | |
| 103 | + | |
| 104 | + <tr id="criterio_121"> | |
| 105 | + <td headers="numero_12" class="celula">1.2.1</td> | |
| 106 | + <td headers="criterio_12" class="celula">Presença de tags HTML sem atributo e conteúdo de texto</td> | |
| 107 | + <td headers="como_avaliar_12" class="celula">Verificar a presença de tags HTML que apresentem inicio e fechamento, mas sem conteúdo de texto. Possível exemplo seria <a></a> ou <div></div>.</td> | |
| 108 | + </tr> | |
| 109 | + <tr id="criterio_122"> | |
| 110 | + <td headers="numero_12" class="celula">1.2.2</td> | |
| 111 | + <td headers="criterio_12" class="celula">Elementos utilizados de forma não semântica</td> | |
| 112 | + <td headers="como_avaliar_12" class="celula">Verificar a presença de tags HTML com uso distinto da finalidade. Exemplo: tag <p> parágrafo sendo utilizada para simular quebra de linha, sendo a utilização correta a delimitação de texto.</td> | |
| 113 | + </tr> | |
| 114 | + </tbody> | |
| 115 | + </table> | |
| 116 | + | |
| 117 | + <h3 class="subtitulo">Recomendação 1.3 - Utilizar corretamente os níveis de cabeçalho</h3> | |
| 118 | + <p class="criterios">Os níveis de cabeçalho (elementos HTML H1 a H6) devem ser utilizados de forma hierárquica, pois organizam a ordem de importância e subordinação dos conteúdos, facilitando a leitura e compreensão.</p> | |
| 119 | + | |
| 120 | + <table class="tabelaCriterioSucesso"> | |
| 121 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 1.3</caption> | |
| 122 | + <thead> | |
| 123 | + <tr> | |
| 124 | + <th id="numero_13" class="topo indice0">Número</th> | |
| 125 | + <th id="criterio_13" class="topo indice1">Critério</th> | |
| 126 | + <th id="como_avaliar_13" class="topo indice2">Como avaliar</th> | |
| 127 | + </tr> | |
| 128 | + </thead> | |
| 129 | + <tbody> | |
| 130 | + | |
| 131 | + <tr id="criterio_131"> | |
| 132 | + <td headers="numero_13" class="celula">1.3.1</td> | |
| 133 | + <td headers="criterio_13" class="celula">Os niveis de título não foram utilizados</td> | |
| 134 | + <td headers="como_avaliar_13" class="celula">Verificar a ausência dos níveis de cabeçalho (<h1>, <h2>, <h3>, <h4>, <h5>, <h6>) nas páginas HTML.</td> | |
| 135 | + </tr> | |
| 136 | + <tr id="criterio_132"> | |
| 137 | + <td headers="numero_13" class="celula">1.3.2</td> | |
| 138 | + <td headers="criterio_13" class="celula">A hierarquia dos níveis de título está incorreta</td> | |
| 139 | + <td headers="como_avaliar_13" class="celula">Verificar a falta de ordem sequencial da presença de níveis de cabeçalho. Exemplo: a presença do nível <h3> depende do nível anterior <h2>.</td> | |
| 140 | + </tr> | |
| 141 | + <tr id="criterio_133"> | |
| 142 | + <td headers="numero_13" class="celula">1.3.3</td> | |
| 143 | + <td headers="criterio_13" class="celula">Foi utilizado somente o nível <h1></td> | |
| 144 | + <td headers="como_avaliar_13" class="celula">Verificar a presença do nível da cabeçalho <h1> sem categorizar outros assuntos da página em níveis de cabeçalho.</td> | |
| 145 | + </tr> | |
| 146 | + <tr id="criterio_134"> | |
| 147 | + <td headers="numero_13" class="celula">1.3.4</td> | |
| 148 | + <td headers="criterio_13" class="celula">Presença de mais de 1 cabeçalho</td> | |
| 149 | + <td headers="como_avaliar_13" class="celula">Verificar a presença de níveis de cabeçalho <h1> sendo utilizados de forma repetida.</td> | |
| 150 | + </tr> | |
| 151 | + </tbody> | |
| 152 | + </table> | |
| 153 | + | |
| 154 | + <h3 class="subtitulo">Recomendação 1.4 - Ordenar de forma lógica e intuitiva a leitura e tabulação</h3> | |
| 155 | + <p class="criterios">Deve-se criar o código HTML com uma sequência lógica de leitura para percorrer links, controles de formulários e objetos. Essa sequência é determinada pela ordem em que se encontra no código HTML.</p> | |
| 156 | + | |
| 157 | + <table class="tabelaCriterioSucesso"> | |
| 158 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 1.4</caption> | |
| 159 | + <thead> | |
| 160 | + <tr> | |
| 161 | + <th id="numero_14" class="topo indice0">Número</th> | |
| 162 | + <th id="criterio_14" class="topo indice1">Critério</th> | |
| 163 | + <th id="como_avaliar_14" class="topo indice2">Como avaliar</th> | |
| 164 | + </tr> | |
| 165 | + </thead> | |
| 166 | + <tbody> | |
| 167 | + | |
| 168 | + <tr id="criterio_141"> | |
| 169 | + <td headers="numero_14" class="celula">1.4.1</td> | |
| 170 | + <td headers="criterio_14" class="celula">O bloco de conteúdo não esta antes do bloco de menu no HTML</td> | |
| 171 | + <td headers="como_avaliar_14" class="celula">Verificar se a presença do código da página que representa o menu está posicionado depois do código que representa o conteúdo da página HTML.</td> | |
| 172 | + </tr> | |
| 173 | + <tr id="criterio_142"> | |
| 174 | + <td headers="numero_14" class="celula">1.4.2</td> | |
| 175 | + <td headers="criterio_14" class="celula">Presença do atributo "tabindex"</td> | |
| 176 | + <td headers="como_avaliar_14" class="celula">Verificar a presença de utilização do tabindex nas páginas HTML.</td> | |
| 177 | + </tr> | |
| 178 | + <tr id="criterio_143"> | |
| 179 | + <td headers="numero_14" class="celula">1.4.3</td> | |
| 180 | + <td headers="criterio_14" class="celula">Uso incorreto do "tabindex"</td> | |
| 181 | + <td headers="como_avaliar_14" class="celula">Verificar a presença do conteúdo -1 do atributo "tabindex" com o intuito de não influenciar a ordem do código da página, ou verificar se a presença de conteúdo do tabindex esta superior a 32767 e inferior a 0.</td> | |
| 182 | + </tr> | |
| 183 | + | |
| 184 | + </tbody> | |
| 185 | + </table> | |
| 186 | + | |
| 187 | + <h3 class="subtitulo">Recomendação 1.5 - Fornecer âncoras para ir direto a um bloco de conteúdo </h3> | |
| 188 | + <p class="criterios">Devem ser fornecidas âncoras, disponíveis na barra de acessibilidade, que apontem para links relevantes presentes na mesma página. Assim, é possivel ir ao bloco do conteúdo desejado. Os links devem ser colocados em lugares estratégicos da página, como no início e fim do conteúdo e início e fim do menu. É importante ressaltar que o primeiro link da página deve ser o: "ir para o conteúdo".</p> | |
| 189 | + | |
| 190 | + <table class="tabelaCriterioSucesso"> | |
| 191 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 1.5</caption> | |
| 192 | + <thead> | |
| 193 | + <tr> | |
| 194 | + <th id="numero_15" class="topo indice0">Número</th> | |
| 195 | + <th id="criterio_15" class="topo indice1">Critério</th> | |
| 196 | + <th id="como_avaliar_15" class="topo indice2">Como avaliar</th> | |
| 197 | + </tr> | |
| 198 | + </thead> | |
| 199 | + <tbody> | |
| 200 | + | |
| 201 | + <tr id="criterio_151"> | |
| 202 | + <td headers="numero_15" class="celula">1.5.1</td> | |
| 203 | + <td headers="criterio_15" class="celula">Não foram encontradas âncoras que permitam saltar pelas diferentes seções da página</td> | |
| 204 | + <td headers="como_avaliar_15" class="celula">Verificar a ausência de links com conteúdo do atributo "href" que comecem com "#".</td> | |
| 205 | + </tr> | |
| 206 | + <tr id="criterio_152"> | |
| 207 | + <td headers="numero_15" class="celula">1.5.2</td> | |
| 208 | + <td headers="criterio_15" class="celula">Foram encontradas âncoras que permitem saltar pelas diferentes seções da página, porém algumas não possuem um destino correspondente</td> | |
| 209 | + <td headers="como_avaliar_15" class="celula">Verificar a presença de links com conteúdo do atributo "href" que comecem com "#", porém não há o destino da âncora na página HTML.</td> | |
| 210 | + </tr> | |
| 211 | + <tr id="criterio_153"> | |
| 212 | + <td headers="numero_15" class="celula">1.5.3</td> | |
| 213 | + <td headers="criterio_15" class="celula">Não existem atalhos</td> | |
| 214 | + <td headers="como_avaliar_15" class="celula">Verificar a ausência de tags HTML com atributo "accesskey" na página.</td> | |
| 215 | + </tr> | |
| 216 | + <tr id="criterio_154"> | |
| 217 | + <td headers="numero_15" class="celula">1.5.4</td> | |
| 218 | + <td headers="criterio_15" class="celula">O primeiro link é uma âncora para o conteúdo da página</td> | |
| 219 | + <td headers="como_avaliar_15" class="celula">Verificar a presença de link com conteúdo do atributo "href" que comece com "#", e o destino da âncora seja um conteúdo específico da página HTML.</td> | |
| 220 | + </tr> | |
| 221 | + <tr id="criterio_155"> | |
| 222 | + <td headers="numero_15" class="celula">1.5.5</td> | |
| 223 | + <td headers="criterio_15" class="celula">O primeiro link é uma âncora válida para o conteúdo principal da página</td> | |
| 224 | + <td headers="como_avaliar_15" class="celula">Verificar a presença de link com conteúdo do atributo "href" que comece com "#", e o destino da âncora seja para o conteúdo principal da página HTML.</td> | |
| 225 | + </tr> | |
| 226 | + </tbody> | |
| 227 | + </table> | |
| 228 | + | |
| 229 | + <h3 class="subtitulo">Recomendação 1.6 - Não utilizar tabelas para diagramação</h3> | |
| 230 | + <p class="criterios">As tabelas devem ser utilizadas apenas para dados tabulares e não para efeitos de disposição dos elementos da página.</p> | |
| 231 | + | |
| 232 | + <table class="tabelaCriterioSucesso"> | |
| 233 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 1.6</caption> | |
| 234 | + <thead> | |
| 235 | + <tr> | |
| 236 | + <th id="numero_16" class="topo indice0">Número</th> | |
| 237 | + <th id="criterio_16" class="topo indice1">Critério</th> | |
| 238 | + <th id="como_avaliar_16" class="topo indice2">Como avaliar</th> | |
| 239 | + </tr> | |
| 240 | + </thead> | |
| 241 | + <tbody> | |
| 242 | + | |
| 243 | + <tr id="criterio_161"> | |
| 244 | + <td headers="numero_16" class="celula">1.6.1</td> | |
| 245 | + <td headers="criterio_16" class="celula">Foram utizadas tabelas</td> | |
| 246 | + <td headers="como_avaliar_16" class="celula">Verificar a presença da tag <table> na página HTML.</td> | |
| 247 | + </tr> | |
| 248 | + | |
| 249 | + <tr id="criterio_162"> | |
| 250 | + <td headers="numero_16" class="celula">1.6.2</td> | |
| 251 | + <td headers="criterio_16" class="celula">Há formulário construído dentro de tabela</td> | |
| 252 | + <td headers="como_avaliar_16" class="celula">Verificar a presença da tag <form> entre a tag <table>.</td> | |
| 253 | + </tr> | |
| 254 | + </tbody> | |
| 255 | + </table> | |
| 256 | + | |
| 257 | + <h3 class="subtitulo">Recomendação 1.7 - Separar links adjacentes</h3> | |
| 258 | + <p class="criterios">Links adjacentes devem ser separados por mais do que simples espaços, para que não fiquem confusos, em especial para usuários que utilizam leitor de tela. Para isso, é recomendado o uso de listas, onde cada elemento dentro da lista é um link. As listas podem ser estilizadas visualmente com CSS para que os itens sejam mostrados da maneira desejada, como um ao lado do outro.</p> | |
| 259 | + | |
| 260 | + <table class="tabelaCriterioSucesso"> | |
| 261 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 1.7</caption> | |
| 262 | + <thead> | |
| 263 | + <tr> | |
| 264 | + <th id="numero_17" class="topo indice0">Número</th> | |
| 265 | + <th id="criterio_17" class="topo indice1">Critério</th> | |
| 266 | + <th id="como_avaliar_17" class="topo indice2">Como avaliar</th> | |
| 267 | + </tr> | |
| 268 | + </thead> | |
| 269 | + <tbody> | |
| 270 | + | |
| 271 | + <tr id="criterio_171"> | |
| 272 | + <td headers="numero_17" class="celula">1.7.1</td> | |
| 273 | + <td headers="criterio_17" class="celula">Há links adjacentes sem nenhum tipo de separação ou separação por espaços em branco</td> | |
| 274 | + <td headers="como_avaliar_17" class="celula">Verificar a presença de links dispostos numa forma sequencial sem separação explicita (caracteres especiais) ou separação explicita por espaços em branco.</td> | |
| 275 | + </tr> | |
| 276 | + | |
| 277 | + | |
| 278 | + </tbody> | |
| 279 | + </table> | |
| 280 | + | |
| 281 | + <h3 class="subtitulo">Recomendação 1.8 - Dividir as áreas de informação</h3> | |
| 282 | + <p class="criterios">Áreas de informação devem ser divididas em grupos fáceis de gerenciar. As divisões mais comuns são: "topo", "conteúdo", "menu" e "rodapé". Nas páginas internas deve-se manter uma mesma divisão para que o usuário se familiarize mais rapidamente com a estrutura do sítio. É importante destacar, entretanto, que a página inicial pode ter uma divisão diferente das páginas internas, pois ela normalmente contém mais elementos.</p> | |
| 283 | + | |
| 284 | + <table class="tabelaCriterioSucesso"> | |
| 285 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 1.8</caption> | |
| 286 | + <thead> | |
| 287 | + <tr> | |
| 288 | + <th id="numero_18" class="topo indice0">Número</th> | |
| 289 | + <th id="criterio_18" class="topo indice1">Critério</th> | |
| 290 | + <th id="como_avaliar_18" class="topo indice2">Como avaliar</th> | |
| 291 | + </tr> | |
| 292 | + </thead> | |
| 293 | + <tbody> | |
| 294 | + | |
| 295 | + <tr id="criterio_181"> | |
| 296 | + <td headers="numero_18" class="celula">1.8.1</td> | |
| 297 | + <td headers="criterio_18" class="celula">Ausência de divisão de áreas quando do uso HTML 5</td> | |
| 298 | + <td headers="como_avaliar_18" class="celula">Verificar a ausência das tags: <header>, <footer>, <section>, <aside>, <nav> e <article>.</td> | |
| 299 | + </tr> | |
| 300 | + | |
| 301 | + <tr id="criterio_182"> | |
| 302 | + <td headers="numero_18" class="celula">1.8.2</td> | |
| 303 | + <td headers="criterio_18" class="celula">Ausência de divisão de áreas quando do uso de LANDMARKS de HTML</td> | |
| 304 | + <td headers="como_avaliar_18" class="celula">Verificar a ausência do atributo "role" nas tags HTML com os conteúdos: "banner", "complementary", "contentinfo", "main", "navigation" e "search".</td> | |
| 305 | + </tr> | |
| 306 | + | |
| 307 | + | |
| 308 | + </tbody> | |
| 309 | + </table> | |
| 310 | + | |
| 311 | + <h3 class="subtitulo">Recomendação 1.9 - Não abrir novas instâncias sem a solicitação do usuário</h3> | |
| 312 | + <p class="criterios">A decisão de utilizar-se de novas instâncias - por exemplo abas ou janelas - para acesso a páginas, serviços ou qualquer informação, deve ser de escolha do usuário.</p> | |
| 313 | + | |
| 314 | + <table class="tabelaCriterioSucesso"> | |
| 315 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 1.9</caption> | |
| 316 | + <thead> | |
| 317 | + <tr> | |
| 318 | + <th id="numero_19" class="topo indice0">Número</th> | |
| 319 | + <th id="criterio_19" class="topo indice1">Critério</th> | |
| 320 | + <th id="como_avaliar_19" class="topo indice2">Como avaliar</th> | |
| 321 | + </tr> | |
| 322 | + </thead> | |
| 323 | + <tbody> | |
| 324 | + | |
| 325 | + <tr id="criterio_191"> | |
| 326 | + <td headers="numero_19" class="celula">1.9.1</td> | |
| 327 | + <td headers="criterio_19" class="celula">Há link que abre nova página ou aba</td> | |
| 328 | + <td headers="como_avaliar_19" class="celula">Verificar a presença de links com atributo "target" preenchido com "_blank".</td> | |
| 329 | + </tr> | |
| 330 | + | |
| 331 | + </tbody> | |
| 332 | + </table> | |
| 333 | + | |
| 334 | + <h3 class="subtitulo">Recomendação 2.1 - Disponibilizar todas as funções da página via teclado</h3> | |
| 335 | + <p class="criterios">Todas as funções da página que utilizam linguagens de script (javascript) devem ser programadas, primeiramente, para o uso com o teclado. O foco não deverá estar bloqueado ou fixado em um elemento da página, para que o usuário possa mover-se pelo teclado por todos os elementos. Isso inclui movimentação em janelas modais (abertura de janela de dialogo que bloqueia qualquer interação com a janela principal). </p> | |
| 336 | + | |
| 337 | + <table class="tabelaCriterioSucesso"> | |
| 338 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 2.1</caption> | |
| 339 | + <thead> | |
| 340 | + <tr> | |
| 341 | + <th id="numero_21" class="topo indice0">Número</th> | |
| 342 | + <th id="criterio_21" class="topo indice1">Critério</th> | |
| 343 | + <th id="como_avaliar_21" class="topo indice2">Como avaliar</th> | |
| 344 | + </tr> | |
| 345 | + </thead> | |
| 346 | + <tbody> | |
| 347 | + | |
| 348 | + <tr id="criterio_211"> | |
| 349 | + <td headers="numero_21" class="celula">2.1.1</td> | |
| 350 | + <td headers="criterio_21" class="celula">Há funcionalidade que só funciona pelo mouse usuário</td> | |
| 351 | + <td headers="como_avaliar_21" class="celula">Verificar a presença dos eventos nas tags HTML (onmousedown, onmouseup, onmouseover, onmouseout) e a ausência de evento para permitir a manipulação por teclado.</td> | |
| 352 | + </tr> | |
| 353 | + | |
| 354 | + <tr id="criterio_212"> | |
| 355 | + <td headers="numero_21" class="celula">2.1.2</td> | |
| 356 | + <td headers="criterio_21" class="celula"> Presença de eventos associados a elementos não interativos</td> | |
| 357 | + <td headers="como_avaliar_21" class="celula">Verificar a presença de eventos HTML a elementos estáticos da página HTML. Um exemplo é a presença de mudança de contexto no nível de cabeçalho.</td> | |
| 358 | + </tr> | |
| 359 | + </tbody> | |
| 360 | + </table> | |
| 361 | + | |
| 362 | + <h3 class="subtitulo">Recomendação 2.2 - Garantir que os objetos programáveis sejam acessíveis</h3> | |
| 363 | + <p class="criterios">Deve-se garantir que scripts, conteúdos dinâmicos e outros elementos programáveis sejam acessíveis e que seja possível sua execução via navegação.</p> | |
| 364 | + | |
| 365 | + <table class="tabelaCriterioSucesso"> | |
| 366 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 2.2</caption> | |
| 367 | + <thead> | |
| 368 | + <tr> | |
| 369 | + <th id="numero_22" class="topo indice0">Número</th> | |
| 370 | + <th id="criterio_22" class="topo indice1">Critério</th> | |
| 371 | + <th id="como_avaliar_22" class="topo indice2">Como avaliar</th> | |
| 372 | + </tr> | |
| 373 | + </thead> | |
| 374 | + <tbody> | |
| 375 | + | |
| 376 | + <tr id="criterio_221"> | |
| 377 | + <td headers="numero_22" class="celula">2.2.1</td> | |
| 378 | + <td headers="criterio_22" class="celula">Presença de elemento SCRIPT sem o elemento NOSCRIPT</td> | |
| 379 | + <td headers="como_avaliar_22" class="celula">Verificar a presença do elemento <script> sem o elemento <noscript> na página.</td> | |
| 380 | + </tr> | |
| 381 | + <tr id="criterio_222"> | |
| 382 | + <td headers="numero_22" class="celula">2.2.2</td> | |
| 383 | + <td headers="criterio_22" class="celula">Presença de elemento OBJECT sem o conteúdo alternativo</td> | |
| 384 | + <td headers="como_avaliar_22" class="celula">Verificar a presença do elemento <object> sem texto entre os elementos. Exemplo: <object> Digite aqui o texto alternativo </object>.</td> | |
| 385 | + </tr> | |
| 386 | + | |
| 387 | + <tr id="criterio_223"> | |
| 388 | + <td headers="numero_22" class="celula">2.2.3</td> | |
| 389 | + <td headers="criterio_22" class="celula">Presença de elemento EMBED na página HTML</td> | |
| 390 | + <td headers="como_avaliar_22" class="celula">Verificar a presença do elemento <embed> sem texto entre os elementos. Exemplo: <embed> Digite aqui o texto alternativo </embed>.</td> | |
| 391 | + </tr> | |
| 392 | + | |
| 393 | + <tr id="criterio_224"> | |
| 394 | + <td headers="numero_22" class="celula">2.2.4</td> | |
| 395 | + <td headers="criterio_22" class="celula">Presença de elemento APPLET na página HTML</td> | |
| 396 | + <td headers="como_avaliar_22" class="celula">Verificar a presença do elemento <applet> sem texto entre os elementos. Exemplo:<applet> Digite aqui o texto alternativo </applet>.</td> | |
| 397 | + </tr> | |
| 398 | + </tbody> | |
| 399 | + </table> | |
| 400 | + | |
| 401 | + <h3 class="subtitulo">Recomendação 2.3 - Não criar páginas com atualização automática periódica</h3> | |
| 402 | + <p class="criterios">A atualização automática periódica tira do usuário a autonomia em relação à escolha (semelhante a abertura de novas instâncias em navegadores) e podem confundir e desorientar os usuários, especialmente usuários que utilizam leitores de tela.</p> | |
| 403 | + | |
| 404 | + <table class="tabelaCriterioSucesso"> | |
| 405 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 2.3</caption> | |
| 406 | + <thead> | |
| 407 | + <tr> | |
| 408 | + <th id="numero_23" class="topo indice0">Número</th> | |
| 409 | + <th id="criterio_23" class="topo indice1">Critério</th> | |
| 410 | + <th id="como_avaliar_23" class="topo indice2">Como avaliar</th> | |
| 411 | + </tr> | |
| 412 | + </thead> | |
| 413 | + <tbody> | |
| 414 | + | |
| 415 | + <tr id="criterio_231"> | |
| 416 | + <td headers="numero_23" class="celula">2.3.1</td> | |
| 417 | + <td headers="criterio_23" class="celula">Página que se atualiza automaticamente</td> | |
| 418 | + <td headers="como_avaliar_23" class="celula">Verificar a presença do elemento <meta> e o atributo "HTTP-EQUIV" com o conteúdo "refresh" ou a presença das funções javascript: setTimeout() e setInterval() com a função para carregar a mesma página.</td> | |
| 419 | + </tr> | |
| 420 | + | |
| 421 | + | |
| 422 | + </tbody> | |
| 423 | + </table> | |
| 424 | + | |
| 425 | + <h3 class="subtitulo">Recomendação 2.4 - Não utilizar o redirecionamento automático de páginas</h3> | |
| 426 | + <p class="criterios">Não devem ser utilizadas marcações para redirecionar a uma nova página, porque tira do usuário a autonomia em relação à escolha (semelhante a abertura de novas instâncias em navegadores) e podem confundir e desorientar os usuários, especialmente usuários que utilizam leitores de tela.</p> | |
| 427 | + | |
| 428 | + <table class="tabelaCriterioSucesso"> | |
| 429 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 2.4</caption> | |
| 430 | + <thead> | |
| 431 | + <tr> | |
| 432 | + <th id="numero_24" class="topo indice0">Número</th> | |
| 433 | + <th id="criterio_24" class="topo indice1">Critério</th> | |
| 434 | + <th id="como_avaliar_24" class="topo indice2">Como avaliar</th> | |
| 435 | + </tr> | |
| 436 | + </thead> | |
| 437 | + <tbody> | |
| 438 | + | |
| 439 | + <tr id="criterio_241"> | |
| 440 | + <td headers="numero_24" class="celula">2.4.1</td> | |
| 441 | + <td headers="criterio_24" class="celula">Há redirecionamento automático</td> | |
| 442 | + <td headers="como_avaliar_24" class="celula">Verificar a presença do elemento <meta> e atributo "HTTP-EQUIV" com conteúdo "refresh" e atributo "content" ou a presença do elemento <script> com a função "window.location".</td> | |
| 443 | + </tr> | |
| 444 | + | |
| 445 | + | |
| 446 | + </tbody> | |
| 447 | + </table> | |
| 448 | + | |
| 449 | + <h3 class="subtitulo">Recomendação 2.6 - Não incluir situações com intermitência de tela</h3> | |
| 450 | + <p class="criterios">Não devem ser utilizados efeitos visuais piscantes, intermitentes ou cintilantes. Em pessoas com epilepsia fotosensitiva, o cintilar ou piscar podem desencadear um ataque epilético. A exigência dessa diretriz aplica-se também para a propaganda de terceiros inserida na página.</p> | |
| 451 | + | |
| 452 | + <table class="tabelaCriterioSucesso"> | |
| 453 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 2.6</caption> | |
| 454 | + <thead> | |
| 455 | + <tr> | |
| 456 | + <th id="numero_26" class="topo indice0">Número</th> | |
| 457 | + <th id="criterio_26" class="topo indice1">Critério</th> | |
| 458 | + <th id="como_avaliar_26" class="topo indice2">Como avaliar</th> | |
| 459 | + </tr> | |
| 460 | + </thead> | |
| 461 | + <tbody> | |
| 462 | + | |
| 463 | + <tr id="criterio_261"> | |
| 464 | + <td headers="numero_26" class="celula">2.6.1</td> | |
| 465 | + <td headers="criterio_26" class="celula">Presença do elemento BLINK</td> | |
| 466 | + <td headers="como_avaliar_26" class="celula">Presença do elemento <blink> na página HTML.</td> | |
| 467 | + </tr> | |
| 468 | + | |
| 469 | + <tr id="criterio_262"> | |
| 470 | + <td headers="numero_26" class="celula">2.6.2</td> | |
| 471 | + <td headers="criterio_26" class="celula">Presença do elemento MARQUEE</td> | |
| 472 | + <td headers="como_avaliar_26" class="celula">Presença do elemento <marquee> na página HTML.</td> | |
| 473 | + </tr> | |
| 474 | + | |
| 475 | + <tr id="criterio_263"> | |
| 476 | + <td headers="numero_26" class="celula">2.6.3</td> | |
| 477 | + <td headers="criterio_26" class="celula">Presença do elemento IMG com arquivo GIF com intermitência de tela</td> | |
| 478 | + <td headers="como_avaliar_26" class="celula">Presença do elemento <img> e atributo "src" contendo arquivo com extensão "gif" e o arquivo apresenta movimentação.</td> | |
| 479 | + </tr> | |
| 480 | + </tbody> | |
| 481 | + </table> | |
| 482 | + | |
| 483 | + <h3 class="subtitulo">Recomendação 3.1 - Identificar o idioma principal da página</h3> | |
| 484 | + <p class="criterios">Deve-se identificar o principal idioma utilizado nos documentos e páginas HTML.</p> | |
| 485 | + | |
| 486 | + <table class="tabelaCriterioSucesso"> | |
| 487 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 3.1</caption> | |
| 488 | + <thead> | |
| 489 | + <tr> | |
| 490 | + <th id="numero_31" class="topo indice0">Número</th> | |
| 491 | + <th id="criterio_31" class="topo indice1">Critério</th> | |
| 492 | + <th id="como_avaliar_31" class="topo indice2">Como avaliar</th> | |
| 493 | + </tr> | |
| 494 | + </thead> | |
| 495 | + <tbody> | |
| 496 | + | |
| 497 | + <tr id="criterio_311"> | |
| 498 | + <td headers="numero_31" class="celula">3.1.1</td> | |
| 499 | + <td headers="criterio_31" class="celula">Não há identificação do idioma principal da página</td> | |
| 500 | + <td headers="como_avaliar_31" class="celula">Verificar a ausência do atributo "lang" no elemento <html>, quando o elemento <doctype> for do tipo Strict (<a | |
| 501 | + href="http://www.w3.org/TR/html4/strict.dtd">http://www.w3.org/TR/html4/strict.dtd</a>), Transitional (<a | |
| 502 | + href="http://www.w3.org/TR/html4/loose.dtd">http://www.w3.org/TR/html4/loose.dtd</a>), Frameset (<a | |
| 503 | + href="http://www.w3.org/TR/html4/frameset.dtd">http://www.w3.org/TR/html4/frameset.dtd</a>), linguagem HTML 5, ou verificar a não presença do atributo "xml:lang", quando o elemento <doctype> for do tipo Strict (<a | |
| 504 | + href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd</a>), frameset (<a | |
| 505 | + href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd</a>), xhtml 1.1 (<a | |
| 506 | + href="http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd</a>), transitional (<a | |
| 507 | + href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>).</td> | |
| 508 | + </tr> | |
| 509 | + | |
| 510 | + <tr id="criterio_312"> | |
| 511 | + <td headers="numero_31" class="celula">3.1.2</td> | |
| 512 | + <td headers="criterio_31" class="celula">Presença do elemento HTML, atributo XMLNS, atributo XML;LANG e a ausência do atributo LANG</td> | |
| 513 | + <td headers="como_avaliar_31" class="celula">Verificar a presença dos atributos "xmlns" e "xml-lang" e a ausência do atributo "lang".</td> | |
| 514 | + </tr> | |
| 515 | + | |
| 516 | + | |
| 517 | + </tbody> | |
| 518 | + </table> | |
| 519 | + | |
| 520 | + <h3 class="subtitulo">Recomendação 3.2 - Informar a mudança de idioma no conteúdo</h3> | |
| 521 | + <p class="criterios">Se algum elemento de uma página possuir conteúdo em um idioma diferente do principal, este deverá estar identificado.</p> | |
| 522 | + | |
| 523 | + <table class="tabelaCriterioSucesso"> | |
| 524 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 3.2</caption> | |
| 525 | + <thead> | |
| 526 | + <tr> | |
| 527 | + <th id="numero_32" class="topo indice0">Número</th> | |
| 528 | + <th id="criterio_32" class="topo indice1">Critério</th> | |
| 529 | + <th id="como_avaliar_32" class="topo indice2">Como avaliar</th> | |
| 530 | + </tr> | |
| 531 | + </thead> | |
| 532 | + <tbody> | |
| 533 | + | |
| 534 | + <tr id="criterio_321"> | |
| 535 | + <td headers="numero_32" class="celula">3.2.1</td> | |
| 536 | + <td headers="criterio_32" class="celula">Presença de atributo LANG nos elementos da página, além da tag HTML</td> | |
| 537 | + <td headers="como_avaliar_32" class="celula">Verificar a presença do atributo "lang" nos elementos da página html, não considerando o elemento <html>.</td> </tr> | |
| 538 | + | |
| 539 | + | |
| 540 | + </tbody> | |
| 541 | + </table> | |
| 542 | + | |
| 543 | + <h3 class="subtitulo">Recomendação 3.3 - Oferecer um título descritivo e informativo à página</h3> | |
| 544 | + <p class="criterios">O título da página deve ser descritivo e informativo, devendo representar o conteúdo principal da página, já que essa informação será a primeira a ser lida pelo leitor de tela, quando o usuário acessar a página.</p> | |
| 545 | + | |
| 546 | + <table class="tabelaCriterioSucesso"> | |
| 547 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 3.3</caption> | |
| 548 | + <thead> | |
| 549 | + <tr> | |
| 550 | + <th id="numero_33" class="topo indice0">Número</th> | |
| 551 | + <th id="criterio_33" class="topo indice1">Critério</th> | |
| 552 | + <th id="como_avaliar_33" class="topo indice2">Como avaliar</th> | |
| 553 | + </tr> | |
| 554 | + </thead> | |
| 555 | + <tbody> | |
| 556 | + | |
| 557 | + <tr id="criterio_331"> | |
| 558 | + <td headers="numero_33" class="celula">3.3.1</td> | |
| 559 | + <td headers="criterio_33" class="celula">Não há título para a página, ou está em branco</td> | |
| 560 | + <td headers="como_avaliar_33" class="celula">Verificar a ausência da tag <title> na página HTML, ou verificar a presença do tag <title> sem conteúdo de texto para a identificação da página.</td> | |
| 561 | + </tr> | |
| 562 | + | |
| 563 | + </tbody> | |
| 564 | + </table> | |
| 565 | + | |
| 566 | + <h3 class="subtitulo">Recomendação 3.5 - Descrever links clara e sucintamente</h3> | |
| 567 | + <p class="criterios">Deve-se identificar claramente o destino da cada link, informando, inclusive, se o link remete a outro sítio. Além disso, é preciso que o texto do link faça sentido mesmo quando isolado do contexto da página.</p> | |
| 568 | + | |
| 569 | + <table class="tabelaCriterioSucesso"> | |
| 570 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 3.5</caption> | |
| 571 | + <thead> | |
| 572 | + <tr> | |
| 573 | + <th id="numero_35" class="topo indice0">Número</th> | |
| 574 | + <th id="criterio_35" class="topo indice1">Critério</th> | |
| 575 | + <th id="como_avaliar_35" class="topo indice2">Como avaliar</th> | |
| 576 | + </tr> | |
| 577 | + </thead> | |
| 578 | + <tbody> | |
| 579 | + | |
| 580 | + <tr id="criterio_351"> | |
| 581 | + <td headers="numero_35" class="celula">3.5.1</td> | |
| 582 | + <td headers="criterio_35" class="celula">Link com descrição no formato de URL</td> | |
| 583 | + <td headers="como_avaliar_35" class="celula"> Presença do elemento <a> e descrição do texto em formato de endereço texto da internet. Lembrar que não importará se o link do texto será igual ou não presente no atributo "href".</td> | |
| 584 | + </tr> | |
| 585 | + | |
| 586 | + <tr id="criterio_352"> | |
| 587 | + <td headers="numero_35" class="celula">3.5.2</td> | |
| 588 | + <td headers="criterio_35" class="celula">Links vazios</td> | |
| 589 | + <td headers="como_avaliar_35" class="celula">Presença do elemento <a> e ausência de texto descritivo.</td> | |
| 590 | + </tr> | |
| 591 | + | |
| 592 | + <tr id="criterio_353"> | |
| 593 | + <td headers="numero_35" class="celula">3.5.3</td> | |
| 594 | + <td headers="criterio_35" class="celula">Link com descrição somente do TITLE</td> | |
| 595 | + <td headers="como_avaliar_35" class="celula">Presença do elemento <a>, atributo "title" com texto descritivo e ausência de texto descritivo na estrutura principal do link.</td> | |
| 596 | + </tr> | |
| 597 | + | |
| 598 | + <tr id="criterio_354"> | |
| 599 | + <td headers="numero_35" class="celula">3.5.4</td> | |
| 600 | + <td headers="criterio_35" class="celula">Links que são imagens sem descrição</td> | |
| 601 | + <td headers="como_avaliar_35" class="celula">Presença do elemento <a> e dentro o elemento <img> sem conteúdo descritivo no atributo "alt".</td> | |
| 602 | + </tr> | |
| 603 | + | |
| 604 | + <tr id="criterio_355"> | |
| 605 | + <td headers="numero_35" class="celula">3.5.5</td> | |
| 606 | + <td headers="criterio_35" class="celula">Links do tipo "clique aqui", "leia mais", "veja mais", "veja aqui", "clique", "acesse aqui", "clique para acessar", "aqui", entre outros</td> | |
| 607 | + <td headers="como_avaliar_35" class="celula">Presença do elemento <a> e de texto descritivo com as palavras exatas ou palavras começando no texto do inicio do link: "clique aqui", "leia mais", "veja aqui", "veja mais", "veja aqui", "clique", "acesse aqui", "clique para acessar", "aqui".</td> | |
| 608 | + </tr> | |
| 609 | + | |
| 610 | + <tr id="criterio_356"> | |
| 611 | + <td headers="numero_35" class="celula">3.5.6</td> | |
| 612 | + <td headers="criterio_35" class="celula">Links com descrições diferentes que remetem ao mesmo local</td> | |
| 613 | + <td headers="como_avaliar_35" class="celula">Presença do elemento <a> com texto descritivo diferente, porém os conteúdos dos href's remetem para o mesmo link.</td> | |
| 614 | + </tr> | |
| 615 | + | |
| 616 | + <tr id="criterio_357"> | |
| 617 | + <td headers="numero_35" class="celula">3.5.7</td> | |
| 618 | + <td headers="criterio_35" class="celula">Links com a mesma descrição que remetem a locais diferentes</td> | |
| 619 | + <td headers="como_avaliar_35" class="celula">Presença do elemento <a> com texto descritivo igual, porém os conteúdos dos href's remetem para links diferentes.</td> | |
| 620 | + </tr> | |
| 621 | + | |
| 622 | + <tr id="criterio_358"> | |
| 623 | + <td headers="numero_35" class="celula">3.5.8</td> | |
| 624 | + <td headers="criterio_35" class="celula">Links que são lidos duas ou mais vezes</td> | |
| 625 | + <td headers="como_avaliar_35" class="celula">Presença do elemento <a> com o mesmo conteúdo descritivo em locais distintos da página HTML.</td> | |
| 626 | + </tr> | |
| 627 | + | |
| 628 | + <tr id="criterio_359"> | |
| 629 | + <td headers="numero_35" class="celula">3.5.9</td> | |
| 630 | + <td headers="criterio_35" class="celula">Links com descrição muito longa</td> | |
| 631 | + <td headers="como_avaliar_35" class="celula">Presença do elemento <a> com conteúdo do texto descrito com quantidade de caracteres acima de 2000.</td> | |
| 632 | + </tr> | |
| 633 | + | |
| 634 | + <tr id="criterio_3510"> | |
| 635 | + <td headers="numero_35" class="celula">3.5.10</td> | |
| 636 | + <td headers="criterio_35" class="celula">Links que remetem a páginas indisponiveis/inexistentes (links quebrados)</td> | |
| 637 | + <td headers="como_avaliar_35" class="celula">Presença do elemento <a> e o conteúdo do atributo "href" direciona para páginas de erros: 404, 405, 503 e outros.</td> | |
| 638 | + </tr> | |
| 639 | + </tbody> | |
| 640 | + </table> | |
| 641 | + | |
| 642 | + <h3 class="subtitulo">Recomendação 3.6 - Fornecer alternativa em texto para as imagens do sítio</h3> | |
| 643 | + <p class="criterios">Deve ser fornecida uma descrição para as imagens da página.</p> | |
| 644 | + | |
| 645 | + <table class="tabelaCriterioSucesso"> | |
| 646 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 3.6</caption> | |
| 647 | + <thead> | |
| 648 | + <tr> | |
| 649 | + <th id="numero_36" class="topo indice0">Número</th> | |
| 650 | + <th id="criterio_36" class="topo indice1">Critério</th> | |
| 651 | + <th id="como_avaliar_36" class="topo indice2">Como avaliar</th> | |
| 652 | + </tr> | |
| 653 | + </thead> | |
| 654 | + <tbody> | |
| 655 | + | |
| 656 | + <tr id="criterio_361"> | |
| 657 | + <td headers="numero_36" class="celula">3.6.1</td> | |
| 658 | + <td headers="criterio_36" class="celula">Imagens sem a declaração do atributo ALT</td> | |
| 659 | + <td headers="como_avaliar_36" class="celula">Presença de elementos <img> e ausência do atributo "alt".</td> | |
| 660 | + </tr> | |
| 661 | + | |
| 662 | + <tr id="criterio_362"> | |
| 663 | + <td headers="numero_36" class="celula">3.6.2</td> | |
| 664 | + <td headers="criterio_36" class="celula">Imagens com conteúdo sem descrição</td> | |
| 665 | + <td headers="como_avaliar_36" class="celula">Presença de elementos <img> e ausência de conteúdo descritivo do atributo "alt".</td> | |
| 666 | + </tr> | |
| 667 | + | |
| 668 | + <tr id="criterio_363"> | |
| 669 | + <td headers="numero_36" class="celula">3.6.3</td> | |
| 670 | + <td headers="criterio_36" class="celula">Imagens com descrição igual ao nome do arquivo</td> | |
| 671 | + <td headers="como_avaliar_36" class="celula">Presença de elementos <img> e atributo "alt" com conteúdo descrito com o nome do arquivo de referência da imagem.</td> | |
| 672 | + </tr> | |
| 673 | + | |
| 674 | + <tr id="criterio_364"> | |
| 675 | + <td headers="numero_36" class="celula">3.6.4</td> | |
| 676 | + <td headers="criterio_36" class="celula">Imagens com descrição comum</td> | |
| 677 | + <td headers="como_avaliar_36" class="celula">Presença de elementos <img> e atributo "alt" com conteúdo descrito com expressões: "figura"; "imagem"; "alt"; conteúdo em branco e outros.</td> | |
| 678 | + </tr> | |
| 679 | + | |
| 680 | + <tr id="criterio_365"> | |
| 681 | + <td headers="numero_36" class="celula">3.6.5</td> | |
| 682 | + <td headers="criterio_36" class="celula">Imagens diferentes com a mesma descrição</td> | |
| 683 | + <td headers="como_avaliar_36" class="celula">Presença de elementos <img> com o mesmo atributo "src", no entanto, o conteúdo do atributo "alt" não é o mesmo de cada imagem.</td> | |
| 684 | + </tr> | |
| 685 | + | |
| 686 | + <tr id="criterio_366"> | |
| 687 | + <td headers="numero_36" class="celula">3.6.6</td> | |
| 688 | + <td headers="criterio_36" class="celula">Imagens com dupla descrição, pois utiliza atributo TITLE com o mesmo valor da descrição</td> | |
| 689 | + <td headers="como_avaliar_36" class="celula">Presença de elementos <img> com o mesmo conteúdo descrito no atributo "title" e no atributo "alt".</td> | |
| 690 | + </tr> | |
| 691 | + </tbody> | |
| 692 | + </table> | |
| 693 | + | |
| 694 | + | |
| 695 | + <h3 class="subtitulo">Recomendação 3.7 - Ulilizar mapas de imagem de forma acessível</h3> | |
| 696 | + <p class="criterios">Um mapa de imagens é uma imagem dividida em áreas selecionáveis. Cada área é um link para outra página Web ou outra seção da página atual.</p> | |
| 697 | + | |
| 698 | + <table class="tabelaCriterioSucesso"> | |
| 699 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 3.7</caption> | |
| 700 | + <thead> | |
| 701 | + <tr> | |
| 702 | + <th id="numero_37" class="topo indice0">Número</th> | |
| 703 | + <th id="criterio_37" class="topo indice1">Critério</th> | |
| 704 | + <th id="como_avaliar_37" class="topo indice2">Como avaliar</th> | |
| 705 | + </tr> | |
| 706 | + </thead> | |
| 707 | + <tbody> | |
| 708 | + | |
| 709 | + <tr id="criterio_371"> | |
| 710 | + <td headers="numero_37" class="celula">3.7.1</td> | |
| 711 | + <td headers="criterio_37" class="celula">Mapa de imagem sem descrição ou alternativa em texto</td> | |
| 712 | + <td headers="como_avaliar_37" class="celula"> Presença do elemento <img> com atributo "usemap" e ausência de conteúdo descritivo no atributo "alt", ou presença do elemento <area> e ausência de conteúdo descritivo no atributo "alt".</td> | |
| 713 | + </tr> | |
| 714 | + | |
| 715 | + </tbody> | |
| 716 | + </table> | |
| 717 | + | |
| 718 | + <h3 class="subtitulo">Recomendação 3.9 - Em tabelas, utilizar títulos e resumos de forma apropriada</h3> | |
| 719 | + <p class="criterios">O título da tabela deve ser definido e localizado no primeiro elemento da tabela. Em casos de tabelas extensas, deve ser fornecido um resumo dos dados.</p> | |
| 720 | + | |
| 721 | + <table class="tabelaCriterioSucesso"> | |
| 722 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 3.9</caption> | |
| 723 | + <thead> | |
| 724 | + <tr> | |
| 725 | + <th id="numero_39" class="topo indice0">Número</th> | |
| 726 | + <th id="criterio_39" class="topo indice1">Critério</th> | |
| 727 | + <th id="como_avaliar_39" class="topo indice2">Como avaliar</th> | |
| 728 | + </tr> | |
| 729 | + </thead> | |
| 730 | + <tbody> | |
| 731 | + | |
| 732 | + <tr id="criterio_391"> | |
| 733 | + <td headers="numero_39" class="celula">3.9.1</td> | |
| 734 | + <td headers="criterio_39" class="celula">Tabelas sem título e resumo</td> | |
| 735 | + <td headers="como_avaliar_39" class="celula">Presença do elemento <table> e ausência do atributo "summary" ou ausência do elemento <caption>.</td> | |
| 736 | + </tr> | |
| 737 | + | |
| 738 | + </tbody> | |
| 739 | + </table> | |
| 740 | + | |
| 741 | + <h3 class="subtitulo">Recomendação 3.10 - Associar células de dados às células de cabeçalho</h3> | |
| 742 | + <p class="criterios">Em tabelas de dados simples, o uso apropriado dos cabeçalhos e das colunas para as células de dados.</p> | |
| 743 | + | |
| 744 | + <table class="tabelaCriterioSucesso"> | |
| 745 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 3.10</caption> | |
| 746 | + <thead> | |
| 747 | + <tr> | |
| 748 | + <th id="numero_3100" class="topo indice0">Número</th> | |
| 749 | + <th id="criterio_3100" class="topo indice1">Critério</th> | |
| 750 | + <th id="como_avaliar_3100" class="topo indice2">Como avaliar</th> | |
| 751 | + </tr> | |
| 752 | + </thead> | |
| 753 | + <tbody> | |
| 754 | + | |
| 755 | + <tr id="criterio_3101"> | |
| 756 | + <td headers="numero_3100" class="celula">3.10.1</td> | |
| 757 | + <td headers="criterio_3100" class="celula">Tabelas sem células associadas</td> | |
| 758 | + <td headers="como_avaliar_3100" class="celula">Presença do elemento <table> e ausência dos elementos: <thead>, <tbody> ou a presença do elemento <table> e ausência dos atributos: "id", "headers", "scope", "axis" nos elementos <td> e <th>.</td> | |
| 759 | + </tr> | |
| 760 | + | |
| 761 | + </tbody> | |
| 762 | + </table> | |
| 763 | + | |
| 764 | + <h3 class="subtitulo">Recomendação 3.11 - Garantir a leitura e compreensão das informações</h3> | |
| 765 | + <p class="criterios">O texto de um sítio deve ser de fácil leitura e compreensão, não exigindo do usuário um nível de instrução avançado. Quando o texto exigir uma capacidade de leitura mais avançada, devem ser disponibilizadas informações suplementares que expliquem ou ilustrem o conteúdo principal.</p> | |
| 766 | + | |
| 767 | + <table class="tabelaCriterioSucesso"> | |
| 768 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 3.11</caption> | |
| 769 | + <thead> | |
| 770 | + <tr> | |
| 771 | + <th id="numero_3110" class="topo indice0">Número</th> | |
| 772 | + <th id="criterio_3110" class="topo indice1">Critério</th> | |
| 773 | + <th id="como_avaliar_3110" class="topo indice2">Como avaliar</th> | |
| 774 | + </tr> | |
| 775 | + </thead> | |
| 776 | + <tbody> | |
| 777 | + | |
| 778 | + <tr id="criterio_3111"> | |
| 779 | + <td headers="numero_3110" class="celula">3.11.1</td> | |
| 780 | + <td headers="criterio_3110" class="celula">Presença de parágrafos justificados</td> | |
| 781 | + <td headers="como_avaliar_3110" class="celula">Presença de elementos <p> com conteúdo "justify" no atributo "align".</td> | |
| 782 | + </tr> | |
| 783 | + | |
| 784 | + <tr id="criterio_3112"> | |
| 785 | + <td headers="numero_3110" class="celula">3.11.2</td> | |
| 786 | + <td headers="criterio_3110" class="celula">Presença de textos justificados através de folhas de estilo</td> | |
| 787 | + <td headers="como_avaliar_3110" class="celula">Presença de elementos <p> e propriedade CSS text-align com conteúdo "justify". Deverá ser avaliado o CSS externo (com arquivo CSS referenciado pelo elemento <link>), interno (propriedade dentro do elemento <style>) e in-line (propriedade dentro do atributo "style" no elemento <p>).</td> | |
| 788 | + </tr> | |
| 789 | + | |
| 790 | + </tbody> | |
| 791 | + </table> | |
| 792 | + | |
| 793 | + <h3 class="subtitulo">Recomendação 3.12 - Disponibilizar uma explicação para siglas, abreviaturas e palavras incomuns</h3> | |
| 794 | + <p class="criterios">Recomenda-se que na primeira ocorrência de siglas, abreviaturas ou palavras incomuns (ambíguas, desconhecidas ou utilizadas de forma muito específica), deve ser disponibilizada sua explicação ou forma completa.</p> | |
| 795 | + | |
| 796 | + <table class="tabelaCriterioSucesso"> | |
| 797 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 3.12</caption> | |
| 798 | + <thead> | |
| 799 | + <tr> | |
| 800 | + <th id="numero_3120" class="topo indice0">Número</th> | |
| 801 | + <th id="criterio_3120" class="topo indice1">Critério</th> | |
| 802 | + <th id="como_avaliar_3120" class="topo indice2">Como avaliar</th> | |
| 803 | + </tr> | |
| 804 | + </thead> | |
| 805 | + <tbody> | |
| 806 | + | |
| 807 | + <tr id="criterio_3121"> | |
| 808 | + <td headers="numero_3120" class="celula">3.12.1</td> | |
| 809 | + <td headers="criterio_3120" class="celula">Siglas marcadas e sem explicação</td> | |
| 810 | + <td headers="como_avaliar_3120" class="celula">Presença dos elementos <abbr> ou <acronym> e ausência do atributo "title" para descrever a sigla.</td> | |
| 811 | + </tr> | |
| 812 | + | |
| 813 | + </tbody> | |
| 814 | + </table> | |
| 815 | + | |
| 816 | + <h3 class="subtitulo">Recomendação 4.4 - Possibilitar que o elemento com foco seja visualmente evidente</h3> | |
| 817 | + <p class="criterios">A área que recebe o foco pelo teclado deve ser claramente marcada, devendo a área de seleção ser passível de ser clicada.</p> | |
| 818 | + | |
| 819 | + <table class="tabelaCriterioSucesso"> | |
| 820 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 4.4</caption> | |
| 821 | + <thead> | |
| 822 | + <tr> | |
| 823 | + <th id="numero_44" class="topo indice0">Número</th> | |
| 824 | + <th id="criterio_44" class="topo indice1">Critério</th> | |
| 825 | + <th id="como_avaliar_44" class="topo indice2">Como avaliar</th> | |
| 826 | + </tr> | |
| 827 | + </thead> | |
| 828 | + <tbody> | |
| 829 | + | |
| 830 | + <tr id="criterio_441"> | |
| 831 | + <td headers="numero_44" class="celula">4.4.1</td> | |
| 832 | + <td headers="criterio_44" class="celula">Ausência de destaque de foco do elemento ativo</td> | |
| 833 | + <td headers="como_avaliar_44" class="celula">Verificar a ausência de destaque nos elementos HTML. Para verificação, analisar a ausência de utilização da propriedade "border" dentro dos seletores CSS.</td> | |
| 834 | + </tr> | |
| 835 | + | |
| 836 | + </tbody> | |
| 837 | + </table> | |
| 838 | + | |
| 839 | + <h3 class="subtitulo">Recomendação 5.1 - Fornecer alternativa para video</h3> | |
| 840 | + <p class="criterios">Deve haver uma alternativa sonora ou textual para vídeos que não incluem faixas de áudio.</p> | |
| 841 | + | |
| 842 | + <table class="tabelaCriterioSucesso"> | |
| 843 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 5.1</caption> | |
| 844 | + <thead> | |
| 845 | + <tr> | |
| 846 | + <th id="numero_51" class="topo indice0">Número</th> | |
| 847 | + <th id="criterio_51" class="topo indice1">Critério</th> | |
| 848 | + <th id="como_avaliar_51" class="topo indice2">Como avaliar</th> | |
| 849 | + </tr> | |
| 850 | + </thead> | |
| 851 | + <tbody> | |
| 852 | + | |
| 853 | + <tr id="criterio_511"> | |
| 854 | + <td headers="numero_51" class="celula">5.1.1</td> | |
| 855 | + <td headers="criterio_51" class="celula">Presença de vídeo na página</td> | |
| 856 | + <td headers="como_avaliar_51" class="celula">Presença do elemento <embed> ou <video> com atributos "src" direcionados para arquivo de vídeo ou local de execução de vídeo.</td> | |
| 857 | + </tr> | |
| 858 | + | |
| 859 | + </tbody> | |
| 860 | + </table> | |
| 861 | + | |
| 862 | + <h3 class="subtitulo">Recomendação 5.2 - Fornecer alternativa para áudio</h3> | |
| 863 | + <p class="criterios">Áudio gravado deve possuir uma transcrição descritiva. Além de essencial para pessoas com deficiência auditiva, a alternativa em texto também é importante para úsuarios que não possuem equipamento de som, que desejam apenas realizar a leitura do material ou não dispôem de tempo para ouvir um arquivo multimídia. Neste caso, também é desejavel a alternativa em Libras.</p> | |
| 864 | + | |
| 865 | + <table class="tabelaCriterioSucesso"> | |
| 866 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 5.2</caption> | |
| 867 | + <thead> | |
| 868 | + <tr> | |
| 869 | + <th id="numero_52" class="topo indice0">Número</th> | |
| 870 | + <th id="criterio_52" class="topo indice1">Critério</th> | |
| 871 | + <th id="como_avaliar_52" class="topo indice2">Como avaliar</th> | |
| 872 | + </tr> | |
| 873 | + </thead> | |
| 874 | + <tbody> | |
| 875 | + | |
| 876 | + <tr id="criterio_521"> | |
| 877 | + <td headers="numero_52" class="celula">5.2.1</td> | |
| 878 | + <td headers="criterio_52" class="celula">Presença de áudio na página</td> | |
| 879 | + <td headers="como_avaliar_52" class="celula">Presença do elemento <embed> ou <audio> com atributos "src" direcionados para arquivo de audio ou local de execução de áudio.</td> | |
| 880 | + </tr> | |
| 881 | + | |
| 882 | + </tbody> | |
| 883 | + </table> | |
| 884 | + | |
| 885 | + <h3 class="subtitulo">Recomendação 5.3 - Oferecer audiodescrição para vídeo pré-gravado</h3> | |
| 886 | + <p class="criterios">A página deve continuar legível e funcional mesmo quando redimensionada para até 200%. Assim, é preciso garantir que, quando a página for redimensionada, não ocorram sobreposições nem o aparecimento de uma barra horizontal.</p> | |
| 887 | + | |
| 888 | + <table class="tabelaCriterioSucesso"> | |
| 889 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 5.3</caption> | |
| 890 | + <thead> | |
| 891 | + <tr> | |
| 892 | + <th id="numero_53" class="topo indice0">Número</th> | |
| 893 | + <th id="criterio_53" class="topo indice1">Critério</th> | |
| 894 | + <th id="como_avaliar_53" class="topo indice2">Como avaliar</th> | |
| 895 | + </tr> | |
| 896 | + </thead> | |
| 897 | + <tbody> | |
| 898 | + | |
| 899 | + <tr id="criterio_531"> | |
| 900 | + <td headers="numero_53" class="celula">5.3.1</td> | |
| 901 | + <td headers="criterio_53" class="celula">Presença de vídeo na página</td> | |
| 902 | + <td headers="como_avaliar_53" class="celula">Presença do elemento <embed> ou <vídeo> com atributos "src" direcionados para arquivo de vídeo ou local de execução de vídeo.</td> | |
| 903 | + </tr> | |
| 904 | + | |
| 905 | + </tbody> | |
| 906 | + </table> | |
| 907 | + | |
| 908 | + <h3 class="subtitulo">Recomendação 5.4 - Fornecer controle de áudio para som</h3> | |
| 909 | + <p class="criterios">Deve ser fornecido um mecanismo para parar, pausar, silenciar ou ajustar o volume de qualquer som que se reproduza na página.</p> | |
| 910 | + | |
| 911 | + <table class="tabelaCriterioSucesso"> | |
| 912 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 5.4</caption> | |
| 913 | + <thead> | |
| 914 | + <tr> | |
| 915 | + <th id="numero_54" class="topo indice0">Número</th> | |
| 916 | + <th id="criterio_54" class="topo indice1">Critério</th> | |
| 917 | + <th id="como_avaliar_54" class="topo indice2">Como avaliar</th> | |
| 918 | + </tr> | |
| 919 | + </thead> | |
| 920 | + <tbody> | |
| 921 | + | |
| 922 | + <tr id="criterio_541"> | |
| 923 | + <td headers="numero_54" class="celula">5.4.1</td> | |
| 924 | + <td headers="criterio_54" class="celula">Presença de áudio na página</td> | |
| 925 | + <td headers="como_avaliar_54" class="celula">Presença do elemento <embed> ou <audio> com atributos "src" direcionados para arquivo de áudio ou local de execução de áudio.</td> | |
| 926 | + </tr> | |
| 927 | + | |
| 928 | + </tbody> | |
| 929 | + </table> | |
| 930 | + | |
| 931 | + <h3 class="subtitulo">Recomendação 6.1 - Fornecer alternativa em texto para os botões de imagem de formulários</h3> | |
| 932 | + <p class="criterios">Ao serem utilizados botões do tipo imagem, que servem para o mesmo propósito do botão "submit", deve ser fornecida uma descrição textual para o botão. Para outros tipos de botões é necessario o botão pela imagem que se deseja utilizar através do CSS e aplicar o texto descrito no atributo do valor.</p> | |
| 933 | + | |
| 934 | + <table class="tabelaCriterioSucesso"> | |
| 935 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 6.1</caption> | |
| 936 | + <thead> | |
| 937 | + <tr> | |
| 938 | + <th id="numero_61" class="topo indice0">Número</th> | |
| 939 | + <th id="criterio_61" class="topo indice1">Critério</th> | |
| 940 | + <th id="como_avaliar_61" class="topo indice2">Como avaliar</th> | |
| 941 | + </tr> | |
| 942 | + </thead> | |
| 943 | + <tbody> | |
| 944 | + | |
| 945 | + <tr id="criterio_611"> | |
| 946 | + <td headers="numero_61" class="celula">6.1.1</td> | |
| 947 | + <td headers="criterio_61" class="celula">Botão sem descrição</td> | |
| 948 | + <td headers="como_avaliar_61" class="celula">Presença do elemento <input> com o conteúdo do atributo "type", "image" e ausência de conteúdo no atributo "alt" ou ausência do "alt"; presença do elemento <input> com os conteúdos: "button", "reset", ou "submit" e ausência de conteúdo no atributo "value" ou ausência do atributo "value".</td> | |
| 949 | + </tr> | |
| 950 | + | |
| 951 | + </tbody> | |
| 952 | + </table> | |
| 953 | + | |
| 954 | + <h3 class="subtitulo">Recomendação 6.2 - Associar etiquetas aos seus campos</h3> | |
| 955 | + <p class="criterios">As etiquetas de texto devem estar associadas aos seus campos correspondentes no formulário.</p> | |
| 956 | + | |
| 957 | + <table class="tabelaCriterioSucesso"> | |
| 958 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 6.2</caption> | |
| 959 | + <thead> | |
| 960 | + <tr> | |
| 961 | + <th id="numero_62" class="topo indice0">Número</th> | |
| 962 | + <th id="criterio_62" class="topo indice1">Critério</th> | |
| 963 | + <th id="como_avaliar_62" class="topo indice2">Como avaliar</th> | |
| 964 | + </tr> | |
| 965 | + </thead> | |
| 966 | + <tbody> | |
| 967 | + | |
| 968 | + <tr id="criterio_621"> | |
| 969 | + <td headers="numero_62" class="celula">6.2.1</td> | |
| 970 | + <td headers="criterio_62" class="celula">Campo sem label associado</td> | |
| 971 | + <td headers="como_avaliar_62" class="celula">Presença do elemento <input> e ausência de elemento <label> com atributo "for" referenciado ao atributo "id" do <input>, ou presença de elemento <input> sem estar dentro de elemento <label>.</td> | |
| 972 | + </tr> | |
| 973 | + | |
| 974 | + </tbody> | |
| 975 | + </table> | |
| 976 | + | |
| 977 | + <h3 class="subtitulo">Recomendação 6.3 - Estabelecer uma lógica de navegação</h3> | |
| 978 | + <p class="criterios">Os elementos do formulário devem ser distribuídos corretamente através do códgio HTML, criando, assim, uma sequência lógica de navegação.</p> | |
| 979 | + | |
| 980 | + <table class="tabelaCriterioSucesso"> | |
| 981 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 6.3</caption> | |
| 982 | + <thead> | |
| 983 | + <tr> | |
| 984 | + <th id="numero_63" class="topo indice0">Número</th> | |
| 985 | + <th id="criterio_63" class="topo indice1">Critério</th> | |
| 986 | + <th id="como_avaliar_63" class="topo indice2">Como avaliar</th> | |
| 987 | + </tr> | |
| 988 | + </thead> | |
| 989 | + <tbody> | |
| 990 | + | |
| 991 | + <tr id="criterio_631"> | |
| 992 | + <td headers="numero_63" class="celula">6.3.1</td> | |
| 993 | + <td headers="criterio_63" class="celula">Presença do elemento FORM e atributo TABINDEX</td> | |
| 994 | + <td headers="como_avaliar_63" class="celula">Presença do elemento <form> e atributo "tabindex" nos elementos dentro do <form>.</td> | |
| 995 | + </tr> | |
| 996 | + | |
| 997 | + </tbody> | |
| 998 | + </table> | |
| 999 | + | |
| 1000 | + <h3 class="subtitulo">Recomendação 6.4 - Não provocar automaticamente alteração no contexto</h3> | |
| 1001 | + <p class="criterios">A área que recebe o foco pelo teclado deve ser claramente marcada, devendo a área de seleção ser passível de ser clicada.</p> | |
| 1002 | + | |
| 1003 | + <table class="tabelaCriterioSucesso"> | |
| 1004 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 6.4</caption> | |
| 1005 | + <thead> | |
| 1006 | + <tr> | |
| 1007 | + <th id="numero_64" class="topo indice0">Número</th> | |
| 1008 | + <th id="criterio_64" class="topo indice1">Critério</th> | |
| 1009 | + <th id="como_avaliar_64" class="topo indice2">Como avaliar</th> | |
| 1010 | + </tr> | |
| 1011 | + </thead> | |
| 1012 | + <tbody> | |
| 1013 | + | |
| 1014 | + <tr id="criterio_641"> | |
| 1015 | + <td headers="numero_64" class="celula">6.4.1</td> | |
| 1016 | + <td headers="criterio_64" class="celula">Presença de alteração automática de contexto sem que o usuário tenha conhecimento</td> | |
| 1017 | + <td headers="como_avaliar_64" class="celula">Presença do elemento <form> e nos seus elementos internos, retirando os elementos <input> com os conteúdos no atributo "type": button, submit, reset; utilização dos eventos (atributos): onchange, onblur, onfocus, onformchange, onforminput, oninput, oninvalid, onreset, onselect, onsubmit, onkeydown, onkeypress, onkeyup, onclick; ou a presença do elemento <form> e nos seus elementos internos a utilização dos eventos (atributos): ondbclick, ondrag, ondragend, ondragcenter, ondragleave, ondragover, ondragstart, ondrop, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onscroll, ou a presença de funções javascript in-line (código javascript em elementos html), interno (código javascript dentro do elemento <script>) e externo (código javascript referenciado pelo elemento <script> por meio do atributo "src") que permitem comportamento na página sem apresentar aviso para o utilizador da página.</td> | |
| 1018 | + </tr> | |
| 1019 | + | |
| 1020 | + </tbody> | |
| 1021 | + </table> | |
| 1022 | + | |
| 1023 | + <h3 class="subtitulo">Recomendação 6.7 - Agrupar campos de formulário</h3> | |
| 1024 | + <p class="criterios">É recomendado que os campos com informações relacionadas sejam agrupadas utilizando elementos com esta finalidade na própria linguagem HTML, principalmente em formulários longos. O agrupamento deverá ser feito de maneira lógica, explicitando claramente o propósito ou natureza dos agrupamentos.</p> | |
| 1025 | + | |
| 1026 | + <table class="tabelaCriterioSucesso"> | |
| 1027 | + <caption class="capitulo">Critérios de Avaliação e como avaliar Recomendação 6.7</caption> | |
| 1028 | + <thead> | |
| 1029 | + <tr> | |
| 1030 | + <th id="numero_67" class="topo indice0">Número</th> | |
| 1031 | + <th id="criterio_67" class="topo indice1">Critério</th> | |
| 1032 | + <th id="como_avaliar_67" class="topo indice2">Como avaliar</th> | |
| 1033 | + </tr> | |
| 1034 | + </thead> | |
| 1035 | + <tbody> | |
| 1036 | + | |
| 1037 | + <tr id="criterio_671"> | |
| 1038 | + <td headers="numero_67" class="celula">6.7.1</td> | |
| 1039 | + <td headers="criterio_67" class="celula">Existência de formulário e inexistência de agrupamento de campos</td> | |
| 1040 | + <td headers="como_avaliar_67" class="celula">Verificar a presença do elemento <form> e dentro desse os elementos: <input>, <textarea>, <button>, <select>, <option>, <label> e ausência do elemento <fieldset>.</td> | |
| 1041 | + </tr> | |
| 1042 | + | |
| 1043 | + <tr id="criterio_672"> | |
| 1044 | + <td headers="numero_67" class="celula">6.7.2</td> | |
| 1045 | + <td headers="criterio_67" class="celula">Uso de campo de seleção sem agrupamento.</td> | |
| 1046 | + <td headers="como_avaliar_67" class="celula">Verificar a presença do elemento <form> e dentro desse o elemento <select> e ausência do elemento <optgroup> para conteúdos do <select> que precisem de agrupamento.</td> | |
| 1047 | + </tr> | |
| 1048 | + | |
| 1049 | + </tbody> | |
| 1050 | + </table> | |
| 1051 | + | |
| 1052 | + </jsp:body> | |
| 1053 | +</t:baseLayout> | |
| 1054 | + | |
| 1055 | + | ... | ... |