לא מספק תוכן חלופי כש-JavaScript לא זמין

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

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

Lighthouse מסמן דפים שאין בהם תוכן חלק כש-JavaScript לא זמין:

הביקורת של Lighthouse שמציגה את הדף לא מכילה תוכן מסוים כש-JS לא זמין

מערכת Lighthouse משביתה את JavaScript בדף ולאחר מכן בודקת את ה-HTML של הדף. אם קוד ה-HTML ריק, הביקורת תיכשל.

איך לוודא שבדף יש תוכן ללא JavaScript

שיפור הדרגתי הוא נושא גדול שנוגע במחלוקת. מחנה אחד אומר שכדי לדבוק באסטרטגיה של שיפור הדרגתי, הדפים צריכים להיות מסודרים בשכבות כך שלתוכן בסיסי ולפונקציונליות של דף יהיה צורך ב-HTML בלבד. לדוגמה, ראו Progressive Enhancement: What it, and How להשתמש It של Smashing Magazine.

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

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

בדפים שבהם חובה להסתמך על JavaScript, אחת השיטות היא להשתמש ברכיב <noscript> כדי להתריע בפני המשתמש שיש צורך ב-JavaScript בדף. זה עדיף על דף ריק כי הדף הריק משאיר את המשתמשים לא בטוחים אם יש בעיה בדף, בדפדפנים או במחשבים שלהם.

כדי לבדוק איך האתר נראה וביצועים כש-JavaScript מושבת, אפשר להשתמש בתכונה השבתת JavaScript בכלי הפיתוח ל-Chrome.

משאבים