אין במסמך גדלים קריאים של גופנים

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

איך נכשלת הביקורת של Lighthouse על גודל הגופן

Lighthouse מסמן דפים עם גדלי גופן קטנים מדי שקשה לקרוא בנייד:

ביקורת של Lighthouse מראה שגודל הגופן בדף לא קריא

‫Lighthouse מסמן דפים שבהם גודל הגופן של 40% או יותר מהטקסט קטן מ-12 פיקסלים. אם דף לא עובר את הביקורת, Lighthouse מציג את התוצאות בטבלה עם ארבע עמודות:

מקור מיקום המקור של קבוצת כללי ה-CSS שגורמת לטקסט להיות בלתי קריא.
Selector הבורר של קבוצת הכללים.
% מהטקסט בדף אחוז הטקסט בדף שמושפע מסט הכללים.
גודל הגופן הגודל המחושב של הטקסט.

איך פותרים את הבעיה: גופנים שלא קלים לקריאה

בודקים את גדלי הגופן בקובץ ה-CSS. ההמלצה היא להשתמש בגודל גופן של 12px לפחות ב-60% לפחות מהטקסט בדף.

איך לפתור בעיה של הגדרת אזור תצוגה חסרה

אם בדוחות של Lighthouse מופיעה ההמלצה Text is illegible because of a missing viewport config, add a <meta name="viewport" content="width=device-width, initial-scale=1"> tag to the <head> of your document.

מידע נוסף זמין במאמר אין תג <meta name="viewport"> עם width או initial-scale.

משאבים

קוד המקור של הביקורת Document does not use legible font sizes