CASA CIVIL DO GABINETE DO PREFEITO

Acessibilidade

PORTARIA SECRETARIA MUNICIPAL DA PESSOA COM DEFICIÊNCIA - SMPED Nº 8 de 10 de Maio de 2018

Regulamenta o Decreto Municipal n.º 49.063, de 18 de dezembro de 2007, conforme o disposto no parágrafo único do artigo 2º, no parágrafo 2º do artigo 3º e no artigo 4º, no que tange ao estabelecimento de critérios e procedimentos necessários para a concessão do Selo de Acessibilidade Digital.

PORTARIA Nº 08/SMPED-GAB, DE 10 DE MAIO DE 2018.

Regulamenta o Decreto Municipal n.º 49.063, de 18 de dezembro de 2007, conforme o disposto no parágrafo único do artigo 2º, no parágrafo 2º do artigo 3º e no artigo 4º, no que tange ao estabelecimento de critérios e procedimentos necessários para a concessão do Selo de Acessibilidade Digital.

CID TORQUATO, Secretário Municipal da Pessoa com Deficiência do Município de São Paulo, no uso das atribuições que lhe são conferidas por lei,

RESOLVE:

Art. 1º Esta portaria regulamenta o Decreto Municipal nº 49.063, de 18 de dezembro de 2007, no que tange ao estabelecimento de critérios e procedimentos necessários para a concessão do Selo de Acessibilidade Digital.

Art. 2º Será concedido o Selo de Acessibilidade Digital ao sítio ou portal da internet que contemplar as recomendações da versão mais atualizada do Modelo de Acessibilidade em Governo Eletrônico, instituída pela Portaria nº 3, de 7 de maio de 2007, da Secretaria de Tecnologia da Informação e Comunicação do Ministério do Planejamento, Desenvolvimento e Gestão.

§ 1º A avaliação do sítio ou portal da Internet considerará o percentual de aderência às recomendações do Modelo de Acessibilidade em Governo Eletrônico segundo o Avaliador e Simulador de Acessibilidade em Sítios – ASESWEB, cujo link de acesso está disponível no sítio eletrônico da Secretaria Municipal da Pessoa com Deficiência - SMPED.

§ 2º O Selo de Acessibilidade Digital será concedido ao conjunto de páginas eletrônicas que obtiverem percentual de aderência às recomendações do Modelo de Acessibilidade em Governo Eletrônico de, no mínimo, 95% (noventa e cinco por cento) e cumprimento total da lista de verificação para análise manual de acessibilidade em portais e sítios eletrônicos (Anexo I).

§ 3º No ato de requerimento do Selo de Acessibilidade Digital, o requerente deverá indicar as 20 (vinte) páginas que serão certificadas pelo Selo, sendo obrigatória a indicação da página inicial.

§ 4º O Selo de Acessibilidade Digital poderá ser concedido aos sítios ou portais da internet mantidos por órgãos da Administração Pública Direta e Indireta e por pessoas físicas ou jurídicas com sede ou representação no Brasil.

Art. 3º Será cobrado preço público como condição para se iniciar o processo de concessão do Selo de Acessibilidade Digital, mediante emissão, pelo requerente, de Documento de Arrecadação do Município de São Paulo – DAMSP.

§ 1º A cobrança referida no caput deste artigo possibilita ao requerente apresentar seu requerimento pelo prazo de um ano, desde a data de pagamento, sendo que, esgotado o prazo sem que o requerimento tenha sido apresentado devidamente, será necessário realizar novo recolhimento de preço público.

§ 2º Após arquivamento do processo de requerimento de Selo de Acessibilidade Digital, será cobrado preço público, caso o requerente queira apresentar novo pedido de Selo.

Art. 4º O requerimento de concessão do Selo de Acessibilidade Digital será feito por meio de cadastro em página eletrônica, mediante acesso por certificado digital ou login/senha, devendo conter a imagem digitalizada dos seguintes documentos:

I - caso o sítio ou portal seja de propriedade de pessoa física que não possua certificado digital:

a) documento de identificação com foto e CPF do requerente ou do representante legal, quando for o caso;

b) comprovante de endereço para atendimento ao previsto no § 4º do artigo 2º;

c) procuração, quando for o caso, do representante legal.

II - caso o sítio ou portal seja de propriedade de pessoa jurídica que não possua certificado digital:

a) inscrição no Cadastro Nacional de Pessoas Jurídicas (CNPJ);

b) estatuto social ou contrato social em vigor;

III – documento que comprove o registro do domínio do sítio no Registro de Domínios para a Internet no Brasil (Registro.Br) do Comitê Gestor da Internet no Brasil - CGI;

