Publicado: 27 de maio de 2026
Bem-vindo ao resumo mensal da linha de base. Em abril de 2026, alguns recursos CSS e utilitários matemáticos de precisão tornaram-se disponíveis recentemente, enquanto elementos semânticos estruturais e outras adições de API da Web tornaram-se amplamente disponíveis, juntamente com acontecimentos na comunidade de desenvolvedores.
Linha de base e acessibilidade em 2026
Construir para a web significa construir uma experiência que todos possam usar e uma peça recente do A11y Up defende que a contabilização das necessidades de acessibilidade é mais eficaz quando os desenvolvedores dependem de padrões da web. Por algum tempo, os engenheiros lançaram soluções JavaScript personalizadas e muitas vezes pesadas para recriar padrões acessíveis que agora fazem parte da plataforma web. Estas soluções personalizadas são por vezes frágeis, propensas a quebrar sob tecnologia de apoio e são difíceis de manter.
O artigo destaca que, à medida que os recursos da plataforma web alcançam a interoperabilidade entre navegadores, eles tornam o desenvolvimento com a acessibilidade em mente uma tarefa mais eficaz. O uso de recursos da Web para atingir objetivos comuns e padrões de interface do usuário lida com grande parte do trabalho pesado, expondo suavemente a semântica correta diretamente aos leitores de tela e aos utilitários de navegação do teclado. A linha de base atua como um guia aqui, sinalizando o momento em que um recurso da web está maduro o suficiente para ser avaliado e usado em seus projetos.
Recursos básicos recentemente disponíveis
Os recursos nesta seção são suportados desde abril de 2026 no conjunto principal do navegador e agora estão disponíveis no Baseline recentemente.
CSS contrast-color() função
Mecanismos de tema dinâmico e componentes personalizáveis forçaram os desenvolvedores a manter vários sistemas de cores para acomodar a preferência do usuário por alto contraste. O CSS contrast-color() função transfere essa carga de manutenção inteiramente para o navegador. Ao passar uma cor de entrada básica para a função, o mecanismo avalia e retorna uma cor complementar altamente contrastante, normalmente mapeando para preto ou branco, dependendo de qual oferece a pontuação de legibilidade mais alta.
.card-header {
background-color: var(--dynamic-bg-color);
/* Automatically resolves to the highest-contrast text color */
color: contrast-color(var(--dynamic-bg-color));
}
Isso permite que você atenda a padrões acessíveis de legibilidade, sem uma solução personalizada ou CSS difícil de manter. Embora você ainda deva ficar de olho nas opções de cores de tons médios, esta função reduz o CSS padrão necessário para lidar com essa acomodação do usuário. Você pode saber mais no Página de referência do MDN para contrast-color().
Math.sumPrecise()
Somando sequências de números usando loops padrão ou métodos como Array.prototype.reduce() pode resultar em perda de precisão de ponto flutuante. Isto pode afetar cálculos financeiros importantes ou totais de telemetria.
O Math.sumPrecise() método resolve esse problema. Ele aceita um iterável de números e executa uma rotina de precisão segura para fornecer uma soma precisa. Dê uma olhada na mecânica do Documentação MDN para Math.sumPrecise().
Recursos básicos amplamente disponíveis
Os recursos a seguir tornaram-se amplamente disponíveis no Baseline, o que significa que agora são amplamente compatíveis e utilizáveis em seus projetos.
elemento
O HTML O elemento atua como um wrapper explícito para controles de formulário, mecanismos de filtragem e utilitários de envio que representam coletivamente uma experiência de pesquisa em um aplicativo da web.
Ao mudar um elemento contendo para o tag, você fornece um benefício de acessibilidade aos usuários. O navegador atribui automaticamente uma função de referência ARIA implícita de search ao elemento, eliminando a necessidade de especificar role="search" no element. This lets screen readers identify and help users navigate to search interfaces. Read the implementation details on the MDN page for the elemento.
Acesso à chave pública de autenticação da Web
Deixar de usar senha com a API Web Authentication (WebAuthn) agora é menos complexo graças ao amplo suporte para extratores diretos de propriedades no AuthenticatorAttestationResponse interface. Com métodos como getPublicKey() e getPublicKeyAlgorithm()o navegador extrai detalhes da chave pública para você sem precisar trabalhar com dados binários brutos. Saiba mais sobre essas propriedades e como usá-las no Página MDN para AuthenticatorAttestationResponse.
String.prototype.isWellFormed() e String.prototype.toWellFormed()
As strings JavaScript são codificadas em UTF-16, que mapeia caracteres complexos e emojis em pares Unicode. Se uma string for cortada sem levar em conta isso, metades isoladas de um par substituto - conhecidas como substitutos solitários - permanecerão, resultando em texto malformado.
isWellFormed() permite que os desenvolvedores verifiquem se uma string contém substitutos solitários e retorna um booleano. Se uma string falhar na validação, você pode chamar toWellFormed() para substituir os substitutos não autorizados pelo caractere de substituição Unicode padrão (U+FFFD). Isso é útil antes de chamar funções como encodeURI()que lançará um URIError ao encontrar entradas malformadas. Saiba como esses métodos funcionam em a documentação do MDN para String.prototype.isWellFormed().
Reflexão do atributo ARIA
A atualização dos estados de acessibilidade em elementos interativos exigia viagens de ida e volta por meio de métodos de atributos DOM padrão - por exemplo, element.setAttribute('aria-expanded', 'true'). A reflexão do atributo ARIA simplifica isso espelhando propriedades de acessibilidade como propriedades de objeto.
O Element interface reflete atributos ARIA diretamente para propriedades de instância como element.ariaExpanded, element.ariaCheckede element.ariaHidden. Isso permite modificar os estados de acessibilidade usando a sintaxe de notação de ponto:
// Clean and readable state updates
toggleButton.ariaExpanded = toggleButton.ariaExpanded === "true" ? "false" : "true";
Tratar os alvos ARIA como propriedades JavaScript permite que estruturas de UI e ferramentas de gerenciamento de estado coordenem contextos assistivos de maneira mais confiável e ajuda a manter os contextos do leitor de tela alinhados com o estado real do seu aplicativo. Para uma lista completa de propriedades refletidas, confira o Guia MDN sobre Element propriedades da instância.
Isso é um envoltório
Diga-nos se perdemos alguma coisa relacionada ao Baseline e garantiremos que isso seja capturado em uma edição futura! Se você tiver alguma dúvida ou quiser fornecer feedback sobre o Baseline, você pode registrar um problema em nosso rastreador de problemas.