Publié le 23 octobre 2024
Dans cet article, découvrez comment utiliser le nouveau composant Web <baseline-status> sur votre propre site, ainsi que les logos Baseline dans vos présentations, chaque fois que vous écrivez ou parlez des fonctionnalités de la plate-forme Web.
La plupart des développeurs ont déjà recherché une solution à un problème de développement Web, trouvé un article décrivant la solution idéale, puis réalisé à la fin qu'elle n'était disponible que dans un seul navigateur. Ou encore, vous vous enthousiasmez pour une fonctionnalité décrite par un conférencier, avant de découvrir qu'elle est expérimentale. Nous souhaitions améliorer cet aspect sur nos sites pour les développeurs Chrome. Au cours des deux dernières années, nous avons ajouté des données de compatibilité provenant de MDN à nos articles.
La référence permet toutefois de clarifier encore davantage les choses. Plutôt que de vérifier les versions individuelles des navigateurs, vous pouvez vérifier si une fonctionnalité est largement disponible dans la référence et donc prête à être utilisée sans souci. Ou apprenez qu'il s'agit d'une fonctionnalité de base nouvellement disponible et donc interopérable, mais que vous pourriez envisager des stratégies de remplacement pour cette nouvelle fonctionnalité. Sur web.dev, nous avons commencé à ajouter un nouveau composant d'état de référence à certaines de nos pages. Vous pouvez le voir sur l'article de blog sur CSS font-size-adjust.
Ajouter le composant à votre site
Le composant Web n'est pas réservé à notre usage. Nous sommes ravis de vous présenter le composant <baseline-status>. Vous pouvez l'utiliser pour afficher l'état de référence du contenu que vous créez. Le composant peut être installé à partir de npm ou précompilé à partir d'un CDN. Consultez les instructions d'installation.
Une fois installé, affichez l'état d'une fonctionnalité comme indiqué dans le code HTML suivant pour font-size-adjust.
<baseline-status featureId="font-size-ad><just"/basel>ine-status
Le composant se mettra ensuite à jour automatiquement lorsqu'une fonctionnalité passera de la disponibilité limitée à la disponibilité générale, en passant par la disponibilité récente.
Trouvez l'featureId.
Le featureId transmis au composant est le nom de la fonctionnalité dans le dépôt web-features.
Le composant obtient l'état de la fonctionnalité à partir des données collectées par le projet de fonctionnalités Web.
Ajouter des logos de référence
Si vous publiez quelque chose au format papier ou PDF, ou si vous présentez un contenu lors d'une conférence, les logos peuvent être utiles pour indiquer l'état à ce moment-là. Le tableau de bord État de la plate-forme Web peut vous aider à vérifier l'état de référence de n'importe quelle fonctionnalité.
Vous êtes autorisé à utiliser les logos Baseline dans tous vos supports. Téléchargez-les aux formats PNG et SVG.
Indiquez-nous où vous utilisez Baseline
Nous aimerions savoir où Baseline est utilisé. Créez une demande d'extraction et ajoutez un lien vers l'endroit où vous l'avez utilisé dans Baseline in the wild.
Avez-vous d'autres idées d'intégration ?
Avez-vous une idée pour intégrer Baseline d'une autre manière ? Peut-être disposez-vous d'un outil de développement qui pourrait inclure ces informations ou d'un produit qui gagnerait à pouvoir partager la version de référence utilisée par le panneau d'administration. Signalez un problème concernant vos idées. Nous serons ravis de vous aider.