IV - Autorização (Anexo II) e Termo de Compromisso (Anexo III) assinados pelo requerente ou representante legal, quando for o caso, garantindo o amplo acesso ao sítio ou portal;

V - a indicação de quais páginas serão avaliadas, conforme § 3º do artigo 2º;

VI - diagnóstico produzido a partir da avaliação feita pelo ASESWEB de cada uma das páginas previstas no inciso V, gerado até 10 (dez) dias antes da data de envio do requerimento de Selo;

VII – comprovação de pagamento de preço público mediante apresentação de DAMSP quitada.

§ 1º Em caso de indisponibilidade da página eletrônica e de cadastro previstos no caput deste artigo, o requerimento poderá ser feito pelo endereço de e-mail acessibilidadedigital@prefeitura.sp.gov.br, devendo o requerente indicar e-mail para contatos posteriores.

§ 2º Caso necessário, a SMPED poderá exigir que o requerente do Selo de Acessibilidade Digital apresente originais ou cópias físicas dos documentos arrolados neste artigo.

Art. 5º O requerente que não apresentar a documentação necessária para propiciar a avaliação para a concessão do Selo de Acessibilidade Digital será comunicado para providências saneadoras.

§ 1º O requerente terá o prazo de até 60 (sessenta) dias corridos, contados do envio da comunicação prevista no caput deste artigo, para as providências pertinentes ao saneamento da documentação.

§ 2º O não atendimento do prazo previsto no parágrafo anterior resultará no indeferimento do requerimento.

Art. 6º A acessibilidade dos sítios ou portais submetidos pelo requerente será avaliada por equipe técnica da SMPED e resultará em Parecer Técnico, que poderá concluir pela:

I - concessão do Selo de Acessibilidade Digital, submetendo-se o Parecer Técnico à deliberação da CPA;

I - concessão do Selo de Acessibilidade Digital, submetendo-se o Parecer Técnico à CPA que deliberará, por meio eletrônico, pela concessão ou não, do Selo de Acessibilidade Digital, com envio da pauta e eventuais relatórios, no prazo de 5 (cinco) dias úteis;(Redação dada pela Portaria SMPED nº 3/2019)

II - necessidade de adequação dos sítios ou portais sob avaliação, encaminhando-se o Parecer Técnico ao requerente para que tome as providências cabíveis.

§ 1º Desde o encaminhamento do Parecer Técnico previsto no inciso II deste artigo, o requerente terá o prazo máximo de 60 (sessenta) dias corridos para adequar os sítios ou portais e encaminhar a Declaração contida no Anexo IV.

§ 2º Recebida a Declaração referida no parágrafo anterior, a SMPED realizará nova avaliação e produzirá novo Parecer Técnico, que poderá concluir pela concessão do Selo de Acessibilidade Digital, ou por sua rejeição, submetendo-o à deliberação da CPA.

§ 2º - Recebida a Declaração referida no parágrafo anterior, a SMPED realizará nova avaliação e produzirá novo Parecer Técnico, que poderá concluir pela concessão do Selo de Acessibilidade Digital, ou por sua rejeição, submetendo-o à CPA que deliberará, por meio eletrônico, pela concessão ou não, do Selo de Acessibilidade Digital, com envio da pauta e eventuais relatórios, no prazo de 5 (cinco) dias úteis;(Redação dada pela Portaria SMPED nº 3/2019)

§ 3º A aprovação ou rejeição do Parecer Técnico pela CPA deverá ser motivada e encaminhada à equipe técnica da SMPED, responsável por sua elaboração, para a tomada das providências cabíveis.

§ 4º A aprovação ou a rejeição da concessão do Selo de Acessibilidade Digital pela CPA será encaminhada ao requerente, juntamente do respectivo Parecer Técnico.

§ 5º Quando aprovado, o Selo de Acessibilidade Digital será disponibilizado ao requerente.

§ 6º As deliberações finais da CPA referentes ao Selo de Acessibilidade Digital serão publicadas no Diário Oficial do Município de São Paulo.

Art. 7º O Selo de Acessibilidade Digital será emitido no formato de certificado de atributo, documento eletrônico que qualifica o responsável pelos portais e sítios eletrônicos certificados e assegura a autenticidade do Selo e a legitimidade de seu titular.

§ 1º O Selo de Acessibilidade Digital será aplicado ao sítio mediante a emissão de um certificado de atributo assinado digitalmente pela SMPED e identificado por um número de série único, gerado randomicamente por sistema próprio.

§ 2º O certificado de atributo terá, no mínimo, os seguintes atributos:

I - tipo de Selo e seu número identificador;

II - data da concessão e prazo de validade;

III - endereço do sítio (URL)

