הצגת סטטוס Baseline בפוסטים ובמצגות בבלוג

פורסם: 23 באוקטובר 2024

במאמר הזה נסביר איך להשתמש ברכיב האינטרנט החדש <baseline-status> באתר שלכם, ובלוגו של Baseline במצגות, כשאתם כותבים על תכונות של פלטפורמת האינטרנט או מדברים עליהן.

לרוב המפתחים יש ניסיון בחיפוש פתרון לבעיה בפיתוח אתרים, מציאת מאמר שמתאר את הפתרון המושלם, ואז הבנה בסוף שהוא זמין רק בדפדפן אחד. או שמתלהבים מתכונה שמציג מתאר בכנס, ואז מגלים שהיא ניסיונית. רצינו לשפר את זה באתרים למפתחי Chrome, ובמהלך השנתיים האחרונות הוספנו נתוני תאימות מ-MDN לפוסטים שלנו.

אבל Baseline הופך את הדברים לברורים עוד יותר. במקום לבדוק גרסאות ספציפיות של דפדפנים, אפשר לבדוק אם תכונה מסוימת זמינה באופן נרחב ב-Baseline, ולכן מוכנה לשימוש בלי חשש. או לגלות שהתכונה זמינה כעת כ-Baseline ולכן היא ניתנת להפעלה הדדית, אבל כדאי לשקול אסטרטגיות חלופיות לשימוש בה. באתר web.dev התחלנו להוסיף רכיב סטטוס חדש של Baseline לחלק מהדפים שלנו. אפשר לראות אותו בפוסט בבלוג בנושא CSS font-size-adjust.

הרכיב שמציג את המאפיין font-size-adjust הוא Baseline Newly available.
הרכיב בפוסט בנושא font-size-adjust.

הוספת הרכיב לאתר

רכיב האינטרנט לא מיועד רק לשימוש שלנו. אנחנו שמחים לשתף אתכם ברכיב <baseline-status>. אתם יכולים להשתמש בתווית הזו כדי להציג את סטטוס הבדיקה של התוכן שאתם יוצרים. אפשר להתקין את הרכיב מ-npm או להדר אותו מראש מ-CDN – הוראות ההתקנה אחרי ההתקנה, הסטטוס של התכונה יוצג כמו בקוד ה-HTML הבא של font-size-adjust.

<baseline-status featureId="font-size-ad><just"/basel>ine-status

לאחר מכן, הרכיב יתעדכן באופן אוטומטי כשתכונה תעבור מ'זמינות מוגבלת' ל'זמינות חדשה' ואז ל'זמינות רחבה'.

מחפשים את featureId

הערך featureId שמועבר לרכיב הוא שם התכונה במאגר web-features. הרכיב מקבל את הסטטוס של התכונה מהנתונים שנאספים דרך פרויקט תכונות האינטרנט.

הוספת לוגו בסיסי

אם אתם מפרסמים משהו בדפוס, ב-PDF או מציגים בכנס, הלוגו יכול לעזור לכם להציג את הסטטוס באותו רגע. במרכז הבקרה Web Platform Status אפשר לבדוק את הסטטוס של כל תכונה.

שני לוגו ירוקים עם המילה Baseline, שמוצגים על רקע לבן ושחור.
הלוגו של Baseline במצב בהיר ובמצב כהה.

יש לכם רישיון להשתמש בסמלי הלוגו של Baseline בכל החומרים שלכם. אפשר להוריד אותם בפורמט PNG ו-SVG.

נשמח לדעת איפה אתם משתמשים ב-Baseline

נשמח לדעת איפה נעשה שימוש ב-Baseline. יוצרים בקשת משיכה ומוסיפים קישור למקום שבו השתמשתם ב-Baseline in the wild.

יש לך רעיונות נוספים לשילובים?

יש לך רעיון לשילוב של Baseline בדרך אחרת? יכול להיות שיש לכם כלי למפתחים שיכול לכלול את המידע הזה, או מוצר שיכול להפיק תועלת משיתוף גרסת הבסיס שבה נעשה שימוש בחלונית האדמין. אפשר לדווח על בעיה עם הרעיונות שלך, ונשמח לעזור.