Publié le 23 octobre 2024
Dans cet article, découvrez comment utiliser le nouveau composant Web <baseline-status> sur votre propre site et les logos de référence dans les 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à cherché une solution à un problème de développement Web, trouvé un article qui décrit la solution parfaite, puis réalisé au bout du compte qu'elle n'est disponible que dans un seul navigateur. Ou vous vous réjouissez de la fonctionnalité décrite par un conférencier, pour découvrir qu'elle est expérimentale. C'est pourquoi nous avons souhaité améliorer 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 posts.
Cependant, la référence permet de clarifier les choses. Plutôt que de vérifier les versions de navigateur individuelles, vous pouvez vérifier si une fonctionnalité est largement disponible et donc prête à l'emploi sans souci. Vous pouvez également apprendre qu'il s'agit de Baseline Newly disponible et interopérable, mais en tant que nouvelle fonctionnalité, pour laquelle vous souhaiterez peut-être envisager des stratégies de remplacement. Sur web.dev, nous avons commencé à ajouter un nouveau composant d'état de référence à certaines de nos pages. Vous pouvez le voir dans l'article de blog sur font-size-adjust CSS.
Ajouter le composant à votre site
Le composant Web n'est pas réservé à nous. Nous sommes ravis de vous présenter le composant <baseline-status>. Vous pouvez l'utiliser pour afficher l'état de référence sur le contenu que vous créez. Le composant peut être installé à partir de npm ou précompilé à partir d'un CDN. Lisez 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-adjust"></baseline-status>
Le composant se met ensuite à jour automatiquement lorsqu'une fonctionnalité passe de la disponibilité limitée à la disponibilité en ligne complète.
Recherchez l'featureId.
Le featureId transmis au composant est le nom de l'élément géographique dans le dépôt web-features.
Le composant obtient l'état de l'élément géographique à partir des données collectées via le projet d'éléments géographiques Web.
Ajouter des logos de référence
Si vous publiez un document au format papier, au format PDF ou 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 d'une fonctionnalité.
Les logos Baseline sont concédés sous licence pour que vous puissiez les utiliser dans tous vos supports. Téléchargez-les au format PNG et SVG.
Indiquez-nous où vous utilisez Baseline.
Nous aimerions savoir dans quels domaines Baseline est utilisé. Créez un PR et ajoutez un lien là où vous l'avez utilisé vers 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 ? Vous disposez peut-être d'un outil de développement pouvant inclure ces informations ou d'un produit qui serait utile de pouvoir partager la version de référence utilisée par le panneau d'administration. Envoyez-nous vos idées. Nous serons ravis de vous aider.