IV - CNPJ/CPF e nome completo do responsável.

§ 3º A autenticidade do Selo de Acessibilidade Digital se dará por meio da verificação de sua validade, se está expirado ou revogado, se foi emitido para o endereço do sítio ao qual está aplicado e se a assinatura do certificado de atributo é válida.

Art. 8º O Selo de Acessibilidade Digital será válido pelo prazo de 1 (um) ano, renovável por 2 (duas) vezes, mediante envio de Declaração de Manutenção da Acessibilidade - DMA (Anexo V) firmada pelo responsável legal pelo sítio ou portal certificado, com 30 (trinta) dias de antecedência ao término do prazo, e do documento previsto no inciso VI do artigo 4º desta Portaria.

§ 1º Após os 3 (três) anos de validade previstos no caput deste artigo, o sítio ou portal poderá requerer novo Selo de Acessibilidade Digital mediante envio, com 30 (trinta) dias de antecedência ao término do prazo final, dos documentos previstos nos incisos IV a VII do art. 4º desta Portaria, seguindo-se o mesmo procedimento para concessão do Selo de Acessibilidade Digital.

§ 2º A cada renovação, em caso de alteração das informações contidas nos documentos previstos nos incisos I e II do art. 4º desta Portaria, o requerente deve encaminhar documentação atualizada.

§ 3º Constatado equívoco no envio da documentação, será adotado o procedimento previsto no art. 5º desta Portaria.

§ 4º A qualquer tempo, a SMPED e a CPA poderão fazer novas avaliações de acessibilidade do sítio ou portal cujo Selo de Acessibilidade Digital esteja em vigência e, constatado o descumprimento às recomendações do Modelo de Acessibilidade em Governo Eletrônico ou à lista de verificação contida no Anexo I, o responsável será notificado, tendo o prazo de 30 (trinta) dias corridos para fazer as adequações necessárias, sob pena de ter o Selo de Acessibilidade Digital revogado.

Art. 9º O uso irregular do Selo de Acessibilidade Digital sujeitará o responsável às sanções administrativas cabíveis, sem prejuízo das ações cíveis e criminais.

Art. 10 Os recursos administrativos referentes aos atos praticados em razão desta Portaria poderão ser protocolados em até 10 (dez) dias após a data da publicação do ato a ser recorrido, seguindo o rito estabelecido na Lei Municipal nº 14.141, de 27 de março de 2006.

Art. 11 Os casos omissos serão resolvidos pela SMPED e pela CPA.

Art. 12 Esta portaria entrará em vigor na data de sua publicação, revogando a Portaria nº 20/SMPED/GAB, de 28 de agosto de 2008.

ANEXO I

LISTA DE VERIFICAÇÃO PARA ANÁLISE MANUAL DE ACESSIBILIDADE EM PORTAIS E SÍTIOS ELETRÔNICOS DO ART. 2º, § 2º, DA PORTARIA Nº 08/SMPED-GAB/2018

Objetivo e Metodologia

Esta lista de verificação visa identificar barreiras de acessibilidade na navegação de portais e sítios eletrônicos. Baseia-se no uso do navegador Google Chrome e da extensão NoCoffee Vision Simulator. Para a realização dos testes de navegação acessível e de entendimento de um sítio ou portal eletrônico (análise manual/simulação da navegação pelo usuário), deve ser utilizado um dos seguintes leitores de tela:

- JAWS for Windows (pago - 30 dias grátis)

https://www.freedomscientific.com/Downloads/JAWS

- NVDA (grátis)

https://www.nvaccess.org/download/

- VoiceOver (nativo no MacOS e no iOS)

- TalkBack (nativo no Android)

Critérios – Lista para verificação

As respostas às perguntas contidas na lista de verificação a seguir devem ser afirmativas (sim), para os casos em que a pergunta em questão se aplique ao sítio ou portal sob análise.

1. Navegação na página

Navegando pelos links do sítio ou portal eletrônico com as teclas TAB (para avançar) e SHIFT + TAB (para voltar).

1.1 Após navegar na página do início ao fim sem utilizar o monitor (monitor desligado), sem clicar em nenhum link, é possível identificar o assunto de que se trata a página?

1.2 É possível utilizar a tecla TAB e as demais teclas do teclado sem impedimento e acessar todos os links da página?

1.3 O conteúdo dos links é claro e informa qual página será aberta?

1.4 Caso haja links adjacentes (sequência de links), estes estão separados explicitamente de forma que não há cacofonia (confusão ou extrema repetição), quando se ouve uma sequência longa de links?

