Publicado em 23 de outubro de 2024
Nesta postagem, aprenda a usar o novo componente da Web <baseline-status> no
seu site e os logotipos de referência em apresentações sempre que você escrever ou
falar sobre recursos da plataforma da Web.
A maioria dos desenvolvedores já teve a experiência de procurar uma solução para um problema de desenvolvimento da Web, encontrar um artigo que descrevesse a solução perfeita e perceber no final que ela só está disponível em um navegador. Ou ficar animado com o recurso que um palestrante está descrevendo e, em seguida, descobrir que ele é experimental. Queríamos melhorar isso nos sites para desenvolvedores do Chrome e, nos últimos dois anos, adicionamos dados de compatibilidade da MDN às nossas postagens.
No entanto, a referência torna as coisas ainda mais claras. Em vez de verificar versões individuais do navegador, você pode verificar se um recurso está disponível para todos e, portanto, pronto para uso sem preocupações. Ou saiba que ele é o valor de referência recém-disponibilizado e, portanto, interoperável, mas, como um novo recurso, talvez você queira considerar estratégias de substituição. Aqui no web.dev, começamos a adicionar um novo componente de status de referência a algumas das nossas páginas. Você pode conferir na postagem do blog sobre CSS font-size-adjust.
Adicionar o componente ao site
O componente da Web não é apenas para nós. Estamos felizes em compartilhar o
componente <baseline-status> com você. Esse recurso está pronto para uso para mostrar
o status de referência no conteúdo que você cria. O componente pode ser instalado pelo
npm ou pré-compilado de uma CDN.
Leia as instruções de instalação.
Depois de instalado, mostre o status de um recurso, conforme mostrado no seguinte HTML para
font-size-adjust.
<baseline-status featureId="font-size-adjust"></baseline-status>
O componente será atualizado automaticamente quando um recurso passar de disponibilidade limitada para recém-disponível e, em seguida, para disponível para todos.
Encontre o featureId
O featureId transmitido para o componente é o nome do recurso no
repositório web-features.
O componente recebe o status do recurso com base nos dados coletados pelo
projeto de recursos da Web.
Adicionar logotipos de referência
Se você estiver publicando algo impresso, em PDF ou apresentando em uma conferência, os logotipos provavelmente serão úteis para mostrar o status naquele momento. O painel Status da plataforma da Web pode ajudar você a verificar o status de referência de qualquer recurso.
Os logotipos de referência são licenciados para você usar em todos os seus materiais. Faça o download deles nos formatos PNG e SVG.
Informe onde você usa o valor de referência
Gostaríamos de saber onde a linha de base está sendo usada. Faça uma PR e adicione um link para onde você a usou em Baseline in the wild.
Você tem outras ideias de integração?
Você tem alguma ideia de como integrar a referência de outra forma? Talvez você tenha uma ferramenta para desenvolvedores que possa incluir essas informações ou um produto que se beneficiaria ao compartilhar a versão de referência usada pelo painel de administração. Mencione um problema com suas ideias, teremos prazer em ajudar.