התקנת מונה בלי להזיז את הפריסה

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

שמירה על המידות שנוצרו

יש לבחור את העיצוב בשירות Stats4U ולהעתיק את קוד ההטמעה שלו. במונה תמונה, יש לשמור על הרוחב והגובה כשהקוד שנוצר כולל אותם. המידות האלה מתארות את יחס הממדים של התמונה ומאפשרות לדפדפן לשמור מקום לפני שהתמונה מגיעה. אין להעתיק מידות מעיצוב אחר.

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

<img src="COUNTER_IMAGE_URL" width="ACTUAL_WIDTH" height="ACTUAL_HEIGHT" alt="Visitor statistics">

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

התאמה למכל בלי להסתיר את הבעיה

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

1. יש לטעון את הדף בחיבור איטי ולצפות בתוכן שסביב המונה.
2. יש לבדוק את התוצאה ב־320 וב־360 פיקסלים של CSS. יש לבדוק בדף עצמו תנועה הצידה.
3. יש לחסום זמנית את בקשת התמונה בכלי הפיתוח של הדפדפן. המקום השמור והקישורים שסביבו אמורים עדיין להתנהג באופן סביר.

אין לדחות את בקשת הספירה בטעות

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

הטמעת JavaScript האסינכרונית שנוצרה מפרידה בין המעקב להתקנה פשוטה של תמונה בלבד, ונדרשת לאירועים נוספים. יש לשמור על ההטמעה שנוצרה במקום לשלב כמה קטעי קוד לאותו מונה. אם הפריסה יציבה אבל הסכומים עדיין לא צפויים, יש לבדוק בנפרד את המיקום ואת בקשות כלי המעקב.

השלב הבא

יש להשתמש במדריך ההטמעה שמתאים לפלטפורמת האתר.

לפתיחת מדריך ההטמעה

MDN: <img> – width, height, alt, loading