2. Estrutura, navegação por cabeçalhos e por blocos de conteúdos

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. Pelo leitor de tela, deve ser possível navegar de um cabeçalho a outro e verificar a estrutura da página. A maioria dos leitores de tela utiliza o atalho "H" do teclado em combinação com os números de 01 a 06.

2.1 A hierarquia de cabeçalhos existe e está clara?

2.2 Os cabeçalhos estão ordenados e não há repetição do nível de cabeçalho <h1>?

2.3 A leitura e tabulação estão ordenadas de forma lógica e intuitiva?

2.4 Há âncoras para ir direto a um bloco de conteúdo como, por exemplo: o primeiro link da página é o "Ir para o conteúdo principal", o segundo link é o “Ir para o menu”, o terceiro link é o “Ir para pesquisa”, o quarto link é o “Ir para o rodapé”?

2.5 São utilizadas tabelas apenas para dados tabulares e não para efeitos de disposição dos elementos da página?

2.6 O título da tabela está definido e localizado no primeiro elemento da tabela?

2.7 Há um resumo dos dados de tabelas extensas e/ou é possível compreender a complexidade da tabela informacional?

2.8 Em tabelas de dados simples, estão associadas células de dados às células de cabeçalho?

2.9 Inexiste abertura de novas instâncias ‘abas ou janelas’ sem a solicitação do usuário?

2.10 Inexistem atualização automática periódica de páginas (‘refresh’) e redirecionamento automático de páginas (uma nova página que abre sem ser solicitada)?

2.11 Todas as funções da página são disponibilizadas via teclado, sem bloquear o foco ou fixá-lo em um elemento da página?

2.12 Elementos que recebem o foco pelo teclado estão claramente marcados, ficando evidentes e passíveis de serem clicados?

2.13 Todos os scripts, conteúdos dinâmicos e outros elementos programáveis contidos nas páginas estão acessíveis? Sua execução é possível via navegação?

2.14 Scripts, conteúdos dinâmicos e outros elementos programáveis (por exemplo: plugins de visualização de PDF, gráficos de pizza dinâmicos, entre outros) tem conteúdo/texto equivalente?

2.15 É possível acessar todo o conteúdo em lista e em seu(s) sub-nível(is)?

2.16 As cores do plano de fundo e do primeiro plano estão suficientemente contrastantes?

2.17 Inexistem efeitos visuais piscantes, intermitentes ou cintilantes?

2.18 O idioma principal da página está identificado?

2.19 Os elementos que possuem conteúdo em um idioma diferente do principal estão devidamente identificados?

2.20 Em resumo, é possível compreender a estrutura da página de forma que não gere confusão e se saiba qual informação será obtida ou quais ações e tarefas devem ser executadas com clareza?

2.21 O Html5 foi desenvolvido seguindo os padrões da W3C e de forma semântica?

2.22 Foi adicionado algum recurso para acessibilidade em elementos dinâmicos e interface de controle? Exemplo: Carrossel com troca de slide.

2.23 Caso haja Pop-ups (moldais), estes são acessíveis?

2.24 As páginas são acessíveis e responsivas em dispositivos móveis?

3. Imagens acessíveis

Os testes abaixo visam verificar se os textos alternativos que descrevem as imagens lidas pelo software leitor de tela correspondem exatamente ao que as imagens mostram. Imagens que fazem parte do contexto da página (como um logotipo ou a foto que ilustra uma notícia) são consideradas imagens relevantes. Imagens decorativas, como fundo da página e bordas, não são consideradas relevantes.

3.1 Todas as imagens relevantes têm um texto alternativo claro e relacionado à imagem?

3.2 Na página, inexistem imagens com texto (todos os textos estão em HTML)?

3.3 Há imagens mapeadas? Estão acessíveis?

3.4 Há infográficos (ou outros tipos de conteúdo visual complexo)? Estão acessíveis ou com texto equivalente?

4. Preenchimento e navegação em formulários

Ao se navegar por formulários, não deve haver barreiras que impeçam que o usuário passe de campo em campo e acione botões. As instruções devem ser claras e os rótulos devem estar relacionados com cada campo. Os softwares leitores de tela devem ler cada campo e relacioná-lo com seu devido rótulo.

4.1 Os campos de formulário da página possuem um título claro / compreensível?

4.2 As informações sobre o preenchimento dos formulários são claras?

4.3 Os campos de preenchimento obrigatório estão indicados não apenas por cor diferenciada?

4.4 É possível saltar os campos cujo preenchimento não é obrigatório?

4.5 Há alternativa em texto para os botões de imagem de formulários e ela descreve com clareza a ação que será executada?

4.6 As etiquetas de texto (labels ou rótulos) estão associadas aos seus campos correspondentes no formulário?

4.7 Os campos dos formulários com informações relacionadas estão agrupados logicamente, e o propósito ou natureza dos agrupamentos está explicitado claramente?

4.8 Mensagens de erro e avisos são claros? É possível acessá-los facilmente?

4.9 Quando ocorre erro ou engano em alguma digitação, é possível corrigi-lo?

4.10 Quando houver anti-spam para liberação de envio dos dados (captcha), estes itens estão disponíveis também em áudio e texto?

4.11 Os estados dos botões (desabilitado, mouse over, etc.) são indicados de forma clara e acessível?

5. Tamanho e relacionamento de elementos

Verificação de problemas em relação ao tamanho dos elementos presentes no sítio ou portal eletrônico. Elementos muito pequenos podem prejudicar o uso para muitas pessoas.

Utilize o Google Chrome, e a extensão "NoCoffee Vision Simulator", opção "Flutter (nystagmus)" definida em 100, para dificultar a interação com os elementos presentes na página e movimente o cursor sobre os menores links e elementos da página durante o teste.

5.1 É fácil clicar nos elementos da página?

5.2 É possível aumentar e diminuir o tamanho das fontes do sítio ou portal através do browser sem que o conteúdo ou a funcionalidade sejam perdidos ou prejudicados? A técnica de “design responsivo” deve ser considerada para que o sítio ou portal se adapte ao tamanho da tela quando o usuário aumentar o tamanho das páginas (utilizando CTRL/COMMAND + para aumentar e CTRL/COMMAND - para diminuir).

5.3 O sítio ou portal se adapta adequadamente com zoom de 200%, exibindo as informações importantes e funcionalidades sem barras laterais de rolagem?

6. Conteúdo textual

6.1 Os textos contidos na página são de fácil compreensão e, para os textos de conhecimento mais avançados, estão disponibilizadas informações suplementares que expliquem ou ilustrem o conteúdo principal?

6.2 Na primeira ocorrência de siglas, abreviaturas ou palavras incomuns (ambíguas, desconhecidas ou utilizadas de forma muito específica), está disponibilizada sua explicação ou forma completa?

6.3 Os textos contidos na página possuem alinhamento consistente entre diferentes seções, preferencialmente alinhados à esquerda?

7. Legendas, transcrições e audiodescrição

Conteúdos em vídeo ou áudio devem ter alternativas textuais e em Língua Brasileira de Sinais presentes na página. O usuário deve compreender o sentido das imagens em movimento e seus sons. Para conteúdos em vídeo com áudio (audiovisual), é necessária a inserção de legendas ou Closed Caption e da janela de Libras. Já para conteúdos informacionais apenas sonoros (exemplo: arquivo MP3), deve haver uma transcrição em texto.

7.1 Todos os vídeos ou áudios possuem alternativa em texto?

7.2 A alternativa textual possui o mesmo conteúdo que está sendo apresentado pelo vídeo ou pelo áudio?

7.3 Existe tradução para Libras em todo conteúdo de áudio, vídeo e texto?

7.4 Existe audiodescrição em todos os vídeos? Para conteúdos informacionais apenas no formato vídeo, é necessário que exista audiodescrição. Ela é responsável por informar os eventos, acontecimentos e outras informações visuais em forma de áudio.

7.5 Há mecanismo para ativar, parar, pausar, silenciar ou ajustar o volume de qualquer som que se reproduza na página?

ANEXO ÚNICO À PORTARIA Nº 03/SMPED-GAB, DE 04 DE FEVEREIRO DE 2019.

ANEXO I

LISTA DE VERIFICAÇÃO PARA ANÁLISE MANUAL DE ACESSIBILIDADE EM PORTAIS E SÍTIOS ELETRÔNICOS DO ART. 2º, § 2º, DA PORTARIA Nº 08/SMPED-GAB/2018.

Objetivo e Metodologia

Esta lista de verificação visa identificar barreiras de acessibilidade na navegação de portais e sítios eletrônicos. Baseia-se no uso do navegador Google Chrome e da extensão NoCoffee Vision Simulator. Para a realização dos testes de navegação acessível e de entendimento de um sítio ou portal eletrônico (análise manual/simulação da navegação pelo usuário), deve ser utilizado um dos seguintes leitores de tela:

- JAWS for Windows (pago - 30 dias grátis)

https://www.freedomscientific.com/Downloads/JAWS

- NVDA (grátis)

https://www.nvaccess.org/download/

- VoiceOver (nativo no MacOS e no iOS)

- TalkBack (nativo no Android)

Critérios – Lista para verificação manual de acessibilidade digital

As respostas às perguntas contidas na lista de verificação a seguir devem ser afirmativas (sim), exceto para as recomendações destacadas.

1. Navegação na página

Navegando pelos links do sítio ou portal eletrônico com as teclas TAB (para avançar) e SHIFT + TAB (para voltar).

1.1 É possível utilizar a tecla TAB e as demais teclas do teclado sem impedimento e acessar todos os links e elementos de formulário da página?

1.2 O conteúdo dos links é claro e informa qual página será aberta?

1.3 Caso haja links adjacentes (sequência de links), estes estão separados explicitamente de forma que não há cacofonia (confusão ou extrema repetição), quando se ouve uma sequência longa de links?

2. Estrutura, navegação por cabeçalhos e por blocos de conteúdos

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. Pelo leitor de tela, deve ser possível navegar de um cabeçalho a outro e verificar a estrutura da página. A maioria dos leitores de tela utiliza o atalho "H" do teclado em combinação com os números de 01 a 06. A codificação da Estrutura, dos cabeçalhos, dos blocos de conteúdos e dos outros elementos no código-fonte da página quando estão no padrão W3C e de forma semântica melhoram substancialmente a navegação e experiência do usuário com deficiência.

2.1 A hierarquia de cabeçalhos existe e está clara?

2.2 Os cabeçalhos estão ordenados e não há repetição do nível de cabeçalho \h1\>?

2.3 A leitura e tabulação estão ordenadas de forma lógica e intuitiva?

2.4 O título da tabela está definido e localizado no primeiro elemento da tabela?

2.5 Há um resumo dos dados de tabelas extensas e/ou é possível compreender a complexidade da tabela informacional?

2.6 Em tabelas de dados simples, estão associadas células de dados às células de cabeçalho?

2.7 Existe aviso antes da atualização automática periódica da página (‘refresh’), do redirecionamento automático para uma nova página e/ou na abertura de uma nova aba ou janela?

2.8 Todas as funções da página são disponibilizadas via teclado, sem bloquear o foco ou fixá-lo em um elemento da página?

2.9 Elementos que recebem o foco pelo teclado estão claramente marcados, ficando evidentes e passíveis de serem clicados?

2.10 Todos os scripts, conteúdos dinâmicos, interfaces de controle e outros elementos programáveis contidos nas páginas (por exemplo: plugins de visualização de PDF, gráficos de pizza dinâmicos, carrossel com troca de slide, entre outros) são acessíveis? Caso contrário, existe conteúdo equivalente?

2.11 É possível acessar todo o conteúdo em lista e em seu(s) sub-nível(is)?

2.12 As cores do plano de fundo e do primeiro plano estão suficientemente contrastantes?

2.13 Inexistem efeitos visuais piscantes, intermitentes ou cintilantes? 

2.14 O idioma principal da página está identificado?

2.15 Os elementos que possuem conteúdo em um idioma diferente do principal estão devidamente identificados?

2.16 Em resumo, é possível compreender a estrutura da página de forma que não gere confusão e se saiba qual informação será obtida ou quais ações e tarefas devem ser executadas com clareza?

2.17 Caso haja Pop-ups (moldais), estes são acessíveis?

2.18 As páginas são acessíveis e responsivas em dispositivos móveis

Nota: Recomenda-se aderência aos itens abaixo, porém não obrigatoriamente.

1. Crie âncoras para ir direto a um bloco de conteúdo como, por exemplo: o primeiro link da página é o "Ir para o conteúdo principal", o segundo link é o “Ir para o menu”, o terceiro link é o “Ir para pesquisa”, o quarto link é o “Ir para o rodapé”.

2. Utilização de elementos do tipo tabelas (<TABLE>) apenas para dados tabulares e não para efeitos de disposição dos elementos da página.

3. Abertura de novas instâncias de ‘abas ou janelas’ apenas com solicitação/ permissão do usuário.

4. O Html5 (ou o código-fonte da página) é desenvolvido seguindo os padrões da W3C e de forma semântica.

3. Imagens acessíveis

Os testes abaixo visam verificar se os textos alternativos que descrevem as imagens lidas pelo software leitor de tela correspondem exatamente ao que as imagens mostram. Imagens que fazem parte do contexto da página (como um logotipo ou a foto que ilustra uma notícia) são consideradas imagens relevantes. Imagens decorativas, como fundo da página e bordas, não são consideradas relevantes.

3.1 Todas as imagens relevantes têm um texto alternativo claro e relacionado à imagem?

3.2 Todas as informações textuais da página são acessíveis por leitores de telas  sem necessidade de OCR?

3.3 Há imagens mapeadas? Estão acessíveis?

3.4 Há infográficos (ou outros tipos de conteúdo visual complexo)? Estão acessíveis ou com texto equivalente?

4. Preenchimento e navegação em formulários

Ao se navegar por formulários, não deve haver barreiras que impeçam que o usuário passe de campo em campo e acione botões. As instruções devem ser claras e os rótulos devem estar relacionados com cada campo. Os softwares leitores de tela devem ler cada campo e relacioná-lo com seu devido rótulo.

4.1 Os campos de formulário da página possuem um título claro / compreensível?

4.2 As informações sobre o preenchimento dos formulários são claras?

4.3 Os campos de preenchimento obrigatório estão indicados não apenas por cor diferenciada?

4.4 Há alternativa em texto para os botões de imagem de formulário e essa descreve com clareza a ação que será executada?

4.5 As etiquetas de texto (labels ou rótulos) estão associadas aos seus campos correspondentes no formulário?

4.6 Os campos dos formulários com informações relacionadas estão agrupados logicamente, e o propósito ou natureza dos agrupamentos está explicitado claramente?

4.7 Mensagens de erro e avisos são claros? É possível acessá-los facilmente?

4.8 Quando ocorre erro ou engano em alguma digitação, é possível corrigi-lo?

4.9 Quando houver anti-spam para liberação de envio dos dados (captcha), estes itens estão disponíveis também em áudio e texto?

4.10 Os estados dos botões (desabilitado, mouse over, etc.) são indicados de forma clara e acessível?

4.11 Os estados dos botões (desabilitado, mouse over, etc.) são indicados de forma clara e acessível?

5. Tamanho e relacionamento de elementos

Verificação de problemas em relação ao tamanho dos elementos presentes no sítio ou portal eletrônico. Elementos muito pequenos podem prejudicar o uso para muitas pessoas.

Utilize o Google Chrome, e a extensão "NoCoffee Vision Simulator", opção "Flutter (nystagmus)" definida em 100, para dificultar a interação com os elementos presentes na página e movimente o cursor sobre os menores links e elementos da página durante o teste.

5.1 É fácil clicar nos elementos da página?

5.2 É possível aumentar e diminuir o tamanho das fontes do sítio ou portal através do browser sem que o conteúdo ou a funcionalidade sejam perdidos ou prejudicados? A técnica de “design responsivo” deve ser considerada para que o sítio ou portal se adapte ao tamanho da tela quando o usuário aumentar o tamanho das páginas (utilizando CTRL/COMMAND + para aumentar e CTRL/COMMAND - para diminuir).

5.3 O sítio ou portal se adapta adequadamente com zoom de 200%, exibindo as informações importantes e funcionalidades sem barras laterais de rolagem?

6. Conteúdo textual

6.1 Os textos contidos na página são de fácil compreensão e, para os textos de conhecimento mais avançados, estão disponibilizadas informações suplementares que expliquem ou ilustrem o conteúdo principal?

6.2 Na primeira ocorrência de siglas, abreviaturas ou palavras incomuns (ambíguas, desconhecidas ou utilizadas de forma muito específica), está disponibilizada sua explicação ou forma completa?

6.3 Os textos contidos na página possuem alinhamento consistente entre diferentes seções, preferencialmente alinhados à esquerda?

7. Legendas, transcrições e audiodescrição

Nota: Recomenda-se aderência aos itens abaixo, porém não obrigatoriamente.

Conteúdos em vídeo ou áudio devem ter alternativas textuais e em Língua de Sinais presentes na página. O usuário deve compreender o sentido das imagens em movimento e seus sons. Para conteúdos em vídeo com áudio (audiovisual), é necessária a inserção de legendas ou Closed Caption e da janela de Libras. Já para conteúdos informacionais sonoros (exemplo: arquivo MP3), deve haver uma transcrição em texto.

7.1 Todos os vídeos ou áudios possuem alternativa em texto?

7.2 A alternativa textual possui o mesmo conteúdo que está sendo apresentado pelo vídeo ou pelo áudio?

7.3 Existe tradução para Libras em todo conteúdo de áudio, vídeo e texto?

7.4 Existe audiodescrição em todos os vídeos? Para conteúdos informacionais apenas no formato vídeo, é necessário que exista audiodescrição. Ela é responsável por informar os eventos, acontecimentos e outras informações visuais em forma de áudio.

7.5 Há mecanismo para ativar, parar, pausar, silenciar ou ajustar o volume de qualquer som que se reproduza na página?

ANEXO II

MODELO DE AUTORIZAÇÃO DO ART. 4º, IV DA PORTARIA Nº 08/SMPED-GAB/2018

AUTORIZAÇÃO PARA AMPLO ACESSO AO SÍTIO OU PORTAL

Eu (para pessoa física: nome completo, nacionalidade, CPF, estado civil, endereço completo / para pessoa jurídica: nome completo do representante legal, razão social, CNPJ, cargo, endereço completo da sede), responsável pelo sítio ou portal ______________, autorizo, de acordo com o previsto no inciso IV do artigo 4º da PORTARIA Nº 08/SMPED-GAB/2018, que a Secretaria Municipal da Pessoa com Deficiência - SMPED e a Comissão Permanente de Acessibilidade - CPA terão a garantia de amplo acesso às páginas a serem avaliadas, conforme indicação realizada pelo requerente (art. 4º, inciso V).

Por fim, segue abaixo o nome de usuário (login) e senha para propiciar o acesso da SMPED e da CPA a ambientes restritos com a plena garantia de que a referida liberação seja protegida e com as transações bloqueadas:

* nome de usuário (login):

* senha:

São Paulo, __ de _______ de 20___.

_________________________

(Nome e assinatura do requerente)

ANEXO III

MODELO DE TERMO DE COMPROMISSO - ART. 4º, IV, DA PORTARIA Nº 08/SMPED-GAB/2018

TERMO DE COMPROMISSO DE MANUTENÇÃO DA ACESSIBILIDADE DIGITAL

Eu (para pessoa física: nome completo, nacionalidade, CPF, estado civil, endereço completo / para pessoa jurídica: nome completo do representante legal, razão social, CNPJ, cargo, endereço completo da sede), responsável pelo sítio ou portal ______________, comprometo-me a, durante a vigência do prazo de validade do Selo de Acessibilidade Digital concedido ao sítio ou portal ___________________________________________________, manter sua acessibilidade: na porcentagem de aderência às recomendações do Modelo de Acessibilidade em Governo Eletrônico igual ou superior ao indicado em Parecer Técnico de aprovação do Selo e em cumprimento à lista de verificação manual de acessibilidade em portais e sítios eletrônicos. Estou ciente de que o descumprimento deste compromisso poderá resultar na revogação do referido Selo de Acessibilidade Digital, conforme previsto no art. 8º, § 4º da PORTARIA Nº 08/SMPED-GAB/2018.

São Paulo, __ de _______ de 20___.

_________________________

(Nome e assinatura do requerente)

ANEXO IV

MODELO DE DECLARAÇÃO DO ART. 6º, § 1º DA PORTARIA Nº 08/SMPED-GAB/2018

DECLARAÇÃO

Eu (para pessoa física: nome completo, nacionalidade, CPF, estado civil, endereço completo / para pessoa jurídica: nome completo do representante legal, razão social, CNPJ, cargo, endereço completo da sede), responsável pelo sítio ou portal ______________, declaro para os devidos fins, de acordo com o previsto no artigo 6º, § 1º da PORTARIA Nº 08/SMPED-GAB/2018, ciência dos avisos indicados pelo Parecer Técnico nº ______ devidamente encaminhado pela Secretaria Municipal da Pessoa com Deficiência, referente à avaliação do sítio ou portal: __________________________________________________ e que o mesmo está em conformidade com as recomendações apontadas pelos avisos supracitados.

São Paulo, __ de _______ de 20___.

_________________________

(Nome e assinatura do requerente)

ANEXO V

MODELO DE DECLARAÇÃO DE MANUTENÇÃO DE ACESSIBILIDADE - CAPUT DO ART. 8º DA PORTARIA Nº 08/SMPED-GAB/2018

DECLARAÇÃO DE MANUTENÇÃO DA ACESSIBILIDADE – DMA

De acordo com o previsto no caput do artigo 8º da PORTARIA Nº 08/SMPED-GAB/2018, eu (para pessoa física: nome completo, nacionalidade, CPF, estado civil, endereço completo / para pessoa jurídica: nome completo do representante legal, razão social, CNPJ, cargo, endereço completo da sede), responsável pelo sítio ou portal ______________, declaro a manutenção da acessibilidade do sítio ou portal: ___________________________________________________ na porcentagem de aderência às recomendações do Modelo de Acessibilidade em Governo Eletrônico igual ou superior ao indicado no Parecer Técnico nº _______ e em cumprimento à lista de verificação manual de acessibilidade em portais e sítios eletrônicos, também conforme indicado no referido Parecer. Portanto, solicito a renovação por 1 (um) ano do Selo de Acessibilidade Digital nº ___________.

São Paulo, __ de _______ de 20___.

_________________________

(Nome e assinatura do requerente)

Este texto não substitui o original publicado no Diário Oficial da Cidade de São Paulo

Alterações

  1. Portaria SMPED nº 3/2019 - Altera o inciso I e o parágrafo 2º, do inciso II, do artigo 6º e o Anexo I da Portaria.